XMLHttpRequest cannot load 跨域问题解决

为什么80%的码农都做不了架构师？>>>   

在众多站群中，不同功能的系统使用独立的一个域名，各系统之间存在相互调用的关系。使用js的XMLHttpRequest调用其他域名提示跨域权限不足。有些可能认为都同属于同一个顶级域名或者说域名一模一样怎么会存在跨域问题. 先来看下错误 “XMLHttpRequest cannot load http://comment.ttlsa.com/api/post?id=1&msg=123123123&code=453423&username=凉白开 Origin http://www.ttlsa.com is not allowed by Access-Control-Allow-Origin.” 什么是Access-Control-Allow-Origin Access-Control-Allow-Origin是HTML5中定义的一种服务器端返回Response header，用来解决资源（比如字体）的跨域权限问题。 它定义了该资源允许被哪个域引用，或者被所有域引用（google字体使用*表示字体资源允许被所有域引用）。 什么是资源跨域权限 先来看看同域和不同域的长相 相同域 http://www.ttlsa.com/ http://www.ttlsa.com/nginx 不同域 http://www.ttlsa.com http://bbs.ttlsa.com https://www.ttlsa.com http://www.ttlsa.com:8080 由此可见，相同域必须忙住协议相同、端口相同、域名相同. 只要其中一点不满足那就是跨域 跨域案例 站点www.ttlsa.com需要调用comment.ttlsa.com/api/post.php,那么这个post.php必须加上如下代码 代码1

header("Access-Control-Allow-Origin: http://www.ttlsa.com");

代码2 header方式不能使用正则，例如*.ttlsa.com，不过我们可以使用如下方法，将内容echo到php响应内容中

echo '<meta http-equiv="Access-Control-Allow-Origin" content="*.ttlsa.com">';

目前还不清楚为什么header里面用不了正则，而meta里面可以用正则.后续查找原因，知道的兄弟请留言告知，小生在此谢过. 从上面的代码可以看出, 代码1安全性不够，但是使用接口的人只会获取到响应的body内容。代码2相对安全，但是响应的body内容体里面包含<meta http-equiv="Access-Control-Allow-Origin" content="*.ttlsa.com">，多少影响接口的使用. 转载请注明出处：http://www.ttlsa.com/html/3178.html

转载于:https://my.oschina.net/766/blog/211328