Ajax,restful/Rest JSON和JSONP
2021-04-10 03:32
标签:select 操作 http post ali tps car ror resource success Ajax – “异步Javascript和XML”。 Ajax宽松地定义了一组技术,以帮助使Web应用程序提供更丰富的用户体验。屏幕的数据更新和刷新是使用javascript和xml(或json或只是一个正常的http post)异步完成。 ajax传送json格式数据,关键是指定contentType,data要是json格式 如果是restful接口,把type改成对应的post(增)、delete(删)、put(改)、get(查)即可 一. JSONP方式 前端代码: 二. CORS方式 介绍: CROS是现在主流解决跨域问题的方案,未来估计也是趋势。 Cross-Origin Resource Sharing (CORS) 是W3c工作草案,它定义了在跨域访问资源时浏览器和服务器之间如何通信。CORS背后的基本思想是使用自定义的HTTP头部允许浏览器和服务器相互了解对方,从而决定请求或响应成功与否。 前端代码: 所做的工作和非跨域并无区别,主要的区别则是在后端代码。 后端代码: 参考网址: https://blog.csdn.net/xiaozhu_dq/article/details/82423618 https://blog.csdn.net/nuli888/article/details/51850649 https://www.jb51.cc/ajax/160681.html Ajax,restful/Rest JSON和JSONP 标签:select 操作 http post ali tps car ror resource success 原文地址:https://www.cnblogs.com/jian138/p/12434077.htmlAjax,restful/Rest JSON和JSONP之间的差异
JSON – “Javascript Object Notation”。 JSON就像xml,它可以用来描述对象,但它更紧凑,并且具有实际的javascript的优势。以JSON表示的对象可以转换为要在javascript代码中操作的实际对象。
>默认情况下,Ajax请求必须发生在请求发起的页面的同一域中。 JSONP – “JSON with padding” – 创建为允许您从其他域请求JSON资源。 ( CORS是一个更新,更好的替代JSONP。)
REST – “代表国家转移”。使用REST原则的应用程序具有Url结构和围绕资源使用的请求/响应模式。在纯模型中,HTTP动词Get,Post,Put和Delete分别用于检索,创建,更新和删除资源。通常不使用Put和Delete,让Get和Post映射到select(GET)并创建,更新和删除(POST)ajax传送json格式数据,调用restful接口
1 var post_data={"name":"test001","pass":"xxxx"};
2 $.ajax({
3 url: "http://192.168.10.111:8080/uc/login",
4 type: ‘post‘,
5 contentType: "application/json; charset=utf-8",
6 data:JSON.stringify(post_data),
7 success:function (data) {
8 //调用成功
9 },
10 error: function(data, textStatus, errorThrown){
11 //调用失败
12 }
13 });
Ajax跨域调用Restful接口 JSONP和CORS两种解决方案
1 var patientInfoURL = ‘http://10.1.8.82:8332/soap/GetPatInfo?
2
3 citycardno=0000997144446894&id=32010600000002012‘;
4
5 $.ajax({
6
7 type:‘get‘,
8
9 url: patientInfoURL ,
10
11 dataType:‘jsonp‘,
12
13 //jsonp:‘callback‘,//默认就是callback,可以不写
14
15 //jsonpCallback:"successCallback",//此处定义请求url中callback参数后的值,不写则jQuery会自动生成一个字符串
16
17 success:function(data){
18
19 console.log(data);
20
21 },
22
23 error:function(XMLHttpRequest, textStatus, errorThrown){
24
25 alert(XMLHttpRequest.status);
26
27 alert(XMLHttpRequest.readyState);
28
29 alert(textStatus);
30
31 }
32
33 });
var patientInfoURL = ‘http://10.1.8.82:8332/soap/GetPatInfo?
citycardno=0000997144446894&id=32010600000002012‘;
$.ajax({
type:‘get‘,
url: patientInfoURL ,
dataType:‘json‘,
success:function(data){
console.log(data);
},
error:function(XMLHttpRequest, textStatus, errorThrown){
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
}
});
1 // 跨域配置
2
3 response.setHeader("Access-Control-Allow-Origin","*");
4
5 response.setHeader("Access-Control-Allow-Methods", "POST, PUT, GET, OPTIONS, DELETE");
6
7 response.setHeader("Access-Control-Allow-Credentials", "true");
8
9 response.setHeader("Access-Control-Max-Age", "3600"); // 保持跨域Ajax时的Cookie
10
11 response.setHeader("Access-Control-Allow-Headers", "x-auth-token, x-requested-with,Authorization,Origin, Accept, Content-Type
上一篇:HTML---3
下一篇:网站改版与降权的关系
文章标题:Ajax,restful/Rest JSON和JSONP
文章链接:http://soscw.com/index.php/essay/73610.html