【LINE】既存LIFFアプリにShareTargetPickerを導入する
はじめに
既存のLIFFアプリにShareTargetPickerを導入する方法を説明します。
GitHubはこちら。
ShareTargetPickerとは?
以下が参考になります。
Share Target Pickerがリリースされ、LIFFアプリからのメッセージ送信が大幅に強化されました。
Share Target Pickerとは、LIFFから送信先を選んでメッセージを送信することが出来る機能です。
これにより、
・トークルームやグループから開かれなかった場合でも、メッセージを送信できる
・LIFFアプリをLINE上で開いた場合だけではなく、ブラウザから開いた場合もメッセージを送信できる
・自分以外の友だちや自分が入っていないグループにもメッセージを送信させることができる
といったことが可能になります。
サンプル
https://yagi-eng.github.io/liff-reservation-githubpages/
送信ボタンをクリックするとLINEの友だち選択画面が表示され、テキストの送信先を選択できます。
導入
LINE Developersの変更
シェアターゲットピッカーをオンにします。
実装
以下のQiita記事で作成したLIFFアプリにShareTargetPickerを導入します。
【LIFF入門?】LIFFでLINE Offical Account(旧LINE@)上に予約フォームを作成する
以下のようにliff.jsを修正します。
gitのdiffは こちら です。
diffの方が何を追記すれば良いかわかりやすいかも。
$(document).ready(function () {
var liffId = "(自分のLiffIdを入力)";
initializeLiff(liffId);
})
function initializeLiff(liffId) {
liff
.init({
liffId: liffId
})
.then(() => {
if (!liff.isInClient() && !liff.isLoggedIn()) {
window.alert("LINEアカウントにログインしてください。");
liff.login();
}
})
.catch((err) => {
console.log('LIFF Initialization failed ', err);
});
}
function sendMessage(text) {
if (liff.isInClient()) {
sendMessages(text);
} else {
shareTargetPicker(text);
}
}
function sendMessages(text) {
liff.sendMessages([{
'type': 'text',
'text': text
}]).then(function () {
liff.closeWindow();
}).catch(function (error) {
window.alert('Failed to send message ' + error);
});
}
function shareTargetPicker(text) {
liff.shareTargetPicker([{
'type': 'text',
'text': text
}]).catch(function (error) {
window.alert('Failed to send message ' + error);
});
}
LINEトークから開いた場合は sendMessages
を使ってそのトーク上にメッセージが送信されるように、LINEトーク以外から開いた場合は shareTargetPicker
を実行するようにしました。
こうすることで、既存機能に影響なく導入することができます。
感想
LINE上で動作するものを作るの楽しいです。
これで仕事取れるようになるといいな。。
Author And Source
この問題について(【LINE】既存LIFFアプリにShareTargetPickerを導入する), 我々は、より多くの情報をここで見つけました https://qiita.com/yagi_eng/items/b5136dae10f2df8ce99a著者帰属:元の著者の情報は、元のURLに含まれています。著作権は原作者に属する。
Content is automatically searched and collected through network algorithms . If there is a violation . Please contact us . We will adjust (correct author information ,or delete content ) as soon as possible .