MongoDB Stitch在Facebook登录尝试打破登录过程时双重编码重定向URI?

问题描述 投票:0回答:1

我正在尝试使用基于Web的Todo App的MongoDB Stitch示例教程。我在Ubuntu 18.04 Bionic Beaver Linux工作站上使用Node.JS v10.14.2。

当我尝试使用Facebook登录时,登录过程失败,Facebook抱怨Stitch服务器生成的重定向URL未列入白名单,因此在尝试使用OAuth登录Facebook时被拒绝。在此Node模块中找到的此代码块期间生成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的值,它显示在Facebook登录过程的初始阶段生成的URL:

   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已加载到浏览器的位置。然后,针脚服务器为OAuth握手的下一段生成URL。我从它生成的URL中摘录了redirect_uri查询参数并将控制转移到,如下所示:

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

然后我手动解码重定向URI,因为它看起来不对。如果查看上面显示的redirect_uri查询参数,您将看到OAuth回调URI已使用encodeUri()方法进行了双重编码。这会导致Facebook OAuth服务器拒绝回调URI,因为在解码后,它看起来像下面显示的DECODED ONCE标签旁边显示的URL。

这会导致OAuth握手失败,因为它与您在下面标有“DECODED AGAIN”标签的URL不匹配。

根据MongoDB Stitch教程的指示,我将这个值放在“OAuth重定向URI”部分的Facebook OAuth“客户端OAuth设置”页面中。由于URL已经过双重编码,因此解码一次时的重定向URI与“DECODED AGAIN”值不匹配,登录过程失败。显然,我可以将“DECODED ONCE”值添加到列入白名单的URL列表中,但这样可以解决问题,因为它应该看起来像“DECODED AGAIN”中的完全解码值。

解码一次:

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

再次解码:

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

概括来说,当Facebook被要求使用Stitch生成的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 Stitch控制面板,我没有看到任何可能导致回调URL被Stitch传递给Facebook的东西,需要进行双重编码。谁能告诉我什么可能导致这种不必要的行为以及如何解决这个问题?

node.js mongodb facebook oauth mongodb-stitch
1个回答
1
投票

谢谢你的详细解释。我尝试重现你的问题,但我能够成功登录Facebook。

我还检查了Stitch服务器在重定向到Facebook时生成的URL,它与您在帖子中完全相同的双重编码URI。这意味着此行为是预期的,不应影响登录流程。

如果查看完整的URL,您会看到主URL(从“https://www.facebook.com/login.php”开始)有一个名为“next”的查询参数。 “next”参数是一个URL,因此需要进行URL编码。传递给“next”的URL具有“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添加到“有效OAuth重定向URI”列表中: https://stitch.mongodb.com/api/client/v2.0/auth/callback
  • 在Stitch控制台中,确保您的应用程序URL包含在Facebook提供程序的“重定向URI”列表中。这应该包括任何尾部斜杠。
  • 在您的应用程序代码中,确保在命中重定向URL时调用以下JS代码。这允许Stitch客户端SDK获取Stitch服务器执行的OAuth2流的结果:
  if (yourStitchClient.auth.hasRedirectResult()) {
    return yourStitchClient.auth.handleRedirectResult().then(user => {
        console.log("Authenticated as user: " + user);
    });
  }

查看https://docs.mongodb.com/stitch/authentication/facebook/以获取有关这些步骤的更多说明。

如果您在执行上述步骤后仍然无法使其工作,请告诉我,我会尽力帮您调试问题。

© www.soinside.com 2019 - 2024. All rights reserved.