MongoDB Stitch дважды кодирует URI перенаправления во время попытки входа в Facebook, нарушая процесс входа? - PullRequest
Новая
       8

MongoDB Stitch дважды кодирует URI перенаправления во время попытки входа в Facebook, нарушая процесс входа?

0 голосов
/ 02 апреля 2019

Я пытаюсь использовать учебное пособие MongoDB Stitch для веб-приложения Todo.Я использую Node.JS v10.14.2 на станции Linux Ubuntu 18.04 Bionic Beaver.

Когда я пытаюсь войти в систему через Facebook, процесс входа в систему завершается неудачно, и Facebook жалуется, что URL-адрес перенаправления, созданный сервером Stitch, являетсяне внесен в белый список, и поэтому был отклонен при попытке войти в Facebook с помощью OAuth.URL генерируется во время этого блока кода, найденного в этом модуле узла: 

node_modules/mongodb-stitch-browser-core/dist/cjs/core/auth/internal/StitchAuthImpl.js

Вот код, который генерирует URL, который запускает процесс входа в систему.Он вызывает сервер Stitch, и сервер Stitch генерирует правильный URL, чтобы попросить Facebook войти в систему пользователя.Обратите внимание, я изменил код, но только , чтобы показать значение, которое генерировал вызов getAuthProviderRedirectRoute () .Других изменений не было. 

   StitchAuthImpl.prototype.loginWithRedirect = function (credential) {
        var _this = this;
        var _a = this.prepareRedirect(credential), redirectUrl = _a.redirectUrl, state = _a.state;
        this.requestClient.getBaseURL().then(function (baseUrl) {
            // ROS: We want to see the URL being created - ESM.
            let replaceUrl = baseUrl +
                _this.browserAuthRoutes.getAuthProviderRedirectRoute(credential, redirectUrl, state, _this.deviceInfo);
            _this.jsdomWindow.location.replace(replaceUrl);
        });
    };

Вот значение replaceUrl , которое показывает URL-адрес, созданный на этом начальном этапе процесса входа в Facebook: 

   replaceUrl = https://stitch.mongodb.com/api/client/v2.0/app/my_stitch_app/auth/providers/oauth2-facebook/login?redirect=http://localhost:8001/&state=<<redacted>>&device=<<redacted>>

Stitch генерирует этот URL для начала рукопожатия OAuth на Facebook.Как видно из кода, этот URL-адрес загружается в расположение браузера.Затем сервер стежков генерирует URL для следующего этапа рукопожатия OAuth.Я извлек аргумент запроса redirect_uri из URL-адреса, который он генерирует и передает элемент управления, как показано здесь: 

redirect_uri%3Dhttps%253A%252F%252Fstitch.mongodb.com%252Fapi%252Fclient%252Fv2.0%252Fauth%252Fcallback

Я затем вручную декодировал URI перенаправления, потому что онвыглядел неправильноЕсли вы посмотрите на приведенный выше аргумент запроса redirect_uri , то увидите, что URI обратного вызова OAuth был дважды закодирован с помощью метода encodeUri () .Это приводит к тому, что сервер OAuth Facebook отклоняет URI обратного вызова, поскольку после декодирования он выглядит как URL-адрес, показанный рядом с меткой DECODED ONCE , показанной ниже.

Это приводит к сбою рукопожатия OAuth, поскольку он не совпадает с URL-адресом, который вы видите ниже и помечен меткой "DECODED AGAIN" .

Это значение - то, что я указал на странице «Настройки OAuth клиента OAuth» в Facebook в разделе «Действительные URI перенаправления OAuth» в соответствии с инструкциями из учебника MongoDB Stitch.Поскольку URL был дважды закодирован, URI перенаправления при однократном декодировании не соответствует значению «DECODED AGAIN», и процесс входа в систему завершается неудачно.Очевидно, что я мог бы добавить значение «DECODED ONCE» в список URL-адресов, занесенных в белый список, но это только помогло бы решить проблему, поскольку оно должно выглядеть как полностью декодированное значение в «DECODED AGAIN».

DECODED ONCE : 

redirect_uri=https%3A%2F%2Fstitch.mongodb.com%2Fapi%2Fclient%2Fv2.0%2Fauth%2Fcallback

DECODED AGAIN : 

redirect_uri=https://stitch.mongodb.com/api/client/v2.0/auth/callback

Повторим, когда Facebook просят войти в систему пользователя с URL-адресом, созданнымСтежок, показанный ниже, Facebook не проходит процесс с сообщением об ошибке, также показанным ниже: 

https://www.facebook.com/login.php?skip_api_login=1&api_key=<<redacted>>&kid_directed_site=0&app_id=<<redacted>>%26redirect_uri%3Dhttps%253A%252F%252Fstitch.mongodb.com%252Fapi%252Fclient%252Fv2.0%252Fauth%252Fcallback

Ошибка Facebook : 

URL Blocked

This redirect failed because the redirect URI is not whitelisted in the app’s Client OAuth Settings. Make sure Client and Web OAuth Login are on and add all your app domains as Valid OAuth Redirect URIs.

Я искал стежок MongoDBПанель управления, и я нигде не вижу, что я мог ввести что-то, что привело бы к тому, что URL-адрес обратного вызова передавался Stitch в Facebook для двойной кодировки.Может кто-нибудь сказать мне, что может вызвать это нежелательное поведение и как это исправить?

1 Ответ

1 голос
/ 12 апреля 2019

Спасибо за подробное объяснение. Я попытался воспроизвести вашу проблему, но мне удалось войти в систему с Facebook успешно.

Я также проверил URL, который генерирует сервер Stitch при перенаправлении на Facebook, и это был точно такой же URI с двойным кодированием, который вы указали в своем сообщении. Это означает, что такое поведение ожидается и не должно влиять на поток входа в систему.

Если вы посмотрите полный URL-адрес, то увидите, что основной URL-адрес (начиная с "https://www.facebook.com/login.php")" имеет параметр запроса с именем "next". Параметр "next" является URL-адресом, поэтому для него требуется быть URL-кодированным. Этот URL-адрес, переданный «next», имеет параметр «redirect_uri», который также является URL-адресом, поэтому его также необходимо кодировать URL-адресом. Так как это URL-адрес в URL-адресе в URL, Вот почему вы видите двойную кодировку.

Я отформатировал URL с каждым параметром в новой строке, и каждый под-URL предназначен для демонстрации этого: 

https://www.facebook.com/login.php
    ?skip_api_login=1
    &api_key=<redacted>
    &kid_directed_site=0
    &app_id=<redacted>
    &signed_next=1
    &next=https%3A%2F%2Fwww.facebook.com%2Fdialog%2Foauth
        %3Faccess_type%3Doffline
        %26client_id%<redacted>

        // this is the double encoded URL
        %26redirect_uri%3Dhttps%253A%252F%252Fstitch.mongodb.com%252Fapi%252Fclient%252Fv2.0%252Fauth%252Fcallback

        %26response_type%3Dcode
        %26scope%3Demail%2Bpublic_profile
        %26state%3D<redacted>
        %26ret%3Dlogin
        %26fallback_redirect_uri%<redacted>
    &cancel_url=https%3A%2F%2Fstitch.mongodb.com%2Fapi%2Fclient%2Fv2.0%2Fauth%2Fcallback
        %3Ferror%3Daccess_denied
        %26error_code%3D200
        %26error_description%3DPermissions%2Berror
        %26error_reason%3Duser_denied
        %26state%3D<redacted>
    &display=page&locale=en_US

Чтобы логин Facebook работал, я бы гарантировал следующее:

  • В консоли Facebook убедитесь, что этот URL-адрес добавлен в список «Действительных URI перенаправления OAuth»:

  • В консоли Stitch убедитесь, что URL вашего приложения включен в список «URI перенаправления» для провайдера Facebook. Это должно включать любые косые черты.

  • В коде своего приложения убедитесь, что вы вызываете следующий код JS, когда ваш URL-адрес перенаправления ударил. Это позволяет клиентскому SDK Stitch получить результат потока OAuth2, выполненного сервером Stitch: 

  if (yourStitchClient.auth.hasRedirectResult()) {
    return yourStitchClient.auth.handleRedirectResult().then(user => {
        console.log("Authenticated as user: " + user);
    });
  }

Проверьте https://docs.mongodb.com/stitch/authentication/facebook/ для более подробного объяснения этих шагов.

Если после выполнения вышеуказанных действий у вас все еще возникают проблемы с его настройкой, дайте мне знать, и я постараюсь помочь вам решить проблему.

...