最近把左边的传统模式,换成了右边通过js直接调api拿数据并渲染,于是变出现了ajax的跨域问题:
XMLHttpRequest cannot load http://api.abc.com/?s=user/account_log&v=1.0. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://m.abc.com' is therefore not allowed access.
api项目都为post请求且返回结果为json,为了不改动api,于是没用jsonp,而是采用header,修改api.abc.com的nginx配置:

add_header Access-Control-Allow-Origin http://m.abc.com;

请求成功之后发现cookie无法共享,在ajax里带上参数:

 crossDomain: true,
xhrFields:{
withCredentials:true
},

出现错误:
XMLHttpRequest cannot load http://api.abc.com/?s=user/account_log&v=1.0. The value of the 'Access-Control-Allow-Credentials' header in the response is '' which must be 'true' when the request's credentials mode is 'include'. Origin 'http://m.abc.com' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.
再次修改api.abc.com的nginx配置:

add_header Access-Control-Allow-Credentials true;

至此正常访问。

-------------------------2017.10.13 更新-----------------------------

如果Access-Control-Allow-Origin配置的是通配的 * ,这里还会报另一个错误

Failed to load http://api.abc.com/?s=user/account_log&v=1.0: The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'http://m.abc.com' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

-------------------------2017.05.23 更新-----------------------------

为了配合新增m的三级域名,调整api.abc.com的nginx配置:

 server  {
listen ;
listen ;
server_name api.abc.com;
index index.php;
root /datas/htdocs/abc_api; ssl on;
ssl_certificate /etc/ssl/ssl.crt;
ssl_certificate_key /etc/ssl/ssl.key; location ~ .*\.php?$ {
set_by_lua $http_referer_test '
if ngx.var.http_referer ~= nil then
tt = string.match(ngx.var.http_referer, "//%w+%.?m%.abc%.com");
end
if tt == nil or tt == "" then
tt = "//m.abc.com";
end
return tt;
'; proxy_set_header X-Real-IP $remote_addr;
proxy_pass http://127.0.0.1:9504;
add_header Access-Control-Allow-Origin $scheme:$http_referer_test;
add_header Access-Control-Allow-Credentials true;
} access_log /datas/log/www/access.abc_api.log main;
error_log /datas/log/www/error.abc_api.log;
}

记一次header跨域与cookie共享的更多相关文章

  1. CP="CAO PSA OUR" 用P3P header解决iframe跨域访问cookie

    1.IE浏览器iframe跨域丢失Session问题 在开发中,我们经常会遇到使用Frame来工作,而且有时是为了跟其他网站集成,应用到多域的情况下,而Iframe是不能保存Session的因此,网上 ...

  2. PHP 通过设置P3P头来实现跨域访问COOKIE

    CentOS的系统(Linux 内核) 编辑HOST vi /etc/hosts 加入127.0.0.1 www.a.com127.0.0.1 www.b.com 首先:创建 a_setcookie. ...

  3. PHP 跨域写cookie

    实际工作中,类似这样的要求很多,比如说,我们有两个域名,我们想实现在一个域名登录后,能自动完成另一个域名的登录,也就是PASSPORT的功能. 我只写一个大概,为了测试的方便,先编辑hosts文件,加 ...

  4. ajax 跨域携带COOKIE

    这个问题属于Ajax跨域携带Cookie的问题,找了一篇博文的解决方案. 原生ajax请求方式: var xhr = new XMLHttpRequest(); xhr.open("POST ...

  5. SSO单点登录、跨域重定向、跨域设置Cookie、京东单点登录实例分析

    最近在研究SSO单点登录技术,其中有一种就是通过js的跨域设置cookie来达到单点登录目的的,下面就已京东商城为例来解释下跨域设置cookie的过程 涉及的关键知识点: 1.jquery ajax跨 ...

  6. 通过设置P3P头来实现跨域访问COOKIE

    通过设置P3P头来实现跨域访问COOKIE 实际工作中,类似这样的要求很多,比如说,我们有两个域名,我们想实现在一个域名登录后,能自动完成另一个域名的登录,也就是PASSPORT的功能. 我只写一个大 ...

  7. node下的跨域传递cookie

    研究背景: 最近有一位朋友找工作,需要面试,涉及到面试就涉及面试题,于是我想起来鄙人之前面试被问到的一个跨域传递cookie的问题.搜索了相关资料,但自己不敲一下肯定是不足以让人信服的. 我用node ...

  8. 京东商城跨域设置Cookie实现SSO单点登陆过程

    可以先看下这边文章:http://blog.chinaunix.net/uid-25508399-id-3431705.html   1.点击首页的登陆按钮跳转到京东的登陆中心https://pass ...

  9. 在IE浏览器中iframe跨域访问cookie/session丢失的解决办法

    单点登录需要在需要进入的子系统B中添加一个类,用于接收A系统传过来的参数: @Action(value = "outerLogin", results = { @Result(na ...

随机推荐

  1. [bzoj 1758] 重建计划

    bzoj 1758 重建计划 题意: 给定一棵有边权的树和两个数 \(L, R (L\leq R)\),求一条简单路径,使得这条路径经过的边数在 \(L, R\) 之间且路径经过的边的边权的平均值最大 ...

  2. [RDL]中多行组列组占比报表制作

    结果如下: 生意额占比表达式:=iif(Fields!生意额.Value is nothing,"",Fields!生意额.Value/sum(Fields!生意额.Value, ...

  3. Unity3d Attribute 总结(转)

      举两个例子,在变量上使用[SerializeFiled]属性,可以强制让变量进行序列化,可以在Unity的Editor上进行赋值. 在Class上使用[RequireComponent]属性,就会 ...

  4. C#基础文件file的各种套路

    File的各种套路 //创建一个文件 //File.Create(@"C:\Users\SpringRain\Desktop\new.txt"); //Console.WriteL ...

  5. IO流----转换流、缓冲流

    打开一个文本文件,另存为: Ansi就是系统默认编码(就是gbk) 建一个编码是utf-8的txt文件, 例: import java.io.FileWriter; import java.io.IO ...

  6. (2017.10.10) 我对 JavaScript 历史的认识

    关于 JavaScript 的历史和来由相信学过 JavaScript 的小伙伴都能说出一二.我看过一些入门书籍第一章或者前言部分都有介绍,但是一直没捋清这段历史.今天通过两个问题,来加深我对 Jav ...

  7. iOS 应用架构 (一)

    摘要:iOS 客户端应用架构看似简单,但实际上要考虑的事情不少.本文作者将以系列文章的形式来回答 iOS 应用架构中的种种问题,本文是其中的第一篇,主要讲架构设计的通识和方法论等,同时还讨论了大家关心 ...

  8. (五)我的JavaScript系列:JavaScript的糟粕

    泪眼问花花不语,乱红飞过秋千去. JavaScript的糟粕 JavaScript语言是一门集精华与糟粕于一体的语言.在JavaScript: the good parts中,便集中讨论了关于精华与糟 ...

  9. 云计算的那些「What」

    本文从云计算讲起,介绍了选择云计算的各种理由和一些最基本的概念. 经过十多年发展,云计算早已成为不可阻挡的技术潮流,逐渐深入到各行各业,不同规模的组织中,帮助用户以更低运营成本获得完善高效的 IT 服 ...

  10. SQL Server AlwaysON从入门到进阶(6)——分析和部署AlwaysOn Availability Group

    前言:   本节是整个系列的重点文章,到现在,读者应该已经对整个高可用架构有一定的了解,知道独立的SQL Server实例和基于群集的SQL Server FCI的区别.上一节已经介绍了如何安装SQL ...