Building a Group Video Calling Service Inside a LINE App with AI, Without a Web Engineer (opens in new tab)
LINE’s LIFF enables web services to run directly inside the LINE app, turning a LINE Official Account into an interactive service platform rather than merely a notification channel. The LINE Planet team demonstrated this by building a group video-calling service with only a PM and an Android engineer, without a web engineer. The core architecture combines a LIFF web app, a small token-issuing app server, and LINE’s managed authentication and WebRTC infrastructure. ## Services Enabled by LINE OA and LIFF - **Professional consultations:** One-to-one video sessions with lawyers, financial planners, counselors, and other experts. - **Remote education:** Scheduled video lessons with separate rooms for multiple teachers and students, including screen sharing. - **Interactive live broadcasts:** Events for 500 to 10,000 simultaneous participants, including audience members joining conversations as panelists. - **In-game voice chat:** Real-time communication with LINE friends without switching to another app. ## Overall Architecture - **LIFF** provides the in-app web interface and automatically exposes LINE login information such as `userId` and `displayName`. - **LINE Planet** handles WebRTC media processing and global network infrastructure. - **The web app** uses the LINE Planet SDK to implement the group call experience. - **The app server** issues LINE Planet access tokens. - Firebase Cloud Functions can provide the app-server layer without managing separate server infrastructure. - The developers are responsible mainly for connecting these components; LINE handles authentication, media transport, and much of the underlying infrastructure. ## Required Preparation - Use Node.js 20 LTS or later with npm. - Deploy over HTTPS; local development can use ngrok. - Create a Business ID, developer account, and Provider in the LINE Developers Console. - Create a LINE Official Account and enable its Messaging API. - Create a LINE Login channel under the same Provider and register a LIFF app. - Record the LIFF ID because it is required for initialization. - Set the LINE Login channel to **Published** for the `shareTargetPicker` API, which supports inviting LINE friends. - Request a LINE Planet Console account and service ID from the LINE Planet team. ## Designing and Generating Room IDs - LIFF can collect call setup information and register it with the app server, reducing the amount of pre-call configuration. - Users can join simply by entering or following a room ID. - The example generates a random 16-character alphanumeric ID using `crypto.randomUUID()`. - If a `roomId` query parameter exists in an invitation link, the app restores and uses that room instead. - The same design can later support fixed rooms based on interests or automatically generated rooms for user groups. ## Building the Preview Screen - The preview screen lets users check their camera and microphone before entering a call. - Instead of directly calling `getUserMedia`, the example uses PlanetKit’s `MediaStreamManager`. - A single `MediaStreamManager` instance is reused from preview through the conference, avoiding repeated permission requests. - Camera input is created with `createMediaStream()` or replaced with `changeVideoInputDevice()`. - Microphone muting changes the audio track’s `enabled` flag, preventing another permission prompt in mobile webviews. - Mobile users can switch between front and rear cameras by resolving the appropriate device ID. - The sample UI includes camera and microphone toggles, camera-flip controls for mobile devices, and an “Enter” action. - The article notes that the sample focuses on the essential flow; production applications still need stronger security, error handling, and performance optimization. The practical recommendation is to treat LIFF and LINE Planet as managed building blocks: implement the web call interface and a minimal token server, while relying on LINE for user identity and PlanetKit for real-time media.