Vue 项目实战上传文件与接口OPTIONS

最新推荐文章于 2024-02-27 23:19:39 发布

VIP文章六小登登

最新推荐文章于 2024-02-27 23:19:39 发布

阅读量2.2k

点赞数

分类专栏： Vue 我的Vue进阶之路

本文链接：https://blog.csdn.net/qq_32135281/article/details/89370836

版权

在项目的开发过程中难免会遇到许多的坑，寻找答案成为了至关重要的一步，职场中解决问题的能力是必要切重要的，有些问题网上给的答案大多都是千篇一律重复性东西太多，而且还不能解决问题。往往花费很多时间把自己带进了坑里。

因此把自己遇到的一些问题记录下来，以免后面再次遇到不知所措。

项目使用的是 vue + element + axois。

在做用户超时登录时当用户超时后，前端发送请求后端会返回 401 结果。这里采用的是 axios 添加请求拦截的方式实现。

不过在过程中出现的问题是，在用户超时之后，前端发送请求始终没有返回结果。而代码并没有问题，最后排查得知后端对请求接口做了一次判断接口是不是 Ajax 请求。

为了满足后端的要求，需要我们发送的接口为 Ajax 请求。所以设置接口的 header 即可。

axios.interceptors.request.use((config) => {
  config.headers['X-Requested-With'] = 'XMLHttpRequest'
  return config
})

当然了，这里是服务器用来检测是否为异步，如果你的服务器没做任何针对的反馈，那就不会出现这个问题了。

项目中需要导入 Excel 数据功能，这里直接使用的是 Element 的 Upload 组件。

<el-upload action :show-file-list="false" :http-request="devUpload">

关注