エンジニアが知っておくべきLINEミニアプリとWebアプリの違い〜LIFFの仕組みから実装まで〜

はじめに

「既存のWebアプリをLINEから使えるようにしたい」「LINEミニアプリを開発してほしいと言われたが、通常のWebアプリと何が違うのか分からない」

こんな相談を受けるエンジニアが増えています。LINEミニアプリはHTML・CSS・JavaScriptで開発できるため、Web開発の延長線上にあるように見えますが、認証・メッセージ送信・公開フローなど、通常のWebアプリとは異なる点がいくつかあります。

この記事では実装の視点からLINEミニアプリとWebアプリの違いを整理します。

LINEミニアプリとは何か

一言で言うと「LIFF上で動くWebアプリ」

LINEミニアプリは、LIFF（LINE Front-end Framework）上で実行されるWebアプリケーションです。HTMLやCSS、JavaScriptといった通常のWeb技術で開発できますが、LIFF SDKを組み込むことでLINEのユーザー情報・メッセージ送信・位置情報などLINE固有の機能を利用できるようになります。

LIFFとLINEミニアプリの関係

もともとLIFFとLINEミニアプリは別の概念でしたが、2025年2月にLINEヤフーが正式に統合方針を発表しています。新規開発の場合はLINEミニアプリとして構築することが推奨されています。

WebアプリとLINEミニアプリの違い（実装視点で比較）

認証・ログインの違い

通常のWebアプリでは、メールアドレス・パスワードやOAuthを使ったログインフォームを自前で実装する必要があります。

// 通常のWebアプリ：フォームベースのログイン
loginForm.addEventListener('submit', async (e) => {
  e.preventDefault();
  const res = await fetch('/api/auth/login', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({
      email: e.target.email.value,
      password: e.target.password.value,
    }),
  });
  const { token } = await res.json();
  localStorage.setItem('token', token);
});

LINEミニアプリでは、LIFF SDKが認証を担います。ユーザーはLINEにログイン済みであればそのまま利用でき、ログインフォームが不要になります。

// LINEミニアプリ：LIFF SDKによる認証
import liff from '@line/liff';

await liff.init({ liffId: 'YOUR_LIFF_ID' });

if (!liff.isLoggedIn()) {
  liff.login(); // LINEのログイン画面へリダイレクト
} else {
  const profile = await liff.getProfile();
  console.log(profile.userId);      // LINEユーザーID
  console.log(profile.displayName); // LINEの表示名
  console.log(profile.pictureUrl);  // プロフィール画像URL
}

APIで取れる情報の違い

liff.getProfile() で取得できる主な情報は以下の通りです。

ユーザーの入力コストが大幅に下がるため、登録・ログイン時の離脱率を下げる効果があります。

メッセージ送信の違い

通常のWebアプリでユーザーに通知する場合、メールやプッシュ通知の仕組みを自前で構築する必要があります。

// 通常のWebアプリ：メール通知（サーバーサイド）
await sendEmail({
  to: user.email,
  subject: 'ご予約を承りました',
  body: '予約が完了しました。当日お待ちしております。',
});

LINEミニアプリでは、LIFFがチャット画面から起動された場合に liff.sendMessages() を使ってユーザーのトーク画面に直接メッセージを送信できます。開封率が高いLINEメッセージを活用できるのは大きなアドバンテージです。

// LINEミニアプリ：liff.sendMessages() でLINEに直接送信
await liff.sendMessages([
  {
    type: 'text',
    text: 'ご予約を承りました。当日お待ちしております！',
  },
]);

また、サーバーサイドからMessaging APIを使えば、任意のタイミングでLINEメッセージをプッシュ送信することも可能です。

デプロイ・動作環境の違い

通常のWebアプリはブラウザ上で動作しますが、LINEミニアプリはLINEアプリ内のWebViewで動作します。そのためいくつかの注意点があります。

CSSの一部プロパティや特定のJavaScript APIがLIFF Browser上で動作しない場合があるため、実機での動作確認が欠かせません。

公開フローの違い（審査）

通常のWebアプリはビルド・デプロイすれば即日公開できますが、LINEミニアプリには審査が必要です。

審査では以下のような観点がチェックされます。

• サービスのガイドライン準拠（利用規約・プライバシーポリシーの設置等）
• UIのガイドライン準拠（ヘッダーの改変禁止等）
• 実際の動作確認

開発スケジュールには審査期間を必ず組み込む必要があります。公開日が決まっている場合は、少なくとも1〜2週間（差し戻しがある場合はさらに日数が必要）の余裕を見ておくと安全です。また、差し戻しがあった場合は修正して再申請が必要になるため、余裕を持って申請することをおすすめします。

LINEミニアプリが向いているケース・向いていないケース

向いているケース

• デジタル会員証・スタンプカード: LINEアカウントで本人確認が完結するため導入コストが低い
• モバイルオーダー・予約: 認証不要でスムーズに利用開始でき、完了後のLINE通知も自然
• クーポン・キャンペーン: LINEの友だちへのシェア機能と組み合わせて拡散しやすい
• 既存LINE公式アカウントとの連携: リッチメニューからの導線が自然に作れる

向いていないケース

• SEOによる集客が主な場合: LINEミニアプリはGoogleにインデックスされないため、検索流入は見込めない
• LINE外のユーザーも対象にしたい場合: LINEアカウントが前提になるため、非LINEユーザーは利用不可
• 複雑なPC向けUIが必要な場合: LINEミニアプリはスマートフォン利用が前提

まとめ

WebアプリとLINEミニアプリの主な違いをまとめます。

LINEミニアプリは「LINEユーザーに対してスムーズな体験を提供したい」場面に強みがあります。一方で審査フローや動作環境の制約を理解した上で開発に臨むことが重要です。

Web開発の知識があれば比較的スムーズに習得できるので、ぜひ一度試してみてください。