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

推荐订阅源

奇客Solidot–传递最新科技情报
奇客Solidot–传递最新科技情报
小众软件
小众软件
博客园 - 三生石上(FineUI控件)
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
博客园_首页
Last Week in AI
Last Week in AI
美团技术团队
OSCHINA 社区最新新闻
OSCHINA 社区最新新闻
Apple Machine Learning Research
Apple Machine Learning Research
WordPress大学
WordPress大学
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知
博客园 - Franky
The Cloudflare Blog
罗磊的独立博客
月光博客
月光博客
N
Netflix TechBlog - Medium
C
Check Point Blog
Microsoft Security Blog
Microsoft Security Blog
F
Fortinet All Blogs
freeCodeCamp Programming Tutorials: Python, JavaScript, Git & More
Microsoft Azure Blog
Microsoft Azure Blog
IT之家
IT之家
Jina AI
Jina AI
J
Java Code Geeks

博客园 - 佛西亚

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
  ]
};