0

この記事に従って、Firebase をバックエンド サービスとして Ionic アプリ用の OAuth を作成しました。Ionic Lab でアプリを立ち上げることができ、ソーシャル アイコンが表示されました。しかし、アイコンをクリックしても何も起こりません。

私のコードが使用していることを知っているだけで、それcordova-plugin-inappbrowserについての知識はほとんどありません。対応するアイコンをクリックしたときに表示される Facebook または Twitter のポップアップを除いていますが、表示されないようです。

コンソールに次のエラーが表示されます。

Facebook アイコンをクリックすると、次のようになります。

Refused to display 'https://www.facebook.com/login.php?
skip_api_login=1&api_key=150011636022826…
&display=popup&locale=en_US&logger_id=fe62445f-81aa-405e-b35f-
80f8fd220707' in a frame because it set 'X-Frame-Options' to 'DENY'.

Twitter アイコンをクリックすると、次のようになります。

Refused to display 'https://api.twitter.com/oauth/authenticate?
oauth_token=nSzk7gAAAAAAuTInAAABV456ulg' in a frame because an ancestor 
violates the following Content Security Policy directive: "frame-ancestors 
'self' https://tweetdeck.twitter.com https://tdapi-
staging.smf1.twitter.com https://tdapi-staging.atla.twitter.com 
https://tweetdeck.localhost.twitter.com".`

これを修正するにはどうすればよいですか?

手動で行うionic serveと、アプリがブラウザーに読み込まれ、Facebook アイコンをクリックすると、ページが Facebook ログインにリダイレクトされます。

PS: 私はこの Ionic Framework を使い始めて 1 日経ちました。

4

1 に答える 1

1

他の人に役立つ可能性があるため、解決策を見つけて投稿します。

プロジェクトのクローンを作成した場所からのGitHub リンク。次に、メソッドが存在するwww/js/controllers.jsファイルに移動します。$scope.login()DashCtrl

Auth.$authWithOAuthRedirect(authMethod).then(function(authData) {
      console.log(authData);
    })

これは、別のページにリダイレクトしようとしていて、ブラウザでは正常に動作しますが、アプリ/イオンラボなどでは失敗するため、問題を引き起こしたスニペットでした。

作業が Ionic アプリのバージョンに固有の場合は、代わりに次のようにします。

Auth.$authWithOAuthPopup(authMethod).then(function(authData) {
          // after successfully logging in the user - do your magic stuff here
          console.log(authData);
        });
于 2016-10-04T12:02:09.017 に答える