什么是JSONP?

JSONP是JSON with Padding的略称。它是一个非官方的协议,它允许在服务器端集成Script tags返回至客户端,通过javascript callback的形式实现跨域访问(这仅仅是JSONP简单的实现形式)。--来源百度

从它的定义中不难看出jsonp是一种以json格式作为填充的一种实现跨域的方法!

<span">那么这里说的填充指的又是什么?我们来看一段例子:

function callback(a){
alert(a.name);
}
<script src="http://.....com/..php?JSONP='21'"></script>

  

上面是一个最简单的一个带参数的函数,假设我们现在需要跨越获取一些数据,如获取当前用户的名字name,参数a就是我们需要从后台获取的数据,但是在上面我们并没有调用他!而是通过script标签向服务器发送请求,下面我们在来看看php文件怎么写:

if(!empty($_GET['JSONP'])){
$id = $_GET['JSONP'];
$query = mysql_query("select * from user where id=$id");
$res = mysql_fetch_array($query);
echo "callback({‘name’:$res['name'])";
}

  

上面就是php文件的内容了,首先获取请求的url参数,在这里我传的是用户id,然后根据id去数据库查询对应的数据,然后输出js文件定义的方法名,并把用户的名字当成参数放进去!

这里我们对于参数的补充,就是我们上面所说的填充,顾名思义,就是把我们要取的数据填充到参数里!

看了上面的例子就不难理解了,jsonp其实就是在前台定义一个函数,然后通过script标签发送请求(由于script标签发送的请求是可以不守跨域规则限制),然后后台处理并输出之前定义的函数名,并把数据以json的格式填充到参数中,这样在请求返回时就会调用我们之前定义的函数,并获得想要的数据!

这就实现了一个简单的jsonp!说的直白点就是在前台定义函数,然后后台输出函数名和参数完成函数的调用和数据的获得!当然,它最主要的作用在于解决js跨域的问题!

由于本人水平有限,只能简单的说一些实例,来和大家共同成长!感谢各位浏览!

本文由 平凡公子原创并首次发表欢迎转载(转载请注明作者和原文地址)!

浅析JSONP的更多相关文章

  1. 说说JSON和JSONP,浅析JSONP解决AJAX跨域问题

    说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的需求如何解决?这两个问题目前都有不同的解决方案,比如数据可以用自定义字符串或者用XML来描述,跨域可以通过服 ...

  2. JSON和JSONP,浅析JSONP解决AJAX跨域问题

    说到AJAX就会不可避免的面临两个问题,第一个是AJAX以何种格式来交换数据?第二个是跨域的需求如何解决?这两个问题目前都有不同的解决方案,比如数据可以用自定义字符串或者用XML来描述,跨域可以通过服 ...

  3. JSONP浅析

    DEMO : JSONP示例 为什么使用JSONP JSONP和JSON是不一样的.JSON(JavaScript Object Notation)是一种基于文本的数据交换方式,或者叫做数据描述格式. ...

  4. json与jsonp区别浅析(json才是目的,jsonp只是手段)

    一言以蔽之,json返回的是一串数据:而jsonp返回的是脚本代码(包含一个函数调用): JSON其实就是JavaScript中的一个对象,跟var obj={}在质上完全一样,只是在量上可以无限扩展 ...

  5. json与jsonp区别浅析(json才是目的,jsonp只是手段) (转)

    一言以蔽之,json返回的是一串数据:而jsonp返回的是脚本代码(包含一个函数调用): JSON其实就是JavaScript中的一个对象,跟var obj={}在质上完全一样,只是在量上可以无限扩展 ...

  6. 浅析跨域的方法之一 JSONP

    概念: 什么叫跨域? 同源策略:它是由Netscape提出的一个著名的安全策略.现在所有支持JavaScript 的浏览器都会使用这个策略. 所谓同源是指,域名,协议,端口相同. 同源的脚本才会被执行 ...

  7. 【转】json与jsonp区别浅析(json才是目的,jsonp只是手段)

    一言以蔽之,json返回的是一串数据:而jsonp返回的是脚本代码(包含一个函数调用): JSON其实就是JavaScript中的一个对象,跟var obj={}在质上完全一样,只是在量上可以无限扩展 ...

  8. 浅析JSONP-解决Ajax跨域访问问题

    浅析JSONP-解决Ajax跨域访问问题 很久没有写随笔了,总是感觉没时间,其实时间就是...废话少说,前几天,工作上有一新需求,需要前端web页面异步调用后台的Webservice方法返回信息.实现 ...

  9. Vue 浅析与实践

    欢迎大家前往腾讯云社区,获取更多腾讯海量技术实践干货哦~ 作者:曾柏羲 导语 入职接到的第一个需求是实现一个关于K歌实体售卖的ERP系统,管理系统过去做过不少,这次打算换个姿势,基于时下正热但早已不新 ...

随机推荐

  1. QT 运行崩溃:The inferior stopped because it received a signal from the Operating System

    最近在研究QT自带的boxes例子,自己派生一个图形项,但是在运行生成该图形项时程序直接退出了~ Qt Creater调试代码,问题定位如下代码行: 执行1270行时弹出错误消息框: 于是上网查找资料 ...

  2. python中是否有单独的字符类型,通过下标的方式表示字符串中的字符

    说明: 在python中,没有单独的字符类型,一个字符呢就是一个大小为1的字符串. 并且可以通过下标的方式,表示字符串中的字符. 操作过程: 1.通过[ ]的方式表示字符串中的第几个字符 >&g ...

  3. 【scala】 scala 条件控制 和异常处理(二)

    1.scala 变量定义 ,var val 区别. var 定义可变变量 val 定义不可变变量,scala 推荐使用.相当于Java的final 变量. scala中包含的基本数据类型详情如下表所示 ...

  4. c#直接调用ssis包实现Sql Server的数据导入功能

    调用ssis包实现Sql Server的数据导入功能网上已经有很多人讨论过,自己参考后也动手实现了一下,上一次笔者的项目中还用了一下这个功能.思前想后,决定还是贴一下增强记忆,高手请54. 1.直接调 ...

  5. Git------解决右键不显示Git Bash Here问题

    步骤: 1.通过在“运行”中输入‘regedit’,打开注册表. 2.找到[HKEY_CLASSES_ROOT\Directory\Background]. 3.在[shell]下右键-新建项[ope ...

  6. iscroll5实现下拉加载更多

    1 下载最新的iscroll5,本文版本是5.1.3 2 提取iscroll-probe.js,选择这个文件的原因是我们要给iscroll扩展一个事件,需要用到probeType 属性 3 修改isc ...

  7. SpringBoot(七)-- 启动加载数据

    一.场景 实际应用中,我们会有在项目服务启动的时候就去加载一些数据或做一些事情这样的需求.为了解决这样的问题,spring Boot 为我们提供了一个方法,通过实现接口 CommandLineRunn ...

  8. Win10 我的电脑 -- 右键点击管理打不开

    右键点击我的电脑 -- 管理,出现如下错误,这是删除快捷方式小箭头导致的 解决方法: win+R 输入 regedit,分别在 HKEY_CLASSES_ROOT\piffile HKEY_CLASS ...

  9. Python中字符串的intern机制

    intern机制: 字符串类型作为Python中最常用的数据类型之一,Python解释器为了提高字符串使用的效率和使用性能,做了很多优化,例如:Python解释器中使用了 intern(字符串驻留)的 ...

  10. javascript实现的网页打印

    打印全部页面: <body onload="javascript:window.print()"> 实现局部打印,可以将不参加打印的元素设置“display=none” ...