uni-app请求头中携带token

た入场券 2023-01-12 10:10 440阅读 0赞

之前做一个前后端分离项目是，用axios进行交互，访问一些有权限的页面时，需要在请求头中携带token值，在uniapp用uni.request发送请求时我发现浏览器中请求头中并没有携带token，有些有权限的页面也无法加载出来。  
也找了很多解决方法，基本都是大同小异，发现和我的不太一样，于是就自己弄了一个  
首先：  
在登陆成功之后，需要把token保存到本地  
![在这里插入图片描述][20210128101312851.png]

然后新建一个request.js文件  
我是这样配置的

const BASE_URL = 'http://127.0.0.1:8088'//接口地址
    export const http = (options) => { 
    	return new Promise((resolve,reject) => { 
    		uni.request({ 
    			url: BASE_URL + options.url,
    			method: options.method || 'GET',
    			data: options.data || { },
    			header: { Authorization:uni.getStorageSync('token')},
    			success: (res) => { 
    					if (res == '') { 
    					return uni.showToast({ 
    						icon: 'loading',
    						title:'获取数据失败'
    					})
    				}
    				resolve(res)
    			},
    			fail: (err) => { 
    				return uni.showToast({ 
    					icon: 'loading',
    					title:'请求失败'
    				})
    				reject(err)
    			}
    		})
    	})
    }

然后再需要的页面引入  
加上了这句 header: \{Authorization:uni.getStorageSync(‘token’)\} 之后  
请求头中携带了token，  
![在这里插入图片描述][20210128101725596.png]

有权限的页面也出来了  
终于弄好了

[20210128101312851.png]: /images/20221119/111b533635ba457b978997b25f545ef2.png
[20210128101725596.png]: /images/20221119/32dd8fa5d566450b97969b0cecf6688c.png