Javascript 为什么在访问安全页面时我没有重定向到/登录？

我正在重新创建这个问题，因为我不确定这是否是一个bug，之前为此创建的一个问题刚刚消失=/

描述 在从

react admin

v2升级到v3.3.0的过程中，我遇到了在重写

authProvider

后重定向到

/login

的问题

• 反应管理|

My

authProvider.js

包含以下方法：

export default function createAuthProvider(urls, client, options) {
  return {
    login: (params) =>  {
      return fetchLoginBatch(params, urls, client, options);
    },
    logout: (params) => params.jwt ? fetchLogout(makeRequestLogout(urls.logout, params.jwt), options) : Promise.resolve(),
    checkError: (error) => {
      const { status } = error;
      if (status === 401 || status === 403) {
        return Promise.reject();
      }
      return Promise.resolve();
    },
    checkAuth: (params) => params.jwt ? Promise.resolve() : Promise.reject(),
    getPermissions: (params) => params.jwt ? Promise.resolve(params.jwt.authorities) : Promise.resolve(),
    refreshJwt: (params) => params.jwt ? fetchRefreshJwt(makeRefreshJwtRequest(client.accessTokenUri, {
      grant_type: 'refresh_token',
      refresh_token: params.jwt.refresh_token,
    }, client), options) : Promise.resolve()
  };
}

如和中所述

预期 我希望被重定向到

/login

结果 相反，我停留在页面上，

checkAuth

被很好地调用，

jwt

是

null

可能的解决办法 使用参数将重定向更改为拒绝承诺：

    checkAuth: () => localStorage.getItem('token')
        ? Promise.resolve()
        : Promise.reject({ redirectTo: '/no-access' }),

但是添加

Promise.reject（{redirectTo:'/login'}）

即使代码运行也没有帮助

我尝试在

ra core/lib/sideEffect/auth.js中添加一些日志：

console.log('auth');

exports.handleCheck = function (authProvider) {
    console.log('handleCheck', authProvider);

    return function (action) {
        console.log('action', action);

        var payload, meta, error_1, redirectTo, errorMessage;

        console.log('redirectTo', redirectTo, 'meta', meta);

调用了
handleCheck
，但从未调用
action
，似乎不知何故忽略了这个传奇故事

问题:

客户端应该如何处理
权限
和
checkAuth
拒绝参数

我接下来应该检查什么以查看重定向失败的原因


ra核心
代码是如何遵循的？
您能仔细检查一下这一行吗

//authProvider.js
//检查请求是否有JWT（这可能是输入错误！）
-checkAuth：（params）=>params.jwt？Promise.resolve（）：Promise.resolve（），
//如果不是，我们应该拒绝，从而触发重定向。
+checkAuth：（params）=>params.jwt？Promise.resolve（）：Promise.reject（），

让我知道它是如何工作的。
这里是authProvider的一个示例，它与React Admin 2和React Admin 3.3.1一起工作

使用：

<Admin authProvider={authProvider(loginUrl, logoutUrl)} ...>

import storage from './storage'
import {
  AUTH_LOGIN,
  AUTH_LOGOUT,
  AUTH_ERROR,
  AUTH_CHECK,
  AUTH_GET_PERMISSIONS
} from 'react-admin'

import {
  LB_TOKEN,
  getTokenId
} from './token'

export const authProvider = (loginApiUrl, logoutApiUrl, noAccessPage = '/login') => {
  return (type, params) => {
    if (type === AUTH_LOGIN) {
      const request = new Request(loginApiUrl, {
        method: 'POST',
        body: JSON.stringify(params),
        headers: new Headers({ 'Content-Type': 'application/json' }),
      })

      return fetch(request)
        .then(response => {
          if (response.status < 200 || response.status >= 300) {
            throw new Error(response.statusText)
          }
          return response.json()
        })
        .then(({ ttl, ...data }) => {
          storage.save(LB_TOKEN, data, ttl)
          return Promise.resolve(data) 
        })
    }

    if (type === AUTH_LOGOUT) {
      const token = getTokenId()
      if (token) {
        storage.remove(LB_TOKEN) 

        if (logoutApiUrl) { 
          const request = new Request(`${logoutApiUrl}?access_token=${token}`, { 
            method: 'POST',
            headers: new Headers({'Content-Type': 'application/json'}),
          })

          return fetch(request)
            .then(response => {
              if (response.status !== 204) {
                console.error('authProvider - Logout, status:', response) 
              }
              return Promise.resolve() 
            })
        }
      }
      return Promise.resolve()
    }

    if (type === AUTH_ERROR) {
      const { status } = params 

      if (status === 401 || status === 403) {
        storage.remove(LB_TOKEN)
        return Promise.reject()
      }
      return Promise.resolve()
    }

    if (type === AUTH_CHECK) { 
      const token = storage.load(LB_TOKEN)

      if (token && token.id) {
        return Promise.resolve()
      } else {
        storage.remove(LB_TOKEN) 
        return Promise.reject({ redirectTo: noAccessPage })
      }
    }

    if (type === AUTH_GET_PERMISSIONS) {
      const token = storage.load(LB_TOKEN)

      if (token && token.user && token.user.roleId) {
        return Promise.resolve(token.user.roleId)
      } else {
        console.warn('Unknown user rights:', token)
        storage.remove(LB_TOKEN) 
        return Promise.reject({ redirectTo: noAccessPage }) 
      }
    }

    return Promise.reject(`authProvider - Unknown method, type: ${type}, params: ${params}`)
  }
}


从“./storage”导入存储
进口{
身份验证登录，
授权注销，
验证错误，
验证检查，
授权获取权限
}来自“react admin”
进口{
LB_代币，
盖托基尼
}来自“./token”
export const authProvider=（loginApiUrl、logoutapirl、noAccessPage='/login'）=>{
返回值（类型、参数）=>{
如果（类型===AUTH\u登录）{
const request=新请求（loginApiUrl{
方法：“POST”，
正文：JSON.stringify（params），
标题：新标题（{'Content Type'：'application/json'}），
})
返回获取（请求）
。然后（响应=>{
如果（response.status<200 | | response.status>=300）{
抛出新错误（response.statusText）
}
返回response.json（）
})
。然后（{ttl，…data}）=>{
存储。保存（LB_令牌、数据、ttl）
返回承诺。解析（数据）
})
}
如果（类型===AUTH\u注销）{
const token=getTokenId（）
如果（令牌）{
存储。删除（LB_令牌）
如果（logoutapirl）{
const request=new request（`${logoutapirl}？access_token=${token}`，{
方法：“POST”，
标题：新标题（{'Content-Type'：'application/json'}），
})
返回获取（请求）
。然后（响应=>{
如果（response.status！==204）{
console.error（'authProvider-注销，状态：'，响应）
}
返回承诺。解决（）
})
}
}
返回承诺。解决（）
}
如果（类型===验证错误）{
常量{status}=params
如果（状态===401 | |状态===403）{
存储。删除（LB_令牌）
返回承诺。拒绝（）
}
返回承诺。解决（）
}
如果（type==AUTH_CHECK）{
const token=storage.load（LB_token）
if（令牌和令牌.id）{
返回承诺。解决（）
}否则{
存储。删除（LB_令牌）
返回承诺。拒绝（{redirectTo:noAccessPage}）
}
}
if（type==AUTH\u GET\u权限）{
const token=storage.load（LB_token）
if（token&&token.user&&token.user.roleId）{
返回Promise.resolve（token.user.roleId）
}否则{
console.warn（'未知用户权限：'，令牌）
存储。删除（LB_令牌）
返回承诺。拒绝（{redirectTo:noAccessPage}）
}
}
return Promise.reject（`authProvider-未知方法，类型：${type}，参数：${params}`）
}
}
可能有“打字错误”。让我发布一行可能会引起问题的代码。事实上，您可能需要检查所有
itenary
运算符的逻辑。在权限、注销等方面，您可能会面临更多的挑战。您所说的
itenary
操作员是什么意思？这也是一个不错的发现。意思是
三元运算符：）嗨，没有fetchLoginBatch（）内容，不清楚你在做什么。嗨@MwamiTovi，很好的捕获，不幸的是我在做一个测试，试图设置测试是否出错，我在问题中修复了它。好的，很好。让我仔细检查这些片段，看看里面发生了什么。我错了，我曾经测试过它，它曾经不起作用，但后来我重新测试了它，它起了作用！我不确定，因为我没有改变任何东西，它开始工作了。我玩过很多东西，比如webpack resolve alias，所以可能是它，可能是这个和@MwamiTovi answwer的组合