質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう!

新規登録して質問してみよう
ただいま回答率
85.35%
PWA(Progressive Web Apps)

PWA(Progressive Web Apps)は、アプリのようなWebサイトを指します。仕様が異なる様々なデバイスで表示でき、インストールも不要。さらに訪問し続けることでユーザーについて学び、強力なPWAとなります。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

CakePHP

CakePHPは、PHPで書かれたWebアプリケーション開発用のフレームワークです。 Ruby on Railsの考え方を多く取り入れており、Railsの高速性とPHPの機動性を兼ね備えています。 MVCやORMなどを「規約優先の考え方」で利用するため、コードを書く手間を省くことができます。 外部のライブラリに依存しないので、単体での利用が可能です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

Q&A

0回答

1627閲覧

PWAでLINEログインがしたい

namego

総合スコア0

PWA(Progressive Web Apps)

PWA(Progressive Web Apps)は、アプリのようなWebサイトを指します。仕様が異なる様々なデバイスで表示でき、インストールも不要。さらに訪問し続けることでユーザーについて学び、強力なPWAとなります。

PHP

PHPは、Webサイト構築に特化して開発されたプログラミング言語です。大きな特徴のひとつは、HTMLに直接プログラムを埋め込むことができるという点です。PHPを用いることで、HTMLを動的コンテンツとして出力できます。HTMLがそのままブラウザに表示されるのに対し、PHPプログラムはサーバ側で実行された結果がブラウザに表示されるため、PHPスクリプトは「サーバサイドスクリプト」と呼ばれています。

CakePHP

CakePHPは、PHPで書かれたWebアプリケーション開発用のフレームワークです。 Ruby on Railsの考え方を多く取り入れており、Railsの高速性とPHPの機動性を兼ね備えています。 MVCやORMなどを「規約優先の考え方」で利用するため、コードを書く手間を省くことができます。 外部のライブラリに依存しないので、単体での利用が可能です。

JavaScript

JavaScriptは、プログラミング言語のひとつです。ネットスケープコミュニケーションズで開発されました。 開発当初はLiveScriptと呼ばれていましたが、業務提携していたサン・マイクロシステムズが開発したJavaが脚光を浴びていたことから、JavaScriptと改名されました。 動きのあるWebページを作ることを目的に開発されたもので、主要なWebブラウザのほとんどに搭載されています。

0グッド

0クリップ

投稿2021/09/22 04:43

前提・実現したいこと

実現したいことは、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ログインを実現されたことがあったり、実現方法がわかる方、
何卒ご教授をお願いいたします。

気になる質問をクリップする

クリップした質問は、後からいつでもMYページで確認できます。

またクリップした質問に回答があった際、通知やメールを受け取ることができます。

バッドをするには、ログインかつ

こちらの条件を満たす必要があります。

guest

あなたの回答

tips

太字

斜体

打ち消し線

見出し

引用テキストの挿入

コードの挿入

リンクの挿入

リストの挿入

番号リストの挿入

表の挿入

水平線の挿入

プレビュー

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう!

ただいまの回答率
85.35%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

関連した質問