背景

后端使用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. 多线程16-SpinWait

        );             isCompleted = ));             isCompleted = );             isCompleted = true;    ...

  2. 【Linux-设备树】.dtb文件的反汇编

    在使用设备树时我们将**.dts文件利用dtc编译器编译为**.dtb文件. 在已知**.dtb文件的情况下我们有两种方法可以得到dts源码: 方法一:使用fdtdump工具进行反汇编 使用命令:ro ...

  3. HashMap底层为什么一定用数组

    HashMap源码数据结构: Entry[] table = new Entry[capacity]; 其中,Entry就是一个链表节点.如果将数组替换成LinkedList是否可行?如下: List ...

  4. debian 安装java

    sudo apt-get update sudo apt-get install default-jre sudo apt-get install default-jdk

  5. vue点击除了某组件本身的其它地方, 隐藏该组件的方法

    点击emoji表情标签, 出现标签组件,点击其它地方, 改组件消失的效果; <template> <div class="writeZoon"> <d ...

  6. easy-mock的运用

    一.概念 Easy Mock 是杭州大搜车无线团队出品的一个极其简单.高效.​可视化.并且能快速生成模拟数据的 在线 mock 服务 .以项目管理的方式组织 Mock List,能帮助我们更好的管理 ...

  7. Linux下libaio的一个简单例子

    转载:http://www.cnblogs.com/aLittleBitCool/archive/2011/10/18/2216646.html 异步io,很好玩的一个东西,从接口来看,封装的比较厉害 ...

  8. CSP-S全国模拟赛第二场 【nan】

    A.count 本场比赛最难的题... 隔板法组合数容斥 xjb 搞搞就好了 //by Judge #include<cstdio> #include<iostream> #d ...

  9. 剑指offer-用两个栈实现队列-栈和队列-python

    题目描述 用两个栈来实现一个队列,完成队列的Push和Pop操作. 队列中的元素为int类型.   # -*- coding:utf-8 -*- class Solution: def __init_ ...

  10. python基础知识之数据类型

    一.与用户的交互 古时候,我们去银行取钱,需要有一个银行业务员等着我们把自己的账号密码输入给他, 然后他去进行验证,成功后,我们再将取款金额输入/告诉他 骄傲的现代人,会为客户提供一台ATM机(就是一 ...