在 devise_token_auth 中成功 Oauth2 授权后如何将登录信息发送到前端？

Question

我将devise_token_auth用于 Email 和基于 Google Oauth2 的身份验证（为此使用omniauth-google-oauth2 gem）。 我已经成功地通过 Google Oauth2 流程存储了用户注册/登录的登录信息。 信息包括：

{"auth_token"=>"token here", "client_id"=>"client id here", "uid"=>"uid here", "expiry"=>1620492005, "config"=>nil, "oauth_registration"=>true}

上述信息的流程是

1. 访问 http://localhost:3000/auth/google_oauth2。 这会将您重定向到 Google 身份验证屏幕
2. 用户选择帐户并授予权限。
3. 我的应用程序的 Oauth 成功回调在 http://localhost:3000/auth/google_oauth2/callback 执行

第一步执行的代码是

module DeviseTokenAuth
  class OmniauthCallbacksController < DeviseTokenAuth::ApplicationController
    attr_reader :auth_params

    before_action :validate_auth_origin_url_param
    
    def omniauth_success
      get_resource_from_auth_hash
      set_token_on_resource
      create_auth_params

      if confirmable_enabled?
        # don't send confirmation email!!!
        @resource.skip_confirmation!
      end

      sign_in(:user, @resource, store: false, bypass: false)

      @resource.save!

      yield @resource if block_given?

      render_data_or_redirect('deliverCredentials', @auth_params.as_json, @resource.as_json)
    end
  end
end

我面临的问题：

1. 尽管@resource和@auth_params包含所有必要的信息，但sign_in方法调用并未设置@current_user 。
2. 如何通知我的前端应用程序有关登录信息（令牌，client_id，uid）？

render_data_or_redirect('deliverCredentials', @auth_params.as_json, @resource.as_json)

此调用不会重定向或呈现任何内容，而是保持在同一页面上 URL 它显示为 http://localhost:3000/auth/google_oauth2/callback#

我现在基本上有三个问题：

1. 如何使用devise_token_auth根据传入的身份验证标头设置current_user ？ 我在 controller 中添加了以下行，但仍然无法设置@current_user

include DeviseTokenAuth::Concerns::SetUserByToken

也许是因为我错误地发送了身份验证标头？ 请参阅下面的第三点。

2. 我应该如何将登录信息发送到我的前端应用程序？ 我是否以某种方式修改上述方法以将登录信息发送到我的前端应用程序？

3. 为了发出经过身份验证的请求，我应该在哪里放置 auth 标头？

• 当使用带有devise_token_auth作为身份验证提供程序的 devise_token_auth 时，我必须发送 3 件来发出经过身份验证的请求，即access-token 、 client_id和uid
• 现在，对于 Google/Facebook 等提供商，我是否设置所有这些标头？

我已经使用 postman 来测试以下两个但它失败了未经授权的错误

1. 在 headers 中发送access-token 、 client_id和uid
2. 在授权标头中发送Bearer my_token 。

Answer 1

为了让它工作，我们必须重写DeviseTokenAuth的OmniAuthCallbacks controller 并更新它的render_data_or_redirect 方法。

render_data_or_redirect的默认定义是

def render_data_or_redirect(message, data, user_data = {})
  if ['inAppBrowser', 'newWindow'].include?(omniauth_window_type)
    render_data(message, user_data.merge(data))
  elsif auth_origin_url

    redirect_to DeviseTokenAuth::Url.generate(auth_origin_url, data.merge(blank: true))
  else
    fallback_render data[:error] || 'An error occurred'
  end
end

以下routes.rb和custom_omniauth_callbacks_controller.rb需要进行更改才能使其与j-toker库一起使用。

在路由文件中

# config/routes.rb

mount_devise_token_auth_for 'User', at: 'auth', controllers: {
  omniauth_callbacks: "devise_token_auth/custom_omniauth_callbacks"
}

CustomOmniAuthCallbacksController的定义是

# app/controllers/devise_token_auth/custom_omniauth_callbacks_controller.rb

module DeviseTokenAuth
  class CustomOmniauthCallbacksController < DeviseTokenAuth::OmniauthCallbacksController
    protected

    def render_data_or_redirect(message, data, user_data = {})
      if (['inAppBrowser', 'newWindow'].include?(omniauth_window_type) || auth_origin_url)

        redirect_to DeviseTokenAuth::Url.generate(auth_origin_url, data.merge(blank: true))
      else
        fallback_render data[:error] || 'An error occurred'
      end
    end
  end
end

现在在前端你需要配置j-toker

一、安装j-toker package、纱线package或npm ZEFE90A8E6034A7C840E8F8D

yarn add j-toker

或者

npm i j-toker

然后在您的 javascript 应用程序中，配置j-toker

import $ from "jquery";

$.auth.configure({
    apiUrl: "https://your-api-domain.com",
    emailSignInPath: "/auth/sign_in",
    signOutPath: "/auth/sign_out",
    emailRegistrationPath: "/auth",
    tokenValidationPath: "/auth/validate_token"

    authProviderPaths: {
      facebook: "/auth/facebook",
      google: "/auth/google_oauth2"
    }
  });