问题:本人使用Ruoyi框架表单构建器自动生成的Vue表单文件,使用el-upload的自动上传或者this.$refs['upload'].submit()函数都报错认证失败'未能读取到有效Token',无法访问系统资源
了解本框架的或多或少了解其axios请求统一抽取到utils/require.js中,其中请求拦截器中就设置了token值,而el-upload自动上传文件函数猜测并未携带token,估计问题就出在这!
service.interceptors.request.use(config => {// 是否需要设置 tokenconst isToken = (config.headers || {}).isToken === false//此处以下为重点//headers中的content-type 默认的大多数情况是 application/json,就是json序列化的格式config.headers['Content-Type'] = 'application/json'//为了判断是否为formdata格式,增加了一个变量为type,如果type存在,而且是form的话,则代表是formData的格式if (config.type && config.type === 'form') {config.headers['Content-Type'] = 'application/x-www-form-urlencoded'//data是接收的数据,接收的数据需要通过qs编码才可以直接使用if (config.data) {config.data = qs.stringify(config.data)}}// 是否需要防止数据重复提交const isRepeatSubmit = (config.headers || {}).repeatSubmit === falseif (getToken() && !isToken) {config.headers['Authorization'] = 'Bearer ' + getToken() // 让每个请求携带自定义token 请根据实际情况自行修改}// get请求映射params参数if (config.method === 'get' && config.params) {let url = config.url + '?' + tansParams(config.params);url = url.slice(0, -1);config.params = {};config.url = url;}if (!isRepeatSubmit && (config.method === 'post' || config.method === 'put')) {const requestObj = {url: config.url,data: typeof config.data === 'object' ? JSON.stringify(config.data) : config.data,time: new Date().getTime()}const sessionObj = cache.session.getJSON('sessionObj')if (sessionObj === undefined || sessionObj === null || sessionObj === '') {cache.session.setJSON('sessionObj', requestObj)} else {const s_url = sessionObj.url; // 请求地址const s_data = sessionObj.data; // 请求数据const s_time = sessionObj.time; // 请求时间const interval = 1000; // 间隔时间(ms),小于此时间视为重复提交if (s_data === requestObj.data && requestObj.time - s_time < interval && s_url === requestObj.url) {const message = '数据正在处理,请勿重复提交';console.warn(`[${s_url}]: ` + message)return Promise.reject(new Error(message))} else {cache.session.setJSON('sessionObj', requestObj)}}}return config
}, error => {console.log(error)Promise.reject(error)
})