axios发送POST时请求两次,第一次为OPTIONS
出现问题:
发送POST请求时浏览器产生两次请求,第一次为OPTIONS,第二次是真正的POST请求,后台接收不到参数。

查找原因:
非GET请求,会先发送OPTIONS进行预检(预检请求每次运行只发生一次)致使后台接收不到参数值,不停返回参数错误。
于是找到了原因:

查找解决方案:
CORS文档:https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Access_control_CORS
解决方案:(可行)
改为简单请求(使用form格式提交数据)
//用户注册
var url ="/api/OfferReward/User/ValidateCode";
var instance = axios.create({ headers:
{'content-type': 'application/x-www-form-urlencoded;charset=UTF-8'}
});
instance.post(url,qs.stringify(tel)).then(res => {
if(res.status === 200){
if (res.data.status === 0) {
console.log(res.data.msg);
} else {
console.log(res.data.msg);
return false;
}
}
})
不可行的一种测试:
前端接收后台对OPTIONS请求的响应,忽略过滤它。也不能修改OPTIONS的status值,如果不为200则预检请求不通过,后续所有POST接口都无法请求成功。
从返回值拦截不成功,那就只能从根源上解决,使用简单请求避免出现OPTIONS,用表单格式提交。据查,简单请求还有一定的限制,暂时没有遇到。
axios发送POST时请求两次,第一次为OPTIONS的更多相关文章
- axios发送post form请求
axios发送post form请求 只需修改url和data即可 axios({ url: '/user', method: 'post', data: { firstName: 'Fred', l ...
- Nuxt服务端使用Axios调用接口时传递cookies
个人博客 地址:http://www.wenhaofan.com/article/20190321183709 介绍 在做单点登录时,后端需要根据cookie获取登录用户,由于前端项目使用了Nuxt做 ...
- jquery easyui的datagrid在初始化的时候会请求两次URL?
我们项目前端用的是jquery easyui,刚开始使用datagrid加载列表初始化时总是请求两次URL,这让人非常不解,怎么总是请求两次呢?数据一多,加载速度明显变慢,通过查资料才知道原来是重复声 ...
- vue使用axios发送请求,都会发送两次请求
vue 使用axios,每次的请求都会发送两次,第一次的请求头为options CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sha ...
- axios发送两次请求原因及解决方法
axios发送两次请求原因及解决方法 最近Vue项目中使用axios组件,在页面交互中发现axios会发送两次请求,一种请求方式为OPTIONS,另外一种为自己设置的. 如图: 什么是CORS通信? ...
- Vue 爬坑之路(六)—— 使用 Vuex + axios 发送请求
Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource 目前主流的 Vue 项目,都选择 axios ...
- vue2.0项目实战(3)使用axios发送请求
在Vue1.0的时候有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource. 关于为什么放弃推荐? -> 尤 ...
- Vue笔记:使用 axios 发送请求
在Vue1.0的时候有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource. 关于为什么放弃推荐? -> 尤 ...
- Vue项目中使用Vuex + axios发送请求
本文是受多篇类似博文的影响写成的,内容也大致相同.无意抄袭,只是为了总结出一份自己的经验. 一直以来,在使用Vue进行开发时,每当涉及到前后端交互都是在每个函数中单独的写代码,这样一来加大了工作量,二 ...
随机推荐
- 遗传算法MATLAB实现(1):工具箱下载及安装
到官网下载谢菲尔德大学的GA工具箱:http://codem.group.shef.ac.uk/index.php/ga-toolbox(其实蛮不懂为什么有人把这个传到某个网上还需要积分才能下载,人家 ...
- 闲鱼Flutter&FaaS云端一体化架构
讲师介绍 国有,闲鱼架构团队负责人.在7月13号落幕的2019年Archsummit峰会上就近一年来闲鱼在Flutter&FaaS一体化项目上的探索和实践进行了分享. 传统Native+Web ...
- 远程安装App到手机
注意: 必须是手机和电脑网络连通正常 1. 手机端安装终端模拟器. 2. 打开终端模拟器执行下面命令(也可以在adb shell中执行): su setprop service.adb.tcp.por ...
- 某input元素值每隔三位添加逗号跟去掉逗号
//每隔三位数字加一个逗号function moneyformat(s) { var reg = /.*\..*/; if (reg.test(s) == true) { n ...
- 比较全面的一个PHP缓存类解析
转自:http://www.blhere.com/1164.html 一.引论 PHP,一门最近几年兴起的web设计脚本语言,由于它的强大和可伸缩性,近几年来得到长足的发展,php相比传统的asp网站 ...
- 自定义属性 —— data-*
一.基本概念 在HTML5中添加了data-*的方式来自定义属性,所谓data-*实际上上就是data-前缀加上自定义的属性名,使用这样的结构可以进行数据存放.使用data-*可以解决自定义属性混乱无 ...
- MySQL按时间统计每个小时记录数
MySQL按时间统计每个小时记录数 方案1: ? 1 2 3 4 5 6 7 SELECT @rownum := @rownum + 1 AS ID, CONCAT((CASE WH ...
- Hadoop入门进阶步步高(三)-配置Hadoop
三.配置Hadoop 1.设置$HADOOP_HOME/conf/hadoop-env.sh 这个文件里设置的是Hadoop运行时须要的环境变量,在1.2.1版中共同拥有19个环境变量.例如以下: ...
- Streamy 解决办法
- Oracle使用——varchar2() 和 char()关联查询 存在空格
背景 表dbcontinfo 字段loanid,类型为varchar2(60) 表dbloanbal 字段loanid,类型为char(60) loanid字段实际长度为24位 问题 两张表dbloa ...