vue 中使用 axios 请求接口，请求会发送两次问题

Posted 2021-02-10 让心去旅行

在开发项目过程中，发现在使用axios调用接口都会有两个请求，第一个请求时，看不到请求参数，也看不到请求的结果；只有第二次请求时才会有相应的请求参数以及请求结果；

那为甚么会有这么一次额外的请求呢，后面经过查证资料发现：

如果只是普通的 ajax 请求，也不会发起这个请求，只有当 ajax 请求绑定了 upload 的事件并且跨域的时候，就会自动发起这个请求了。这样就很显然了，我们有 upload 事件绑定（一般都是本地调试，所以会有跨域），看了下 axios 文档，发现config配置文件中有两个参数：分别用于处理上传和下载事件，也就是这里绑定了 upload 事件，所以每次请求都会有个 option 请求。

// onUploadProgress: function(progressEvent) {
    //     // Do whatever you want with the native progress event
    // },


 // onDownloadProgress: function(progressEvent) {
 //     // Do whatever you want with the native progress event
 // },

解决方案如下：

①.直接注释掉配置文档中这两个事件的请求就好了；

②.跨域请求需要先发一次 option 预请求，options是检验是否允许跨域的，如果不希望options 请求，直接让后端遇到option 直接返回就可以了，前端可不做处理；