出现问题:

发送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的更多相关文章

  1. axios发送post form请求

    axios发送post form请求 只需修改url和data即可 axios({ url: '/user', method: 'post', data: { firstName: 'Fred', l ...

  2. Nuxt服务端使用Axios调用接口时传递cookies

    个人博客 地址:http://www.wenhaofan.com/article/20190321183709 介绍 在做单点登录时,后端需要根据cookie获取登录用户,由于前端项目使用了Nuxt做 ...

  3. jquery easyui的datagrid在初始化的时候会请求两次URL?

    我们项目前端用的是jquery easyui,刚开始使用datagrid加载列表初始化时总是请求两次URL,这让人非常不解,怎么总是请求两次呢?数据一多,加载速度明显变慢,通过查资料才知道原来是重复声 ...

  4. vue使用axios发送请求,都会发送两次请求

    vue 使用axios,每次的请求都会发送两次,第一次的请求头为options CORS是一个W3C标准,全称是"跨域资源共享"(Cross-origin resource sha ...

  5. axios发送两次请求原因及解决方法

    axios发送两次请求原因及解决方法 最近Vue项目中使用axios组件,在页面交互中发现axios会发送两次请求,一种请求方式为OPTIONS,另外一种为自己设置的. 如图: 什么是CORS通信? ...

  6. Vue 爬坑之路(六)—— 使用 Vuex + axios 发送请求

    Vue 原本有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource 目前主流的 Vue 项目,都选择 axios ...

  7. vue2.0项目实战(3)使用axios发送请求

    在Vue1.0的时候有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource. 关于为什么放弃推荐? -> 尤 ...

  8. Vue笔记:使用 axios 发送请求

    在Vue1.0的时候有一个官方推荐的 ajax 插件 vue-resource,但是自从 Vue 更新到 2.0 之后,官方就不再更新 vue-resource. 关于为什么放弃推荐? -> 尤 ...

  9. Vue项目中使用Vuex + axios发送请求

    本文是受多篇类似博文的影响写成的,内容也大致相同.无意抄袭,只是为了总结出一份自己的经验. 一直以来,在使用Vue进行开发时,每当涉及到前后端交互都是在每个函数中单独的写代码,这样一来加大了工作量,二 ...

随机推荐

  1. k8s 超详细总结,面试必问

    一个目标:容器操作:两地三中心:四层服务发现:五种Pod共享资源:六个CNI常用插件:七层负载均衡:八种隔离维度:九个网络模型原则:十类IP地址:百级产品线:千级物理机:万级容器:相如无亿,K8s有亿 ...

  2. 构造器 构造方法 constructor

    构造器的作用: 1.创建对象. 设计类时,若不显示的声明类的构造器的话,程序会默认提供一个空参的构造器. 一旦显示的定义了构造器,就不再默认提供. 声明类的构造器:权限修饰符 与类同名(形参){} 类 ...

  3. 闲鱼Flutter&FaaS云端一体化架构

    讲师介绍 国有,闲鱼架构团队负责人.在7月13号落幕的2019年Archsummit峰会上就近一年来闲鱼在Flutter&FaaS一体化项目上的探索和实践进行了分享. 传统Native+Web ...

  4. Hdu 1867 KMP

    题目链接 题目意思: 给出两个字符串a, b, 求最长的公共字串c, c是a的后缀,也是b的前缀. 本题没有具体说明哪个字符串是文本串和匹配串, 所以都要考虑 思路: 查找的时候, 当文本串结束的时候 ...

  5. 【调试】Visual Studio 调试小技巧(2)-从查看窗口得到更多信息(转载)

    在使用Visual Studio开发调试程序时,我们经常需要打开查看窗口(Watch)来分析变量.有时在查看窗口显示的内容不是很直观.为了能从查看窗口的变量中得到更多的信息,我们需要一些小的技巧.下面 ...

  6. day18 jQuery,JavaScript高级&Django

    回顾: 整体: - HTML - CSS - JavaScript:基本数据类型:流程控制语句 - DOM - BOM:setInterval() - jQuery - 选择器 - 筛选器 - 内容和 ...

  7. apache服务器配置防盗链(centos7)

    <Directory /data/wwwroot/xwl.com> SetEnvIfNoCase Referer "^$" local_ref SetEnvIfNoCa ...

  8. SGU 107 987654321 problem【找规律】

    题目链接: http://acm.sgu.ru/problem.php?contest=0&problem=107 题意: 平方后几位为987654321的n位数有多少个 分析: 虽然说是水题 ...

  9. Audio Session Programming Guide

    http://www.cocoachina.com/ios/20150615/12119.html

  10. Python中进制转换函数的使用

    Python中进制转换函数的使用 关于Python中几个进制转换的函数使用方法,做一个简单的使用方法的介绍,我们常用的进制转换函数常用的就是int()(其他进制转换到十进制).bin()(十进制转换到 ...