javascript跨域的解决方案

Posted 2020-08-21

首先我们得了解什么是跨域

我们来回顾一下一个域名地址的组成：

http://  www   abc.com  :8080   /script/jquery.js

协议      子域名  主域名      端口号   请求资源地址

当协议、子域名、主域名、端口号不同时，都算作不同域

不同域之间相互请求资源，就算做“跨域”

比如：http://www.abc.com/index.html 请求http://www.efg.com/server.php就算做跨域请求

 

跨域

JavaScript出于安全方面的考虑，不允许跨域调用其他页面的对象。现在我们回到什么是跨域呢，简单的理解就是因为JavaScript同源策略的限制，a.com域名下的js无法操作b.com或是c.com下的对象

 

处理跨域的方法 一、代理

通过在同域名的web服务器端创建一个代理：

a服务器

b服务器

我们可以在a服务器的后台来调用b服务器的服务，然后再把响应结果返回给a的前端，这样前端调用a同域名的服务就和调用b的服务效果相同了

 

处理跨域方法 二、JSOP

在ajax当中的  dataType当中 改成jsonp

加上一个属性  jsonp：“”  可以取任意一个值

后端代码的改造  在get请求处理中  获取到 jsonp里的内容  $jsonp = $_GET["jsonp"] 里面的值是参数的名称

要在json数据当中加上一个括号

原json数据$result=‘{"name":"k.luo"}‘

改造后返回数据：$result=$jsonp.‘({"name":"k.luo"})‘   php语言

 

但是实现跨域知识实现了get请求的改造、jsonp只能对get请求取得效果，jsonp不支持post请求的

 

处理跨域方法 三、XHR2

HTML为我们提供了XMLHttpRequest Level2 已经实现了跨域访问以及其他的一些新的功能

IE10以下的版本都不支持

在服务器端加入头文件

header("Access-Control-Allow-Origin:*");  *为所有

header("Access-Control-Allow-Methods:POST,GET"); 请求方式