背景

后端使用Nginx并更改本地host文件,起本地服务。将aaa.bbbb.com代理至本地IP地址(10.26.36.156)。
使用$.ajax调用后端restful接口,要求content-type为application/json格式,并要求在request headers里加一些内容。

前端代码:

    $.ajax({
headers : {
'Accept': 'application/json',
'Content-Type': 'application/json',
'user-id':'123',
'ghf-id': '456'
},
url: 'https://10.26.36.156/aaa/vds/dsg',
type: 'PATCH',
data: JSON.stringify(data),
dataType: 'json',
success: function (response) { },
error: function (msg) { }
})

现象

后端使用postman 可以访问成功
浏览器network抓请求,结果如下,但是代码并没有触发后端的代码断点....
这是为什么呢?

原因

因为host文件的配置,骗过了浏览器,进行了一次options请求,但是对于js引擎来说,这里的ip地址与浏览器的域名不同,所以出现了跨域,因此设置到了Access-Control-Request-Headers里面。

解决方案

方案一:
不走IP(不写绝对路径),而是相对路径
方案二:
将IP地址加入白名单(node js里面是如此,其他语音应该也有相应的)。
借用凝雨关于跨域踩坑经验总结

关于跨域踩的坑,浏览器 status code为200,但实际上是跨域了的更多相关文章

  1. Ajax交互,浏览器接收不到服务器的Json数据(跨域问题)

    该问题的情景如下: 问题描述 Ajax的请求代码放在一台机器上,而服务器的java 路由程序放在另一个机子上,所以Ajax的url填写的是带"http://"  的地址,而不是相对 ...

  2. Js 跨域CORS报错 Response for preflight has invalid HTTP status code 405

    问题 公司项目H5调用接口遇到Response for preflight has invalid HTTP status code 405这样的错误,是使用PUT方式提交请求接口.Content-T ...

  3. Chrome浏览器扩展开发系列之十五:跨域访问的XMLHttpRequest对象

    XMLHttpRequest对象是W3C的标准API,用于访问服务器资源.XMLHttpRequest对象支持多种文本格式,如XML和JSON等.XMLHttpRequest对象可以通过HTTP和HT ...

  4. chrome浏览器的跨域设置 Google Chrome浏览器下开启禁用缓存和js跨域限制--disable-web-security

    chrome用户默认路径 Win7:C:\Users\[用户名]\AppData\Local\Google\Chrome\User Data\XP:C:\Documents and Settings\ ...

  5. 转 Js 跨域CORS报错 Response for preflight has invalid HTTP status code 405

    转自:http://www.cnblogs.com/SilenceTom/p/6697484.html 调用接口遇到Response for preflight has invalid HTTP st ...

  6. 从零开始学 Java - Spring 支持 CORS 请求踩的坑

    谁没掉进过几个大坑 记得好久之前,总能时不时在某个地方看到一些标语,往往都是上面一个伟人的头像,然后不管是不是他说的话,下面总是有看起来很政治正确且没卵用的屁话,我活到目前为止,最令我笑的肚子痛得是下 ...

  7. 跨域的另一种解决方案——CORS(Cross-Origin Resource Sharing)跨域资源共享

    在我们日常的项目开发时使用AJAX,传统的Ajax请求只能获取在同一个域名下面的资源,但是HTML5打破了这个限制,允许Ajax发起跨域的请求.浏览器是可以发起跨域请求的,比如你可以外链一个外域的图片 ...

  8. 跨域的另一种解决方案CORS(CrossOrigin Resource Sharing)跨域资源共享

    在我们日常的项目开发时使用AJAX,传统的Ajax请求只能获取在同一个域名下面的资源,但是HTML5打破了这个限制,允许Ajax发起跨域的请求.浏览器是可以发起跨域请求的,比如你可以外链一个外域的图片 ...

  9. Asp.Net Core中使用Swagger,你不得不踩的坑

    很久不来写blog了,换了新工作后很累,很忙.每天常态化加班到21点,偶尔还会到凌晨,加班很累,但这段时间,也确实学到了不少知识,今天这篇文章和大家分享一下:Asp.Net Core中使用Swagge ...

随机推荐

  1. PostgreSQL dblink使用过程

    安装: 进入/root/postgresql-11.2/contrib/dblink make && make install 切换到postgres用户 [root@fce40690 ...

  2. vue组件化编程应用2

    写几个小案例来理解vue的组件化编程思想,下面是一个demo. 效果图示: 需求: header部输入任务,进行添加,在list中显示; list中每个item项,鼠标移入时,背景变灰并显示delet ...

  3. PY个康托展开

    卡 PY 的题,和 BIT 一样,不说了 内存还卡的挺紧的? 具体而言,刚好打完的 BIT 扒过来用用,然后打个阶乘就完事儿了 没什么好说的 Code fac=[0 for i in range(10 ...

  4. git的配置设置

    git的基本配置 git是一个版本控制工具,既然是工具,那么就可以根据人的个人喜好来进行设置,git也提供了配置,可以根据自己的喜好来对它进行个性化的设计,以让自己舒服的玩. git有三个配置文件 / ...

  5. iOS 审核app被拒绝的各种理由以及翻译

    原 apps被拒绝的各种理由以及翻译:http://my.oschina.net/201003674/blog/356189#OSC_h1_3 1. Terms and conditions(法律与条 ...

  6. webdriver 的使用 java 和python 两个版本

    在使用webdriver前要先做下准备,1.下载相应的支持包,可以pom.xml文件引入 2.下载版本对应的浏览器驱动(我这里用的是chromedriver.exe),很多问题都是由于浏览器驱动引起的 ...

  7. CSS的优先级理解

    样式的优先级 多重样式(Multiple Styles):如果外部样式.内部样式和内联样式同时应用于同一个元素,就是使多重样式的情况. 一般情况下,优先级如下: (外部样式)External styl ...

  8. snmpwalk工具使用

     snmpwalk是SNMP的一个工具,它使用SNMP的GETNEXT请求查询指定OID(SNMP协议中的对象标识)入口的所有OID树信息,并显示给用户. 在linux下使用snmpwalk工具,我们 ...

  9. 爱奇艺免费vip观看地址

    本人qq群也有许多的技术文档,希望可以为你提供一些帮助(非技术的勿加). QQ群:   281442983 (点击链接加入群:http://jq.qq.com/?_wv=1027&k=29Lo ...

  10. RetentionPolicy.SOURCE注解应用

    Lombok原理分析: https://www.jianshu.com/p/fc06578e805a