JSONP之我见


Posted in Javascript onMarch 24, 2015

JavaScript初学,一点自己的理解,有不当之处请大家指正~

JSONP:

本地html文件要获取xxx网站(跨域)数据时使用的方法。

跨域问题:

外部服务器的数据只能用外部服务器中的js访问,本地js无法用XMLHttpRequest()访问。

外部服务器中的Web服务提供JSON数据,比如在http://gumball.wickedlysmart.com/中,数据包含在函数updateSales中作为参数,现在要在本地html中访问外部服务器中的JSON数据该怎么办呢?

1, 查看Web服务文档,明确服务实际使用的参数名(本例只有一个参数即一个对象数组);
2, 在url中指定一个回调函数,http://gumball.wickedlysmart.com/?callback=updateSales,用来指定Web服务中访问JSON数据的函数名;
3, 在本地js文件中使用刚才定义的函数名创建函数updateSales(对象),编写处理得到外部JSON数据的方法;
4, 在html文件中的<body>标签下使用<script>标签链接到外部Web服务,url为2中的那个路径。

总结:

JSONP目的在于提供给本地html一个函数接口(本地html可通过在url后方加入?callback=functionName的方法指定函数名),为了确保数据访问的安全,服务器将安全的数据放在回调函数的参数中,函数内部的参数就是服务器提供给本地的数据,至于怎么使用这些数据就要在本地的js中定义这个callback函数了。

注意:本地使用JSONP请求访问Web服务,可能会获取不安全的Js代码,所以要确保信任这个Web服务。

JSONP与XMLHttpRequest:

         XMLHttpRequest用于开发内部Web服务,内部访问内部,同域访问会更加简便。

         访问外部数据时(跨域访问)就要使用JSONP。

以上所述就是本文的全部内容了,希望大家能够喜欢,能够对大家学习jsonp有所帮助。

Javascript 相关文章推荐
强悍无比的WEB开发好助手FireBug(Firefox Plugin)
Jan 16 Javascript
如何快速的呈现我们的网页的技巧整理
Jul 01 Javascript
一个小型js框架myJSFrame附API使用帮助
Jun 28 Javascript
js下通过prototype扩展实现indexOf的代码
Dec 08 Javascript
js 获取计算后的样式写法及注意事项
Feb 25 Javascript
早该知道的7个JavaScript技巧
Mar 27 Javascript
javascript教程之不完整的继承(js原型链)
Jan 13 Javascript
JavaScript 封装一个tab效果源码分享
Sep 15 Javascript
javascript实现秒表计时器的制作方法
Feb 16 Javascript
在ES5与ES6环境下处理函数默认参数的实现方法
May 13 Javascript
vue组件之间数据传递的方法实例分析
Feb 12 Javascript
解决vue项目打包上服务器显示404错误,本地没出错的问题
Nov 03 Javascript
JavaScript将数字转换成大写中文的方法
Mar 23 #Javascript
自定义jQuery插件方式实现强制对象重绘的方法
Mar 23 #Javascript
jQuery定义背景动态切换效果的方法
Mar 23 #Javascript
javascript实现客户端兼容各浏览器创建csv并下载的方法
Mar 23 #Javascript
jQuery实现拖拽效果插件的方法
Mar 23 #Javascript
jQuery操作表单常用控件方法小结
Mar 23 #Javascript
JavaScript自定义等待wait函数实例分析
Mar 23 #Javascript
You might like
php FLEA中二叉树数组的遍历输出
2012/09/26 PHP
PHP操作MySQL事务实例
2014/11/05 PHP
PHP编写学校网站上新生注册登陆程序的实例分享
2016/03/21 PHP
PHP简单数据库操作类实例【支持增删改查及链式操作】
2016/10/10 PHP
Opacity.js
2007/01/22 Javascript
Jquery AutoComplete自动完成 的使用方法实例
2010/03/19 Javascript
javascript函数中的arguments参数
2010/08/01 Javascript
Prototype源码浅析 Enumerable部分(二)
2012/01/18 Javascript
js弹出的对话窗口永远保持居中显示
2012/12/15 Javascript
利用div+jquery自定义滚动条样式的2种方法
2013/07/18 Javascript
邮箱下拉自动填充选择示例代码附图
2014/04/03 Javascript
AngularJS基础 ng-focus 指令简单示例
2016/08/01 Javascript
简单实现jQuery多选框功能
2017/01/09 Javascript
详解webpack+angular2开发环境搭建
2017/06/28 Javascript
BootStrap实现文件上传并带有进度条效果
2017/09/11 Javascript
html2canvas属性和使用方法以及如何使用html2canvas将HTML内容写入Canvas生成图片
2020/01/12 Javascript
python下函数参数的传递(参数带星号的说明)
2010/09/19 Python
python轻松实现代码编码格式转换
2015/03/26 Python
在Django框架中编写Contact表单的教程
2015/07/17 Python
python简单分割文件的方法
2015/07/30 Python
python 读入多行数据的实例
2018/04/19 Python
Python实现的爬取网易动态评论操作示例
2018/06/06 Python
Python合并多个Excel数据的方法
2018/07/16 Python
Python干货:分享Python绘制六种可视化图表
2018/08/27 Python
pyqt弹出新对话框,以及关闭对话框获取数据的实例
2019/06/18 Python
Python requests设置代理的方法步骤
2020/02/23 Python
英国家庭和商业健身器材购物网站:Fitness Options
2018/07/05 全球购物
PHP经典面试题
2016/09/03 面试题
什么是触发器(trigger)? 触发器有什么作用?
2013/09/18 面试题
syb养殖创业计划书
2014/01/09 职场文书
小学班主任评语大全
2014/04/23 职场文书
五月的鲜花活动方案
2014/08/21 职场文书
2015大学生实训报告
2014/11/05 职场文书
辩论赛开场白大全(主持人+辩手)
2015/05/29 职场文书
百善孝为先:关于孝道的经典语录
2019/10/18 职场文书
分析Netty直接内存原理及应用
2021/06/14 Java/Android