jQuery解决ajax请求的跨域问题
这两天工作中频繁的遇到JS的跨域问题,都通过绕开ajax请求的方式。特地百度了一下,把跨域问题解决了。在这分析一下
首先贴上js的页面代码:
<html>
<head>
<title>cross domain</title>
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript">
function corssDomain(){
$.ajax({
url:"http://127.0.0.1:8080/DailyStudy/daily/info",
type:"get",
success:function(data){
alert(data.name);
},
dataType:"jsonp",
jsonpCallback:"method"
});
} window.onload = function(){
corssDomain();
}; </script>
</head> </html>
看到网上的很多说法,用JSONP可以解决跨越问题,不过在回调函数里面,一直拿不到JSON格式的数据,页面的报错信息跟下面的图一样
上网查资料发现,请求方式里添加JSONP字段解决跨域问题后,数据的格式却不能是Json的。后台服务返回的数据格式必须是jsonpCallback的值加一对括号,括号里面是json数据。这样才可而已正常解析。我没改动之前的返回数据是这样的{"key":"20170325","name":"pony"},改动之后是这样的method({"key":"20170325","name":"pony"})。附上后台的改动代码:
public String dailyInfo()throws Exception{
JSONObject json = new JSONObject();
json.put("key", "20170325");
json.put("name", "pony");
//return json.toJSONString() ; 改动前
return "method(" + json.toJSONString() + ")"; //改动后
}
再进行测试
这样就可以获取到json数据了。
jQuery解决ajax请求的跨域问题的更多相关文章
- 解决ajax请求cors跨域问题
”已阻止跨源请求:同源策略禁止读取位于 ***** 的远程资源.(原因:CORS 头缺少 'Access-Control-Allow-Origin').“ ”已阻止跨源请求:同源策略禁止读取位于 ** ...
- jQuery发送ajax请求实现跨域访问
Java代码的话,在返回响应之前调用如下代码中的allowCrossDomainAccess()方法: /** * 允许跨域访问 */ public void allowCrossDomainAcce ...
- ajax请求ashx跨域问题解决办法
ajax请求ashx跨域问题解决办法 https://blog.csdn.net/windowsliusheng/article/details/51583566 翻译windowsliusheng ...
- 用jQuery实现ajax总结以及跨域问题
本文为作者原创,未经博主允许,不可转载 ajax请求的常用的参数设置: type:请求类型,"POST","GET",默认为geturl:发送请求的地址data ...
- AJAX请求和跨域请求详解(原生JS、Jquery)
一.概述 AJAX 是一种在无需重新加载整个网页的情况下,能够更新部分网页的技术. AJAX = 异步 JavaScript 和 XML,是一种用于创建快速动态网页的技术.通过在后台与服务器进行少量数 ...
- 从零开始学 Web 之 Vue.js(四)Vue的Ajax请求和跨域
大家好,这里是「 从零开始学 Web 系列教程 」,并在下列地址同步更新...... github:https://github.com/Daotin/Web 微信公众号:Web前端之巅 博客园:ht ...
- Asp.Net Core 3.0 学习3、Web Api 文件上传 Ajax请求以及跨域问题
1.创建Api项目 我用的是VS2019 Core3.1 .打开Vs2019 创建Asp.Net Core Web应用程序命名CoreWebApi 创建选择API 在Controller文件夹下面添加 ...
- Ajax请求WebService跨域问题 [转载]
1.背景 用Jquery中Ajax方式在asp.net开发环境中WebService接口的调用 2.出现的问题 原因分析:浏览器同源策略的影响(即JavaScript或Cookie只能访问同域下的内容 ...
- [ 转 ]jquery的ajax和getJson跨域获取json数据
目前浏览器端跨域访问常用的两种方法有两种: 1.通过jQuery的ajax进行跨域,这其实是采用的jsonp的方式来实现的. jsonp是英文json with padding的缩写.它允许在服务器端 ...
随机推荐
- input标签添加上disable属性在移动端字体颜色不兼容的解决办法。
input[disabled],input:disabled,input.disabled{ color: #999; -webkit-text-fill-color:#999; -webkit-op ...
- html5--2.1新的布局元素概述
html5--2.1新的布局元素概述 学习要点 了解HTML5新标签(元素)的优点 了解本章要学习的新的布局元素 了解本章课程的安排 HTML5新标签的优点: 更注重于内容而不是形式 对人的友好:更加 ...
- yii2 linux安装教程
安装扩展 安装Yii最好的方式就是使用Composer安装,所以我们需要安装Composer,但是为了安装Composer,我们需要安装一下关于Composer和Yii2的许多扩展包,别担心下面的教程 ...
- LinkedList_1.打印两个有序链表的公共部分
思路: 实例化出两个链表($link_a, $link_b),比较连个链表当前元素的大小,谁小谁执行next()方法继续比较,当出现相当的时候把相等的值塞入数组$common里,当两个链表有一个元素比 ...
- win8、win10下卸载程序报错误2502、2503的解决办法
首先打开任务管理器,可以通过右键点击桌面上的任务栏打开任务管理器,也可以通过同时按下键盘上的Ctrl+Alt+Delete键打开任务管理器. 打开任务管理器后,切换到“详细信息”选项卡,找到explo ...
- Stamps
链接 分析:dp[i][j]表示前i个数,组成j,最少需要多少个.dp[i][j]=min(dp[i-1][j],dp[i-1][j-k*v[i]]+k),则可以转化为完全背包问题,同样的方法进行降维 ...
- 程序设计中的计算复用(Computational Reuse)
从斐波那契数列说起 我想几乎每一个程序员对斐波那契(Fibonacci)数列都不会陌生,在很多教科书或文章中涉及到递归或计算复杂性的地方都会将计算斐波那契数列的程序作为经典示例.如果现在让你以最快的速 ...
- Flashback Database 闪回数据库
一. Flashback Database 说明 Flashback Database 功能非常类似与 RMAN 的不完全恢复, 它可以把整个数据库回退到过去的某个时点的状态, 这个功能依赖于 Fl ...
- KCF+Opencv3.0+Cmake+Win10 测试
配置 需要的文件下载 安装CMake,安装opencv3.0.0 在KCFcpp-master 目录下新建一个文件夹,命名为build 打开CMake-GUI配置如下: 点击Configure,编译器 ...
- Vijos1579:宿命的PSS
背景 P.S.S:“我来自哪里?”WH:“你来自一个图.”P.S.S:“我是谁?”WH:“你是最小生成树.”P.S.S:“我又要到哪里去?”WH:“你要成为一个最小完全图(边权之和最小的完全图).”P ...