Facebook OAuth “Unsupported” in Chrome on iOS

Question

The Facebook OAuth popup is throwing an error in Chrome on iOS only. Both developers.facebook.com and google have turned up nothing about this. Ideas?

Answer 1

My 2 cents on this as noone of the answers were clear to me. Im firing the login js dialog on a button click, so now when it's chrome ios I check first if the user it's logged into facebook and if not I send them to the login window. The problem with this is that chome ios users needs to click connect button twice if they are not logged into facebook. If they are logged into facebook one click is enough.

 $( 'body' ).on( 'click', '.js-fbl', function( e ) {
        e.preventDefault();

        if( navigator.userAgent.match('CriOS') ) {
            // alert users they will need to click again, don't use alert or popup will be blocked
            $('
MESSAGE HERE
').insertAfter( $(this));
            FB.getLoginStatus( handleResponse );
        } else {
            // regular users simple login
            try {
                FB.login( handleResponse , {
                    scope: fbl.scopes,
                    return_scopes: true,
                    auth_type: 'rerequest'
                });
            } catch (err) {
                $this.removeClass('fbl-loading');

            }
        }
    });

That bit of code make it works for chrome ios users. On handle response I simple take care of fb response and send it to my website backend for login/register users.

var handleResponse = function( response ) {
    var $form_obj       = window.fbl_button.parents('.flp_wrapper').find('form') || false,
        $redirect_to    = $form_obj.find('input[name="redirect_to"]').val() || window.fbl_button.data('redirect');
    /**
     * If we get a successful authorization response we handle it
     */
    if (response.status == 'connected') {

        var fb_response = response;

        /**
         * Make an Ajax request to the "facebook_login" function
         * passing the params: username, fb_id and email.
         *
         * @note Not all users have user names, but all have email
         * @note Must set global to false to prevent gloabl ajax methods
         */
        $.ajax({...});

    } else {
         //if in first click user is not logged into their facebook we then show the login window
         window.fbl_button.removeClass('fbl-loading');
        if( navigator.userAgent.match('CriOS') )
            window.open('https://www.facebook.com/dialog/oauth?client_id=' + fbl.appId + '&redirect_uri=' + document.location.href + '&scope=email,public_profile', '', null);
    }
};

Hope it helps!