原因:js的同源策略限制,不同源会造成跨域

哪些情况会造成跨域?

  1. 子域名不同(WWW) 2.主域名不同(baidu.com) 3.端口号不同 4.IP地址和网址不同

解决方案:

使用jsonp技术,但是只能解决get跨域问题,因为post跨域在安全上,是不允许的.

原理:在js中,利用script标签中的src属性不受同源策略的影响,从而请求第三方服务器的数据内容.

http://crossdomain.com/jsonServerResponse?callback=jsonpCallback 这个 url 是跨域服务器取 json 数据的接口,参数为回调函数的名字,返回的格式为:jsonpCallback({id:1,name:zhangsan};

'})

首先在客户端的script的src属性设置接口地址 并带一个callback回调函数名称传给服务器。此时,服务器接受请求后,先生成 json 数据。 然后以 javascript 语法的方式,生成一个function , function 名字就是传递上来的参数。最后将 json 数据直接以入参的方式,放置到 function 中,这样就生成了一段 js 语法的文档,返回给客户端。

客户端浏览器,解析script标签,并执行返回的 javascript 文档,此时数据作为参数,传入到了客户端预先定义好的 callback 函数里。(动态执行回调函数)

Ajax的跨域问题(包括解决方案)?的更多相关文章

  1. Ajax不能跨域访问的解决方案

      文章介绍 这是一篇,引导文吧... 因为写这篇文章时,实在想不出该如何分序.因此以实现跨域访问为目的,从基础知识往上写.最后以百度搜索智能提示为例,来讲解跨域的具体应用! 内容 首先,我们得明确什 ...

  2. Ajax实现跨域访问最新方式

    在实际项目当中,我们经常会遇到同一个域名下不同项目之间通过Ajax相互调用数据,这样问题就来了,如何通过Ajax实现跨域呢? 解决方案 1.Jsonp Jsonp解决跨域相对简单,服务器无需任何配置. ...

  3. AJAX POST&跨域 解决方案 - CORS

    一晃又到新年了,于是开始着手好好整理下自己的文档,顺便把一些自认为有意义的放在博客上,记录成点的点滴.          跨域是我在日常面试中经常会问到的问题,这词在前端界出现的频率不低,主要原因还是 ...

  4. ajax跨域原理以及解决方案

    说明 跨域主要是由于浏览器的“同源策略”引起,分为多种类型,本文主要探讨Ajax请求跨域问题 前言 强烈推荐阅读参考来源中的文章,能够快速帮助了解跨域的原理 参考来源 本文参考了以下来源 浏览器同源政 ...

  5. AJAX POST&跨域 解决方案 - CORS(转载)

    跨域是我在日常面试中经常会问到的问题,这词在前端界出现的频率不低,主要原因还是由于安全限制(同源策略, 即JavaScript或Cookie只能访问同域下的内容),因为我们在日常的项目开发时会不可避免 ...

  6. [转载]JQuery的Ajax跨域请求的解决方案

    今天在项目中需要做远程数据加载并渲染页面,直到开发阶段才意识到ajax跨域请求的问题,隐约记得Jquery有提过一个ajax跨域请求的解决方式,于是即刻翻出Jquery的API出来研究,发现JQuer ...

  7. 黄聪:利用iframe实现ajax 跨域通信的解决方案(转)

    原文:http://www.cnblogs.com/xueming/archive/2013/02/01/crossdomainajax.html 在漫长的前端开发旅途上,无可避免的会接触到ajax, ...

  8. ajax 跨域访问的解决方案

    ajax 跨域访问的解决方案 一.什么是跨域: 1.什么样的请求属于跨域: 域名,端口有任何一个不相同都属于跨域: 二.跨域的常用几种解决方案: 1.jsonp: 2.iframe: 3.webcon ...

  9. (转) AJAX POST&跨域 解决方案 - CORS

    跨域是我在日常面试中经常会问到的问题,这词在前端界出现的频率不低,主要原因还是由于安全限制(同源策略, 即JavaScript或Cookie只能访问同域下的内容),因为我们在日常的项目开发时会不可避免 ...

随机推荐

  1. DKLang Translation Editor

    https://yktoo.com/en/software/dklang-traned Features Translation using a dictionary (so-called Trans ...

  2. unix 全缓冲、行缓冲、无缓冲

    基于流的操作最终会调用read或者write函数进行I/O操作.为了使程序的运行效率最高,流对象通常会提供缓冲区,以减少调用系统I/O库函数的次数. 基于流的I/O提供以下3种缓冲: 全 缓冲:直到缓 ...

  3. Django之查询总结

    models.Book.objects.filter(**kwargs): querySet [obj1,obj2]models.Book.objects.filter(**kwargs).value ...

  4. yii2查询数据倒序显示

    public function selectall(){ return $this->findBySql("SELECT * FROM article order by art_tim ...

  5. oracle 建立新的表空间

    创建数据表空间 注意粗斜体部分 create tablespace 表空间名称logging datafile 'D:\app\Administrator\oradata\orcl\XXXX.dbf' ...

  6. 利用ntp自动同步时间

    实验环境:centos 6.10 1.安装ntp工具 yum install -y ntp 2.便宜/etc/ntp.conf文件,添加远程时间服务器 server ntp1.aliyun.com s ...

  7. oracle 中 dual 详解

    基本上oracle引入dual为的就是符合语法1. 我们先从名称来说,dual不是缩写词,本身就是完整的单词.dual名词意思是对数,做形容词时是指二重的,二元的.2. Oracle中的dual表是一 ...

  8. SpringBoot @Annotation

    Annotation简介 Annotation是JDK1.5引入的特性,包含在java.lang.annotation包中. 它是附加在代码中的一些元信息,将一个类的外部信息与内部成员联系起来,在 编 ...

  9. PHP7的五大新特性

    如果你使用的是基于 composer 和 PSR-4 的框架,这种写法是否能成功的加载类文件?其实是可以的,composer 注册的自动加载方法是在类被调用的时候根据类的命名空间去查找位置,这种写法对 ...

  10. Zookeeper初步了解

    Zookeeper初步了解: Zookeeper实现了许多复杂的事情,例如实现了Zookeeper Atomic Broadcasting Protocal来广播状态信息的变化,Fast Paxas ...