html中jsonp错误,解决jquery中jsonp格式跨域请求报parsererror的错误
在vs中创建一个空的mvc项目,在Controllers文件夹中添加一个控制器CommonController,并在该控制器下添加一个action用于获取服务器时间,代码如下:
public ActionResult getServerTime(string callback)
{
string jsonp = "'serverTime':'{0}'";
DateTime curTime = DateTime.Now;
jsonp = string.Format(jsonp, curTime.ToString("yyyy/MM/dd HH:mm:ss"));
return Content(callback + "({" + jsonp + "})");
}
然后把这个项目运行起来。我这里得到的域名是http://localhost:31187
另外新建一个页面jsonp.html,可以是在本项目中,也可以是在其它地方(为了模拟跨域,最好不要在本项目中)。页面代码如下:
$(function() {
$.ajax({
url: "http://localhost:31187/common/getServerTime",
type: "get",
data: { callback: "?"},
dataType: "jsonp",
success: function(data) {
var curTime = data.serverTime;
alert(curTime);
},
error: function(a, b, c) {
alert(b);
}
});
});
然后打开jsonp.html这个页面,我们就会得到当前服务器的时间,如下图:
这是正确的写法,能够得到数据。但我们在实际用的时候经常会由于这样或那样的原因导致无法成功得到数据,比较经常碰到的错误就是parsererror。parsererror的意思是解析错误,出现这个错误的时候,一般都是服务器有数据返回,但是这个数据无法被解析为json对象。也就是说服务器返回的json格式字符串有问题。这个问题一般是由于自己在写json返回串时的失误造成的,比方说一些逗号和引号。如果把返回串改成如下写法:
string jsonp = "'serverTime':{0}";
再来打开jsonp.html页面,就会得到如下结果:
这说明我们json对象的字段值需要使用引号包起来,字段名上的引号可要可不要,最好是加上。
如果getServerTime这个action没有参数callback,如下:
public ActionResult getServerTime()
{
string jsonp = "'serverTime':'{0}'";
DateTime curTime = DateTime.Now;
jsonp = string.Format(jsonp, curTime.ToString("yyyy/MM/dd HH:mm:ss"));
return Content(jsonp);
}
再运行jsonp.html页面,那么我们同样会得到parsererror这个错误。因为这个callback是jquery在进行跨域请求时生成的一个回调函数名,当页面取得服务器返回的值时,会由该回调函数解析成json对象。所以在返回数据时应该把对整个回调函数的调用进行返回,这个函数需要一个json对象的字符串作为参数,这样才能正常解析。
还有一个比较常见的错误是在写js的时候发生的,很多人在写跨域请求时使用的是post方式,这个是不对的,jsonp格式的请求只能使用get方式提交。使用post方式很有可能也会造成parsererror的错误,但也有可能会正常获取数据。会产生parsererror错误的情况是发起请求的页面和要请求的资源是在同一个项目中,而正常获取数据的页面是在别的域名下发起的请求。但这却并不能说明jsonp可以使用post方式提交,打开chrome浏览器调试页面下的Network,如下图:
我们会神奇的发现,尽管在发起请求时,我们规定了使用post方式提交,但浏览器在实际提交的时候使用的却是get方式。这说明jquery在发起跨域请求时,会作一个内部处理,让请求只能以get方式提交。所以在使用jquery的jsonp格式进行跨域请求时,我们最好都使用get方式提交请求。
html中jsonp错误,解决jquery中jsonp格式跨域请求报parsererror的错误相关推荐
- ajax error parsererror,完美解决ajax跨域请求下parsererror的错误
AJAX 的 完美解决ajax跨域请求下parsererror的错误 ajax请求报parsererror错误是很宽泛的概念,很多情况下都报这个错, 在很多时候,即使ajax提交.返回都正常 XMLH ...
- JQuery - Ajax和Tomcat跨域请求问题解决方法!
JQuery - Ajax和Tomcat跨域请求问题解决方法! 参考文章: (1)JQuery - Ajax和Tomcat跨域请求问题解决方法! (2)https://www.cnblogs.com/ ...
- 解决jquery调用NET webservice跨域的问题
声明,解决方案由网上收集而来,个人整理.有别人的,也有我的. 一.webserive端 1.web.config 需要在web.config的configuration节点中加入如下的黑体部分内容. ...
- Ajax调用springboot接口,Springboot解决ajax+自定义headers的跨域请求问题.pdf
Springboot解解决决ajax+自自定定义义headers的的跨跨域域请请求求问问题题 1..什什么么是是跨跨域域 由于浏览器同源策略 (同源策略,它是由Netscape提出的一 著名的安全策略 ...
- jquery ajax同源、跨域请求整理
//同源ajax请求数据function getData(url,paramjson,fn) {$.ajax({type : "POST", //提交方式url : url, // ...
- js请求结果拦截机器_js利用jquery的jsonp来解决ajax跨域请求被浏览器拦截结果的问题...
先来个表.页面太多对不起我也不知道这张表是从哪个博客保存过来的,所以无法注明博客地址.非常抱歉.URL说明是否允许通信 http://www.a.com/a.jshttp://www.a.com/b. ...
- 请求接受json tp5_关于jq jsonp跨域请求错误处理bug
前言:昨天,同事修改项目升级插件时遇到了一个ajax 报错,如下: $.ajax({type : "get",async:false,timeout:3000,url : &quo ...
- 使用YQL解决跨域请求json转jsonp问题
一.跨域报错 首先,是跨域请求的问题,jQuery默认不支持跨域请求,报错如下: index.html:1 XMLHttpRequest cannot load http://www.weather. ...
- 自定义原生jsonp跨域请求
由于同源策略,跨域(协议.域名.端口均相同的为同域)之间是不允许请求资源的,但是scrapt标签不收跨域约束,如论是jQuery中的jsonp还是angularjs中的jsonp都是通过script来 ...
最新文章
- 逻辑回归 + GBDT模型融合实战!
- report service常见处理办法
- 大专计算机单招有哪些,大专单招和统招的区别有哪些
- MySQL - 存储引擎初探
- Linux下使用Iptraf进行网络流量的分析
- 60套漂亮的的免费 PSD 界面设计元素包资源(系列二)
- 出走的门徒之一——地平线 余凯:造物主的一小步
- 家谱族谱软件用云码宗谱
- 电子电路绘图与仿真软件
- ipad一直卡在白苹果_近万字多图带你玩转iPad——iPad指南
- Linux 查看磁盘空间命令
- 迎国庆,2021新款苹果 iPad,包邮送一台!
- 为什么C语言永远不会过时?
- 如何使用信号量处理问题
- 产品经理如何做好项目介绍?
- oracle分区表的分区和查询
- java 判断是否包含中文_Java中判断字符串中是否包含中文汉字
- 从键盘输入一个正整数,判断它是否为3和5的倍数,如果是,则输入yes,否则输出no。
- java之ResourceBundle类详细分析(全)
- Apollo 3.5 各功能模块的启动过程解析
热门文章
- 面试总结(堆、UDP、voliate)
- python基础训练 day18
- 乐嘉老师送给男生、女生 28句话,简直太精辟了
- javascript 简单画心型线
- 使用RadioGroup实现底部导航栏
- 00后的可爱语录和强大的80后妈妈--4
- 列表,元组,range相关
- 如何用传统摄像机实现直接对接平台,类似于海康萤石、大华乐橙的方案
- 使MPDroid与基于Archphile的盒子一起使用
- 关于“Unable to establish loopback connection Connection timed out: connect”问题的解决方案参考