前提・実現したいこと
実現したいことは、PWAからユーザーがLINEログインを行い、callbackにてPWAに戻ることがしたいです。
現在CakePHPで作成したWebをPWA化しています。
その機能の中に、LINE、Facebookログイン機能が含まれており、Web版ではそれぞれ問題なく動作していました。
しかし、PWA化した後、LINEログインを実行すると、スマホの通常ブラウザが開き、ログイン後PWAに戻ってくれません。
(ブラウザ内でログイン出来ていることは確認しています)
発生している問題
Facebookでは、PWA内のブラウザでFacebookログイン画面が開き、PWA内で完結します。(LINEでもこれが理想です。)
現状、LINEログインをしようとすると下記の動作になります。
PWAにてLINEログインボタンを押下
↓
LINEアプリが開く
↓
スマホのデフォルトブラウザにてLINEログイン画面が開く
↓
LINEログイン後、デフォルトブラウザでWebのログインが完了する※ここでLINEログイン完了後、PWAに戻ってほしい。
試したこと
①LINEapiとの連携時に渡すredirectURIにてPWAのURLを入れました。LINEDevelopertoolにも追記してます。
javascript
1 url = "https://access.line.me/oauth2/v2.1/authorize?"; 2 url += "response_type=code&client_id=hogehoge"; 3 url += "&redirect_uri=hoge"; 4 url += "/?utm_source=pwa";
結果:× (変化なし)
②明示的にPWA内でブラウザを開くように記載しました。
Javascript
1 window.open(url, "_blank", "noreferrer");
結果:LINEアプリの入っていない端末なら〇。LINEアプリが入っていると×
③他サイトでPWA化+LINEログインを実現しているサイトがないか確認。
PinterestがPWA化+LINEログインを実装されていましたが、ホームに追加し確認したところ、LINEログインは出来ていなさそうでした。
※動作環境:iPhoneSE2 iOS14.7.1
補足情報(FW/ツールのバージョンなど)
LINEアプリの入っていない端末で確認したところ、ログインができました。
しかし、ほとんどのユーザーがLINEアプリを使用しているため、LINEアプリが入っている状態でもログインができるようにしたいです。
初めての質問でわかりにくい表現があるかもしれませんので、質問していただければと思います。
PWAにてLINEログインを実現されたことがあったり、実現方法がわかる方、
何卒ご教授をお願いいたします。
あなたの回答
tips
プレビュー