javascript - 手动传递signed_pa​​rameters后的Facebook NoAuthorizationError

Question

我在尝试使客户端登录正常工作时遇到了很多问题，因此在这里我要引用大量其他问题……没有一个问题可以为我解决问题。

语境

服务器端登录可以正常工作

使用JS SDK的

客户端登录在Safari *(未在Firefox或IE或非Chrome的移动设备上进行过测试)上运行良好，但在Chromet中未在中进行测试，这就是这个问题(我的大多数用户都使用Chrome)因此非常重要)

gem 版本:

ruby (2.1.2)

rails(4.1.1)

oauth(0.4.7)

oauth2(1.0.0)

omniauth(1.2.2)

omniauth-facebook(2.0.0)

omniauth-oauth2(1.2.0)

这是针对处于开发模式的应用程序，作为开发人员，我绝对有权登录

*通过正常工作，我的意思是，如果您只是从Ryan Bates的RailsCast( http://railscasts.com/episodes/360-facebook-authentication?view=asciicast)复制了代码，则无需任何其他操作

TL:DR;我正在传递以下应该正常工作的网址...

`http://localhost:3000/auth/facebook/callback?signed_request=ASDF.JOUYOUY`
// Obviously signed_request is a much longer string

...但仍然出现错误 OmniAuth::Strategies::Facebook::NoAuthorizationCodeError (must pass either a代码 parameter or a signed request (viasigned_request parameter or a fbsr_XXX cookie)):
进行故障排除+其他许多错误/可能的解决方案概述

下面的代码解决方案基于Ryan Bates的RailsCast的代码:

$('#sign_in').click (e) ->
  e.preventDefault()
  FB.login (response) ->
    window.location = '/auth/facebook/callback' if response.authResponse

障碍＃1:第三方Cookie是否被阻止？

不一定会导致错误，只是要使其出错，以使您无法将应用程序连接到Facebook。

将您的应用程序连接到Facebook首先需要您登录Facebook，因为代码 FB.login (response) -> window.location = "/auth/facebook/callback" if response.authResponse取决于 authResponse的有效性及其所包含的 signedRequest参数。

如果Cookie被阻止(即选中了“Chrome设置”>“高级设置”>“隐私”>“内容设置”>“阻止第三方Cookie”)，您将永远不会获得 authResponse对象。这是这里的问题/答案组合: FB.getLoginStatus always returns status='unknown'。换句话说，如果您执行 FB.getLoginStatus，则无论您单击“登录”按钮多少次，状态都将始终按照docs: https://developers.facebook.com/docs/reference/javascript/FB.getLoginStatus的 unknown返回。

到目前为止， 代码解决方案... :如果 FB.login返回 unknown的响应，则转移回服务器端登录。

$('#sign_in').click (e) ->
  e.preventDefault()
  FB.login (response) ->
    if response.status is "unknown"
      window.location = "/auth/facebook"
    else
      window.location = "/auth/facebook/callback"

障碍＃2:是否正确传递了参数？

如果您取消阻止第三方Cookie，则可能会遇到错误:

OmniAuth::Strategies::Facebook::NoAuthorizationCodeError (must pass either a `code` parameter or a signed request (via `signed_request` parameter or a `fbsr_XXX` cookie)):

尽管在 cookie: true中设置了 FB.init，但有时仍然无法传递参数。如中所述:

这个答案(OmniAuth Strategies Facebook NoAuthorizationCodeError (must pass either a `code` parameter or a signed request (via `signed_request` parameter):

Omniauth-facebook作者在此Github问题(https://github.com/mkdynamic/omniauth-facebook/issues/110)的最终评论中

...您可能需要手动输入 signed_request参数。快速提防。根据Facebook文档( https://developers.facebook.com/docs/facebook-login/using-login-with-games)， signedRequest需要具有由 .分隔的两个组件。不知道如何，但是我之前没有 .。分隔很重要，因为后半部分是包含 base64url信息的 code编码的JSON对象。

到目前为止， 代码解决方案... :手动将 signed_request参数附加到回调URL

$('#sign_in').click (e) ->
  e.preventDefault()
  FB.login (response) ->
    if response.status is "unknown"
      window.location = "/auth/facebook"
    else
      window.location = ("/auth/facebook/callback?signed_request=" + response.authResponse.signedRequest)

障碍＃3:仍然没有...仍然是与＃2 相同的错误

在这一点上也许只是我？

到目前为止， 代码解决方案... : super 学究，从 code解析出 signedRequest并追加到回调URL

$('#sign_in').click (e) ->
  e.preventDefault()
  FB.login (response) ->
    if response.status is "unknown"
      window.location = "/auth/facebook"
    else
      parsed_signed_Request = response.authResponse.signedRequest.split(".")
      key_info = base64_decode(parsed_signed_Request[1])
      // decoded via http://www.simplycalc.com/base64-source.php
      key_info_object = jQuery.parseJSON( key_info )
      window.location = ("/auth/facebook/callback?code=" + key_info_object["code"])

障碍＃4:已检测到CSRF，但并不是您认为的原因

现在，我直接进入了砖墙。当我如上所述运行代码时，我检测到错误CSRF。有一个不相关的原因可能会导致此错误:

如果您的Facebook应用处于开发模式，并且您正尝试实时登录用户，则会出现此错误。在这种情况下，FB不允许任何未列出的开发人员登录。请参阅此问题的第一个答案:Rails + omniauth + facebook - csrf detected

但是我的问题不是上面的问题，这是因为在没有 code参数的情况下提供了 state参数。现在，有答案说您可以通过在 provider_ignores_state: true配置文件中设置 omniauth.rb来解决此问题，请参阅上面提到的问题的第二个答案，但这不是我的解决方法。为什么？因为1)我不喜欢关闭专门设计来抵抗CSRF的功能，以及2)似乎仅在服务器端登录时才启动配置。添加它根本对我没有任何帮助。

这意味着＃3解决方案的更大问题是它试图将服务器端登录方法(采用 code和 state参数)与客户端登录方法(采用 signed_request参数)结合起来。

这意味着我回到了最初的问题……如何传递 signed_request以便客户端登录有效？

既然我已经在这个问题上徘徊了很多，那么让我指出我所看到的另一个错误。这个人有与Facebook错误( Dealing with Oauth 2.0-facebook gem error 100: This authorization code has been used)有关的答案，但除此之外，我发现了其他可以触发它的东西。

如本教程中的建议( https://coderwall.com/p/bsfitw)，您可以通过 match和 get来对回调路由进行 post编码。但是，当我这样做时，我的 logger显示了对Facebook的两个请求，第二个请求显然被阻止并触发了错误。 (这也意味着第一个请求确实通过了，并且用户已经得到授权/保存了数据，无论如何)。我的解决方案是将路由设置为:

match 'auth/:provider/callback', to: 'signups#create_facebook', via: [:get]

Answer 1

对于那些仍然有这个问题的人。尽量不要使用“localhost:3000”或其他任何内容。将/etc/hosts更改为新的网址，例如

127.0.0.1 abc.com

在developers.facebook.com上更改Facebook应用程序设置以指向新的URL(而不是使用localhost:3000，将其称为abc.com:3000)

并再次尝试使用js facebook登录名进行新登录。应该工作正常!