最新 ajax 跨域原理及解决方式详解

前言


前几天,有个朋友问我跨域的问题,寻思着找篇文章给他理解。找了半天都没有直中要害,个人认为都是理解的模棱两可,所以花时间把自己的对ajax跨域的理解写下来。

什么是跨域?


假设我访问a 站点,在a站点得到一个页面,在a 站点的这个页面想去访问b 站点的资源,这个是就会产生一个跨域的效果。由于浏览器是有安全限制的,所以a 站点无法访问到b站点的资源。

比如我现在访问 www.1.com 获取到一个页面.通过这个页面去访问www.2.com获取资源。就会产生跨域。

问题展现

接口我用的是聚合数据,有接口调用次数限制,如若接口调用有问题,请自行申请接口。

1、创建一个ajaxDemo_1.html




    
    ajax



    这是一个有跨域问题的页面
    
    



2、将ajaxDemo_1.html放到本地node.js服务器上运行
由于跨域问题产生的错误

ajax底层请求类型为XMLHttpRequest

如何解决?


1、jsonp(只能解决get请求跨域问题)

创建一个ajaxDemo_2.html 发起get请求



    
    ajaxDemo_2


这是一个用jsonp解决get请求跨域问题的页面




运行后没有跨域问题,可以正常请求到数据
ajax底层请求类型为script
ajax使用script元素发送jsonp请求

使用

你可能感兴趣的:(最新 ajax 跨域原理及解决方式详解)