博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
通过jsonp获取json数据--实现AJAX跨域请求
阅读量:7060 次
发布时间:2019-06-28

本文共 1270 字,大约阅读时间需要 4 分钟。

异步的 JavaScript 和 XML)是用于创建快速动态网页的一种技术,它在不重新加载整个页面的情况下,与服务器交换数据并更新部分网页,ajax 使用XMLHttpRequest对象在后台与服务器交换数据,XMLHttpRequest 是 AJAX 的基础,它允许客户端 JavaScript 通过 HTTP请求连接到远程服务器。

但是,由于受到浏览器的限制,这种方法不可以进行跨域访问,如果使用这种方法进行跨域访问则会出现安全问题。不过,我们可以发现,在web页面跨域调用 js文件时,不会受到浏览器的限制,所以我们可以利用将远程服务器端的数据装入js格式的文件,然后再用来供客户端进行调用。
JavaScript 对象表示法)是一种轻量级的文本数据交换格式,它具有自我描述性,易于理解。JSON 可通过 JavaScript 进行解析,JSON 数据可使用 AJAX 进行传输。

JSON实例:

{    "employees": [    { "firstName":"Bill" , "lastName":"Gates" },    { "firstName":"George" , "lastName":"Bush" },    { "firstName":"Thomas" , "lastName":"Carter" }    ]    }

JSON 语法是 JavaScript 对象表示法语法的子集:

数据在名称/值对中, 数据由逗号分隔 ,花括号保存对象, 方括号保存数组
JSON的特性

  • 纯文本,易于跨平台传递

  • Javascript原生支持,后台语言几乎全部支持

  • 使用轻量级的文本数据交换格式,适合在互联网中传递

  • 比 XML 更小、更快,更易解析。

基于JSON的这些特性,可以通过使服务器动态生成JSON文件,然后将客户端需要的数据装入这个文件,再将该文件调回客户端供客户端使用。为了便于客户端使用数据,逐渐形成了一种非正式传输协议JSONP,该协议的一个要点就是允许用户传递一个callback参数给服务端,然后服务端返回数据时会将这个callback参数作为函数名来装入JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回数据了。

如何使用JSONP

一种简单的方式就是使用jQuery来实现:

    
test

type:请求类型,GET 或 POST,默认为 GET;

async:true(异步)或 false(同步),默认情况下为true,同步请求将锁住浏览器,用户其它操作必须等待请求完成才可以执行;
url:发送请求的地址(跨域请求时应为绝对地址);
dataType:指定服务器返回的数据类型;
jsonpCallback:自定义JSONP回调函数名称;
success:请求成功后回调函数;
error:请求失败时调用此方法。

运行结果:

运行结果

服务器返回的数据类型:

图片描述

返回一个指定函数名为message的回调函数,函数里面包裹的数据为JSON格式。

转载地址:http://ypfll.baihongyu.com/

你可能感兴趣的文章
Copies in Seconds
查看>>
范内瓦·布什发表《诚如所思》,被信息界公认为是信息科学经典之作
查看>>
javascript基础修炼(10)——VirtualDOM和基本DFS
查看>>
算符优先文法,中缀式求值,栈的典型应用
查看>>
垃圾收集器(一)
查看>>
[转] 随机数是骗人的,.Net、Java、C为我作证
查看>>
第一天
查看>>
VUE基础插值表达式
查看>>
如何在mysql客户端即mysql提示符下执行操作系统命令
查看>>
人月神话读后感
查看>>
Learning Agile software Development
查看>>
window7利用Nexus搭建maven私有服务器
查看>>
java中的多态
查看>>
态度!!!
查看>>
[洛谷P4688][Ynoi2016]掉进兔子洞
查看>>
Android org.json.JSONArray cannot be converted to JSONObject
查看>>
Android2.3系统 自定义的PopupWindow在实例化时报空指针异常
查看>>
javascript 要注意的事项
查看>>
phpexcel中文手册
查看>>
Flask学习笔记
查看>>