前端发送两次请求处理

Posted 2023-04-10

参考技术A 请求接口的时候发现多了一次option请求，如何减轻服务器压力？

在 main.js 中，设置axios的默认请求头 axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded';

在安装qs模块，序列化传值的格式内容，再传给后端。

为啥 axios get 方法请求发送两次？

【中文标题】为啥 axios get 方法请求发送两次？

【英文标题】：why axios get method request send twice?为什么 axios get 方法请求发送两次？

【发布时间】：2019-09-13 08:11:09

【问题描述】：

我运行axios get方法调用php脚本，但是请求发送两次 如何解决这个问题呢。 我的功能：-

   axios.get('http://13.233.179.174/customers_log.php',
                  headers: 
                    'Access-Control-Allow-Origin': '*'
                  ,
                )
                  .then(function (response) 
                    $("#spinner").hide();
                    console.log('this is response work');
                    console.log(response.data);
                  )
                  .catch(function (error) 
                    $("#spinner").hide();
                    console.log(error);
                  )

【问题讨论】：

你是否两次调用你的函数？

否，但在控制台上显示两次我正在添加图片，请检查。

Access-Control-Allow-Origin 是一个 response 标头。它不在您的请求中

How does Access-Control-Allow-Origin header work?的可能重复

如果第一个请求方法不是选项，而是获取，请检查您的事件处理程序。可能，您必须添加类似 @click.once

的内容

【参考方案1】：

这是一个预检请求

这是一个 OPTIONS 请求，使用三个 HTTP 请求标头：Access-Control-Request-Method、Access-Control-Request-Headers 和 Origin 标头。

在这里查看 - https://developer.mozilla.org/en-US/docs/Glossary/Preflight_request

【讨论】：

我的功能或后端需要在哪里更改？

不，你不需要做任何事情。它就是这样工作的。

感谢您的帮助。