如何跨域访问的两种方法~

Posted lianer88

tags:

篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了如何跨域访问的两种方法~相关的知识,希望对你有一定的参考价值。

1. JSONP,需要客户端与服务端配合
    什么是:填充式JSON——JSON with Padding
    何时: 今后跨域,首选jsonp
    如何:
     基本思想:用其它可以跨域请求的元素,代替ajax
     程序中都是用<script>元素代替ajax发送请求
     方案一:
      1. 服务端: 将要返回的数据,填充进一条字符串格式的js语句中,组成一条正确的可执行的js语句,再返回
      2. 客户端: 添加<script src="服务器端地址">
      结果: script可跨域请求到服务器返回的js语句,并在客户端立刻执行。
      问题: 服务端返回的js语句是写死的,众口难调。
     方案二:
      1. 服务端: 返回一条自定义函数的调用语句
        要求客户端必须执行指定名称的函数
      2. 客户端: 提前定义一个与服务端同名的函数
        函数有一个参数可接受服务器端的数据
        函数内可执行任意操作
      问题: 函数名是写死的,极容易发生冲突!
     方案三:
      1. 服务端:接受一个函数名参数
                 将客户端发来的函数名参数拼接到js语句的开头!
      2. 客户端:<script src="地址?参数名=本地函数名"
      问题: script是写死的!只能在页面加载时请求一次
     方案四:
      1. 服务端不变
      2. 客户端: 动态创建script元素
        script只要被加到页面上,就立刻自动请求
        问题: script不断累积
        解决: 在回调函数中自动删除script
    其实: $.ajax也支持jsonp
     $.ajax({
       ... ,
       dataType:"jsonp",
       ...
     })
     强调: dataType:"jsonp"需要服务器端配合才能实现。
     其实,dataType:"jsonp"的原理和方案四一致:
      1. 也是通过在head中动态添加<script>发送请求
      2. 也是通过?callback=函数名,发送函数名到服务端
      3. 函数名其实是$.ajax自动为success函数生成的随机函数名。
  2. CORS,只要服务器端允许即可
    在服务器端添加响应头: node中:
       res.writeHead(200,{
         "Content-Type":"application/json;charset=utf-8",
         "Access-Control-Allow-Origin":"指定来源域名"|"*"
       })
















































以上是关于如何跨域访问的两种方法~的主要内容,如果未能解决你的问题,请参考以下文章

设置IE浏览器跨域访问数据

Ajax跨域问题的两种解决方法

ajax 跨域请求

使用微软CORS包不能跨域访问的问题

Geoserver通过ajax跨域访问服务数据的方法(含用户名密码认证的配置方式)

ASP.NET MVC 实现AJAX跨域请求的两种方法