[英]How to use devise-jwt with devise for signin, signup and signout in rails api
我使用devise-jwt為后端使用rails並對前端部分做出反應。
我關注此https://github.com/waiting-for-dev/devise-jwt/blob/master/README.md
我的routes.rb文件包含:
Rails.application.routes.draw do
# remove this in production
require 'sidekiq/web'
mount Sidekiq::Web => '/sidekiq'
namespace :api, defaults: { format: 'json' } do
namespace :v1 do
devise_for :users, :controllers => {sessions: 'api/v1/sessions', registrations: 'api/v1/registrations'}
end
end
end
我的registrations_controller.rb(app / controllers / api / registrations_controller.rb)
class Api::V1::RegistrationsController < Devise::RegistrationsController
respond_to :json, :controllers => {sessions: 'sessions', registrations: 'registrations'}
before_action :sign_up_params, if: :devise_controller?, on: [:create]
def create
build_resource(sign_up_params)
if resource.save
render :json => resource, serializer: Api::V1::UserSerializer, meta: { message: 'Sign up success', token: request.headers["Authorization"] }, :status => :created
else
render :json => resource, adapter: :json_api, serializer: ActiveModel::Serializer::ErrorSerializer, meta: { message: 'Sign up success' }, :status => :created
end
end
protected
def sign_up_params
params.require(:sign_up).permit(:first_name, :last_name, :mobile, :email, :password, :password_confirmation)
end
end
我的sessions_controller.rb(app / controllers / api / sessions_controller.rb)
class Api::SessionsController < Devise::SessionsController
respond_to :json
end
我的application_controller.rb(app / controllers / application_controller.rb)
class ApplicationController < ActionController::Base
end
基本上,下一步是什么才能使令牌成為現實。 我很迷惑。 我將如何獲得訪問令牌並使用它在前端反應部分進行身份驗證。
假設您有服務器端設置,響應將包括Authorization Header
。
在前端,您將請求登錄並進行回調以捕獲響應:
window.fetch(LOGIN_URL, dataWithLoginInfo).then(response => {
const jwt = response.headers.get('Authorization').split('Bearer ')[1];
window.sessionStorage.setItem('jwt', jwt);
}).catch(handleError)
接下來使用Authorization
標頭包含以下內容:
const token = window.sessionStorage.getItem('jwt')
const headers = { Authorization: `Bearer ${token}` }
解碼后在應用中使用它:
import jwt from 'jsonwebtoken';
const decodedToken = jwt.decode(window.sessionStorage.getItem('jwt'));
if (decodedToken.isAdmin) {
return <AdminPage />;
} else {
return <NotAdminPage />;
}
您將使用https://www.npmjs.com/package/jwt-decode或https://www.npmjs.com/package/jsonwebtoken之類的內容來解碼令牌並從中讀取信息,如ID,角色,權限等
你真的需要遵循以下教程: https : //auth0.com/blog/secure-your-react-and-redux-app-with-jwt-authentication/或http://jasonwatmore.com/post/2017/ 12/07 / react-redux-jwt-authentication-tutorial-example 。 然后讓一些本地專家看看你的所有代碼。
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.