nraboy / ng-cordova-oauth

AngularJS oauth library for use with Apache Cordova projects
https://www.thepolyglotdeveloper.com
MIT License
456 stars 199 forks source link

Connection error on iOS 10 #307

Closed radix21 closed 7 years ago

radix21 commented 7 years ago

Hi there!

Few days ago, I told you about this. I've been searching on internet for a solution without success. Here's some info that Xcode show to me in the debug console, if you can give to me a light I will really appreciate so much:

After runs the app for test from Xcode to a device (iPhone 6SE with iOS 10.1.1) connected to my iMac, and try to connect with facebook shows this:

One thing in particular: When I push the button to connect with facebook, I need to exit app and get in again, at this time the facebook login page appears. The Xcode console log shows this:


2016-11-21 12:16:19.910116 StudioF[899:226606] Setting the WebView's frame to {{0, 0}, {320, 524}} 2016-11-21 12:16:19.922770 StudioF[899:226606] THREAD WARNING: ['InAppBrowser'] took '45.909180' ms. Plugin should use a background thread. 2016-11-21 12:16:20.472081 StudioF[899:226606] Snapshotting a view that has not been rendered results in an empty snapshot. Ensure your view has been rendered at least once before snapshotting or snapshot after screen updates. 2016-11-21 12:16:20.790583 StudioF[899:229198] PBItemCollectionServicer connection disconnected. 2016-11-21 12:16:23.291564 StudioF[899:226676] WF: _userSettingsForUser mobile: { filterBlacklist = ( ); filterWhitelist = ( ); restrictWeb = 1; useContentFilter = 0; useContentFilterOverrides = 0; whitelistEnabled = 0; } 2016-11-21 12:16:23.291679 StudioF[899:226676] WF: _WebFilterIsActive returning: NO 2016-11-21 12:16:24.683504 StudioF[899:226676] WF: _userSettingsForUser mobile: { filterBlacklist = ( ); filterWhitelist = ( ); restrictWeb = 1; useContentFilter = 0; useContentFilterOverrides = 0; whitelistEnabled = 0; } 2016-11-21 12:16:24.683591 StudioF[899:226676] WF: _WebFilterIsActive returning: NO 2016-11-21 12:16:24.688420 StudioF[899:226676] WF: _userSettingsForUser mobile: { filterBlacklist = ( ); filterWhitelist = ( ); restrictWeb = 1; useContentFilter = 0; useContentFilterOverrides = 0; whitelistEnabled = 0; } 2016-11-21 12:16:24.688494 StudioF[899:226676] WF: _WebFilterIsActive returning: NO 2016-11-21 12:16:24.831868 StudioF[899:226676] WF: _userSettingsForUser mobile: { filterBlacklist = ( ); filterWhitelist = ( ); restrictWeb = 1; useContentFilter = 0; useContentFilterOverrides = 0; whitelistEnabled = 0; } 2016-11-21 12:16:24.831941 StudioF[899:226676] WF: _WebFilterIsActive returning: NO 2016-11-21 12:16:27.823299 StudioF[899:226676] WF: _userSettingsForUser mobile: { filterBlacklist = ( ); filterWhitelist = ( ); restrictWeb = 1; useContentFilter = 0; useContentFilterOverrides = 0; whitelistEnabled = 0; } 2016-11-21 12:16:27.824719 StudioF[899:226676] WF: _WebFilterIsActive returning: NO 2016-11-21 12:17:18.405898 StudioF[899:226606] webView:didFailLoadWithError - -1004: Could not connect to the server.

ADICIONAL INFO: Cordova 6.4.0 android 6.0.0 ios 4.3.0

Plugins: cordova-plugin-inappbrowser 1.5.0 "InAppBrowser" cordova-plugin-whitelist 1.3.0 "Whitelist"

ngcordova.js V0.1.27-alpha ng-cordova-oauth.js V0.2.10 (2016-07-20)

CSP

<meta http-equiv="Content-Security-Policy"
          content="default-src *;
               connect-src 'self' https://appstudiof.com;
               script-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-inline' 'unsafe-eval'
                           https://*.google.com
                           https://*.gstatic.com
                           https://*.googleapis.com
                           https://*.firebaseio.com
                           https://*.appstudiof.com
                           https://graph.facebook.com
                           ;
               style-src  'self' 'unsafe-inline'
                           https://*.google.com
                           https://*.gstatic.com
                           https://*.googleapis.com
                           https://*.firebaseio.com
                           https://*.appstudiof.com
                           https://graph.facebook.com
                           ;
              img-src * data:;
              media-src *
        ">

In android everything works perfect

Thanks in advance!

radix21 commented 7 years ago

Hi again, Finally I solved my problem adding this to CSP tag gap://ready file:; But now I've another problem with my app, and I suspect it's something with the inappbrowser plugin. When I push the login with Facebook button inside of my app nothing happens, but if I push the "Home button" of the iPhone to show the "Fast App Switcher" immediately the Facebook login page appears and works. It's like this human interaction activate somehow the functionality

Do you have any idea? Maybe is a possible bug of this plugin for this version of iOS?

radix21 commented 7 years ago

This event only fires when the user leave the app:

In your plugin... window.cordova.InAppBrowser.open(flowUrl, '_blank', 'location=no,clearsessioncache=yes,clearcache=yes');

But Is going on with any target either: _self, _blank, or _system

nraboy commented 7 years ago

Let me add my two cents here...

I created a fresh Ionic 1 project as so:

ionic start AuthProject blank --v1
cd AuthProject
ionic platform add ios
ionic platform add android
ionic plugin add cordova-plugin-inappbrowser
bower install ng-cordova-oauth -S

When running ionic info on the project I end up with the following information:

Cordova CLI: 6.4.0 
Ionic CLI Version: 2.1.13
Ionic App Lib Version: 2.1.7
ios-deploy version: Not installed
ios-sim version: Not installed
OS: OS X El Capitan
Node Version: v4.6.0
Xcode version: Xcode 8.0 Build version 8A218a

The code in my www/js/app.js file which is pretty much vanilla looks like this:

angular.module('starter', ['ionic', 'ngCordovaOauth'])

.run(function($ionicPlatform) {
    $ionicPlatform.ready(function() {
        if(window.cordova && window.cordova.plugins.Keyboard) {
            cordova.plugins.Keyboard.hideKeyboardAccessoryBar(true);
            cordova.plugins.Keyboard.disableScroll(true);
        }
        if(window.StatusBar) {
            StatusBar.styleDefault();
        }
    });
})

.controller("ExampleController", function($scope, $cordovaOauth) {
    $scope.login = function() {
        $cordovaOauth.facebook("APP_ID_HERE", ["email"]).then(function(result) {
            alert(JSON.stringify(result));
        }, function(error) {
            console.log(error);
        });
    }
})

With all this said, it works fine on my iOS 10.0 simulator with no additional modifications. This includes no modifications to the default CSP items. The browser opens fine. I can log in, and it closes fine when I'm done with the authentication. I get my access token as a result.

So now some possible reasons for your problem:

  1. Maybe iOS 10.1 introduces something that didn't exist in 10.0?
  2. Maybe you are using a conflicting or dated plugin?
  3. Maybe your Facebook developer dashboard has an incorrect configuration for your application?

I don't have an iOS 10.1 simulator available to me at the moment, but I'll see about getting one in the next few days to test.

Until then, maybe the information I just provided helps you in some fashion?

Best,

radix21 commented 7 years ago

Hi nraboy! Thanks for answer. Your info was very usefull to confirm that my code always was right. The only difference is that you're using Ionic Framework and I'm using a simple base Cordova App. Finally I was able to fix my issue, it was a statement problem in CSP, I re-configure and this is how look now:

<meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval' 'unsafe-inline'
            https://graph.facebook.com;
          style-src 'self' 'unsafe-inline' 'unsafe-eval';
          script-src 'self' 'unsafe-inline' 'unsafe-eval'
            https://graph.facebook.com
            https://maps.googleapis.com;
          connect-src 'self' 
          https://maps.googleapis.com
          https://graph.facebook.com;
          media-src *; img-src * data:
          content:;
        ">

And works great! Thanks for your time boy! Blessings

nraboy commented 7 years ago

Didn't realize you were using vanilla Apache Cordova. Most people who open tickets are using Ionic Framework.

Glad you got it working and will direct anyone with similar problems here.

Best,