惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

J
Java Code Geeks
G
Google Developers Blog
Blog — PlanetScale
Blog — PlanetScale
U
Unit 42
A
About on SuperTechFans
Vercel News
Vercel News
B
Blog
Martin Fowler
Martin Fowler
MyScale Blog
MyScale Blog
Cyber Security Advisories - MS-ISAC
Cyber Security Advisories - MS-ISAC
腾讯CDC
D
Docker
V
Visual Studio Blog
博客园 - 叶小钗
The Cloudflare Blog
Jina AI
Jina AI
B
Blog RSS Feed
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
WordPress大学
WordPress大学
T
Tailwind CSS Blog
MongoDB | Blog
MongoDB | Blog
D
DataBreaches.Net
月光博客
月光博客
大猫的无限游戏
大猫的无限游戏

博客园 - 佛西亚

https访问 asp.net Core上传文件 .NET Framework 4.0 DLL注册GAC 使用iText 7读取PDF文件中的文本和图片 用SQL Server Profiler跟踪AX执行的SQL语句 D365升级包 Ant Design Pro V5 + Django Restful Framework Token认证后台实现(二) Ant Design Pro V5 + Django Restful Framework Token认证后台实现(一) D365 FO产生随机字符串 D365 FO Array增加排序 D365 FO无法命中断点 Ant Design Pro V5 开发时使用后台服务数据 JavaScript跨域访问 同步数据库报错 DataEntity增加关联DataSource Java通过代理上传文件到Azure blob 使用iText7操作PDF D365 FO Json序列化和反序列化 D365 FO操作Azure Blob
Ant Design Pro V5 + Django Restful Framework Token认证前...
佛西亚 · 2020-12-27 · via 博客园 - 佛西亚

后台完成以后,剩下的事情就是在ADPV5里调用接口了。
1.登陆
登陆以后,记录获取的Token,后面请求其他API的时候带上Token。
首先更改Services->API.d.ts里LoginStateType的定义,增加token属性。

export interface LoginStateType {
    status?: 'ok' | 'error';    
    token: string;    
  }

User\loginindex.tsx将得到的token保存在localStorage中,这里不知道有没有更好的办法,想保存到内存里,可是没找到实现的方法,前端小白,举步维艰。

const msg = await fakeAccountLogin({ ...values, type });         
      if (msg.status === 'ok') {        
        localStorage.setItem("token", msg.token);        
        message.success('登录成功!');
        goto();
        return;
      }

2.后续请求增加Token
这个要通过增加拦截器实现的,在app.tsx中修改,代码如下:

const addToken :RequestInterceptor = (
  url :string,
  options:RequestOptionsInit
) => {  
  options.headers = {           
    Authorization : "Bearer " + localStorage.getItem('token')        
  }
  return {
    url,
    options
  }
}
export const request: RequestConfig = {
  errorHandler,
  requestInterceptors:[
    addToken
  ]
};