友だちの流入経路分析

2024.09.06

できること

・個別のQRコードを発行し、友だちがフォローした際に、流入元の情報が友だちレコードに表示・記録される。
・LINEの友だち登録済みのメールアドレスを取得可能。

設定方法

① LIFFアプリを取得する

手順 https://developers.line.biz/ja/docs/liff/registering-liff-apps/

step01 LINEログイン選択

step02 LIFF 選択し作成する
※エンドポイントURLは後で設定する。
LIFFIDとLIFF URLメモする。

※図のように、LIFFアプリのScopeにて「email」を取得可能にすれば、友だち登録済みのメールアドレスの取得が可能。

➁ LIFFのエンコードポイント用のSalesforce VFページ作成公開する。

設定⇒Visualforceページ⇒ FmlLineFiffPage のファイルからソースをコピーして新規VFページを作成する。
※以下ソースコードから作成してもよい

VFページコード例:
<apex:page controller="bfml.FmlLineWebHookCallback" cache="false" showHeader="false" sidebar="false" standardStylesheets="false" applyHtmlTag="false" applyBodyTag="false">
    <apex:includeScript value="https://static.line-scdn.net/liff/edge/2/sdk.js"/>
    <apex:includeScript value="/soap/ajax/50.0/connection.js"/>
    <apex:includeScript value="/soap/ajax/50.0/apex.js"/>
    <body>
        <div style="padding-top:5%;font-size:25px;text-align:center">友だち追加画面へ遷移...</div>
        <script>
            let param_liffid = '2007178752-3aGmWBwP';      //TODO liffId
            let param_redirect = 'https://lin.ee/pLjH98I'; //TODO 友だち追加URL
            //公式アカウントチャネルID
            let param_channelid = '{!JSENCODE($CurrentPage.parameters.c)}'; 
            //流入経路ID
            let srcfrom = '{!JSENCODE($CurrentPage.parameters.p)}';
            //TODO パラメータ追加する場合には下に追加してください。

            window.onload = function () {
                liff.init({ liffId: param_liffid })
                    .then(() => {
                        let email ;
                        // LIFFアプリが初期化された後に実行
                        if (liff.isLoggedIn()) {
                             const idToken = liff.getDecodedIDToken();
                            if (idToken) {
                                email = idToken.email;
                            }
                        } else {
                            // ログインしていない場合はログイン処理
                            liff.login();
                        }

                        liff.getProfile()
                            .then(profile => {
                                let parameters = {
                                    bfml__Mail__c: email,
                                    bfml__SourceOfTraffic__c: srcfrom,
                                    Id: profile.userId,
                                    //友だち項目API名: 値,  //その他カスタマイズ項目も追加可能
                                };

                                let fieldValues = {
                                    dealCommand: "line_member_update",      //固定
                                    channelid: param_channelid,             //LINEチャネルID
                                    dealUserKey: profile.userId,            //LINE ID
                                    dealContent: JSON.stringify(parameters),
                                };

                                bfml.FmlLineWebHookCallback.updateMemberInfo(JSON.stringify(fieldValues),function(result, event) {
                                    if (event.status) {
                                        // debug用メッセージ
                                    } else {
                                        // debug用メッセージ2
                                    }
                                }, {escape: false});

                                window.location= param_redirect;
                            }) .catch((err) => {
                                alert("liff getProfile error : " + err);
                            });
                    }) .catch((err) => {
                        alert("liff init error : " + err);
                    });
            }
        </script>
    </body>
</apex:page>

コピー後の改修点:
① 前後の <!– –> コメントを削除する。
➁ let param_liffid = ‘2003872552-DrXXXXXX‘; //TODO liffId →　上記のLIFFで置換
let param_redirect = ‘https://lin.ee/xR5XXXX‘; //TODO 友だち追加URL →　御社の公式アカウントのURLで置換　※友だち追加URLはこちら以下の部分から取得する。


上記作成したVFページこちら参照して公開する。
公開後、上記①のStep2にて作成したLIFFのエンコードポイントURLに更新する。
※設定例:「liffpageB」VFページのAPI名

③ DX-LINEにてQRコード作成する。

ホーム→設定・登録→すべて表示→
流入経路 新規作成する

図のように登録後に再度編集⇒保存を行うと、QRコードダウンロード作成される。
※LIFF URLは上記①のstep2で取得したURL

④　動作確認

上記作成した QRCodeダウンロードをクリックし、表示したQRコードから友だちフォロー頂くと、友だちレコードの以下の項目に値がセットされる。

・「流入経路」項目
　項目が表示されなかった場合、ページレイアウトを変更すれば表示される。

・「メールアドレス」項目
　LINEのメールアドレスが登録される。

・「認証済み」項目
　チェックが付くように更新する。

タイトルとURLをコピーしました