原理:借助script可以跨域的思想,将跨域请求放在script中,当页面解析到改script标签时,就会向该src指向的地址发出一个请求,达到跨域请求的目的。

两点:(1)主要是利用了 <script/>标签的跨域性 (2)script标签对javascript文档的动态解析来实现

服务器端配合处理: 在前端传入事件处理函数如url?callback=fun,后台获取这个callback参数,通过字符串拼接,组合成函数调用的形式,将数据也拼接进去,构造js代码,返回给前端的script标签,在前端script标签会自动执行返回的代码。(因为后台没法直接执行函数调用),所以是在后台返回一个拼接的调用形式,返回给前端,script标签会自动执行,从而实现跨域。

demo:

<script>
function handlerData(data){ alert('获取到数据');
console.log(data);
}
</script>
<script src='http://webgis.ecnu.edu.cn/beta/cross.php?callback=handlerData'></script>

服务器端:

<?php
$callback = $_GET['callback'];
$data ='["hello","world"]';
echo $callback."(".$data.")"; //拼接字符串 或者 "try" $callback."($data)". "catch(e){}"
?>

结果如下

这种方法实现的话,每个请求都要重新生成数据,可以采用动态生成脚本的方式,将数据放到脚本中,脚本中存放数据,向客户端返回一个js

缺点:返回的函数执行出错时,没有错误提示,只能看控制台下的报错信息。

优缺点:

使用JSON的优点在于:

  • 比XML轻了很多,没有那么多冗余的东西。
  • JSON也是具有很好的可读性的,但是通常返回的都是压缩过后的。不像XML这样的浏览器可以直接显示,浏览器对于JSON的格式化的显示就需要借助一些插件了。
  • 在JavaScript中处理JSON很简单。
  • 其他语言例如PHP对于JSON的支持也不错。

JSON也有一些劣势:

  • JSON在服务端语言的支持不像XML那么广泛,不过JSON.org上提供很多语言的库。
  • 如果你使用eval()来解析的话,会容易出现安全问题。

尽管如此,JSON的优点还是很明显的。他是Ajax数据交互的很理想的数据格式。

第一,也是最重要的一点,没有关于 JSONP 调用的错误处理。如果动态脚本插入有效,就执行调用;如果无效,就静默失败。失败是没有任何提示的。例如,不能从服务器捕捉到 404 错误,也不能取消或重新开始请求。不过,等待一段时间还没有响应的话,就不用理它了。(未来的 jQuery 版本可能有终止 JSONP 请求的特性)。

JSONP 的另一个主要缺陷是被不信任的服务使用时会很危险。因为 JSONP 服务返回打包在函数调用中的 JSON 响应,而函数调用是由浏览器执行的,这使宿主 Web 应用程序更容易受到各类攻击。如果打算使用 JSONP 服务,了解它能造成的威胁非常重要。

jsonp跨域实现的更多相关文章

  1. 原生JS封装Ajax插件(同域&&jsonp跨域)

    抛出一个问题,其实所谓的熟悉原生JS,怎样的程度才是熟悉呢? 最近都在做原生JS熟悉的练习... 用原生Js封装了一个Ajax插件,引入一般的项目,传传数据,感觉还是可行的...简单说说思路,如有不正 ...

  2. 借助node实战JSONP跨域

    一.前言: 浏览器安全是基于同源策略的.所谓同源策略就是三相同: 1.协议相同: 2.域名相同: 3.端口相同. 但,凡事都是有利弊,同源策略也导致了我们想用AJAX跨域请求,但NO!!为了规避这种限 ...

  3. jsonp跨域+ashx(示例)

    前言 做B/S项目的时候,我们一般使用jquery+ashx来实现异步的一些操作,比如后台获取一些数据到前台,但是如果ashx文件不在本项目下,引用的是别的域下的文件,这时候就访问不了.关于jsonp ...

  4. Jsonp跨域访问

    很早之前看过好几篇跨域访问的文章,然后做项目的时候基本没有遇到跨域访问的问题.不过该来的还是会来,前些天终于让我遇到了.于是重温了一下原理这些,再进行实战.于是现在也敢通过实战后的一些理解来和大家分享 ...

  5. jsonp 跨域请求

    背景: JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为"Same-Origin Policy"(同源 ...

  6. 我的jsonp跨域问题

    关于jsonp跨域问题,在这个方面也是了解一点点,先记录下来,主要作为以后查看,之前下载并安装过wampserver,了解到了jsonp和json的区别,现在谈谈跨域这个问题: 首先什么是跨域,简单地 ...

  7. jsonP跨域调用

    -------------------------------------jsonP跨域调用------------------------------------- <div class=&q ...

  8. JSONP跨域的原理解析( 一种脚本注入行为)

    JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制, 被称为“some-Origin Policy”(同源策略).这一策略对于Jav ...

  9. jsonp跨域问题

    JSONP是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式). 同源策略限制 ...

  10. JSONP跨域的原理解析

    JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same- Origin Policy”(同源策略).这一策略对于Jav ...

随机推荐

  1. 【转载】关于api-ms-win-crt-runtimel1-1-0.dll缺失的解决方案

    关于api-ms-win-crt-runtimel1-1-0.dll缺失的解决方案 目录 关于api-ms-win-crt-runtimel1-1-0dll缺失的解决方案 目录 安装VC redite ...

  2. Linux 启动详解之init

    1.init初探 init是Linux系统操作中不可缺少的程序之一.init进程,它是一个由内核启动的用户级进程,然后由它来启动后面的任务,包括多用户环境,网络等. 内核会在过去曾使用过init的几个 ...

  3. Race to 1 概率dp

    Race to 1 Time Limit: 10000MS   Memory Limit: Unknown   64bit IO Format: %lld & %llu [Submit]   ...

  4. AIM Tech Round 4 (Div. 2)ABCD

    A. Diversity time limit per test 1 second memory limit per test 256 megabytes input standard input o ...

  5. 机器学习 数据挖掘 推荐系统机器学习-Random Forest算法简介

    Random Forest是加州大学伯克利分校的Breiman Leo和Adele Cutler于2001年发表的论文中提到的新的机器学习算法,可以用来做分类,聚类,回归,和生存分析,这里只简单介绍该 ...

  6. git fsck -- 一致性检查

    格式:           git fsck  [选项] <path> 选项 git commit -a 提交所有改动的文件(a -- all) git commit -m 提交说明(m ...

  7. Template7插入动态模板

    要完成的效果如下图 其中下面添加出来的订单号和订单总价可以看作是接口请求的数据 实现步骤: 1 下载template7:https://github.com/nolimits4web/template ...

  8. ZOJ2150 Raising Modulo Numbers 快速幂

    ZOJ2150 快速幂,但是用递归式的好像会栈溢出. #include<cstdio> #include<cstdlib> #include<iostream> # ...

  9. zoj1871steps 数学 水

                                                                                            zoj1871 题目大意 ...

  10. Chloe.ORM框架应用实践

    Chloe.ORM 是国人开发的一款数据库访问组件,很是简单易用.目前支持四种主流数据库:SqlServer.MySQL.Oracle,以及Sqlite,作者为这四种数据库划分出了各自对应的组件程序集 ...