jq+jsonp+ajax解决跨域问题
Jsonp(JSON with Padding)是资料格式 json 的一种“使用模式”,可以让网页从别的网域获取资料。
关于Jsonp更详细的资料请参考http://baike.baidu.com/view/2131174.htm,下面给出例子:
一.客户端
- <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
- <html>
- <head>
- <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
- <title>Insert title here</title>
- <script type="text/javascript" src="resource/js/jquery-1.7.2.js"></script>
- </head>
- <script type="text/javascript">
- $(function(){
- /*
- //简写形式,效果相同
- $.getJSON("http://app.example.com/base/json.do?sid=1494&busiId=101&jsonpCallback=?",
- function(data){
- $("#showcontent").text("Result:"+data.result)
- });
- */
- $.ajax({
- type : "get",
- async:false,
- url : "http://app.example.com/base/json.do?sid=1494&busiId=101",
- dataType : "jsonp",//数据类型为jsonp
- jsonp: "jsonpCallback",//服务端用于接收callback调用的function名的参数
- success : function(data){
- $("#showcontent").text("Result:"+data.result)
- },
- error:function(){
- alert('fail');
- }
- });
- });
- </script>
- <body>
- <div id="showcontent">Result:</div>
- </body>
- </html>
二.服务器端
- import java.io.IOException;
- import java.io.PrintWriter;
- import java.util.HashMap;
- import java.util.Map;
- import javax.servlet.http.HttpServletRequest;
- import javax.servlet.http.HttpServletResponse;
- import net.sf.json.JSONObject;
- import org.springframework.stereotype.Controller;
- import org.springframework.web.bind.annotation.RequestMapping;
- @Controller
- public class ExchangeJsonController {
- @RequestMapping("/base/json.do")
- public void exchangeJson(HttpServletRequest request,HttpServletResponse response) {
- try {
- response.setContentType("text/plain");
- response.setHeader("Pragma", "No-cache");
- response.setHeader("Cache-Control", "no-cache");
- response.setDateHeader("Expires", 0);
- Map<String,String> map = new HashMap<String,String>();
- map.put("result", "content");
- PrintWriter out = response.getWriter();
- JSONObject resultJSON = JSONObject.fromObject(map); //根据需要拼装json
- String jsonpCallback = request.getParameter("jsonpCallback");//客户端请求参数
- out.println(jsonpCallback+"("+resultJSON.toString(1,1)+")");//返回jsonp格式数据
- out.flush();
- out.close();
- } catch (IOException e) {
- e.printStackTrace();
- }
- }
- }
jq+jsonp+ajax解决跨域问题的更多相关文章
- ajax解决跨域
http://www.cnblogs.com/sunxucool/p/3433992.html 为什么会出现跨域跨域问题来源于JavaScript的同源策略,即只有 协议+主机名+端口号 (如存在)相 ...
- JSONP方法解决跨域请求
Ajax跨域请求的问题 跨域:跨域名, 一个域名下的文件去请求了和他不一样的域名下的资源文件(注意是请求文件,而不是数据接口),那么就会产生跨域请求,下面来写一个ajax来跨域请求的例子 <!D ...
- 用jQuery与JSONP轻松解决跨域访问的问题【转】
原文地址:http://www.jb51.net/article/46463.htm 好在,有jquery帮忙,跨域问题似乎没那么难缠了.这次也借此机会对跨域问题来给刨根问底,结合实际的开发项目,查阅 ...
- ajax解决跨域方法(适用于自己写接口解决跨域)
原因是这样的:最近用PHP开发了一个网站,这个网站需要提供接口,接口开发完成之后,在本地进行请求,跨域测试. jsonp处理跨域和用PHP函数来处理跨域就不说了. 现在说的使用用 header 这个来 ...
- 用jQuery与JSONP轻松解决跨域访问的问题
浏览器端的真正跨域访问,推荐的是目前jQuery $.ajax()支持get方式的跨域,这其实是采用jsonp的方式来完成的. var qsData = {'searchWord':$("# ...
- C# 和Jsonp的一个小demo 用jQuery与JSONP轻松解决跨域访问的问题
客服端: 在A项目下面 建立一个 JsonpClient.aspx页面,代码如下: <%@ Page Language="C#" AutoEventWireup=& ...
- 使用jsonp完美解决跨域问题
调用web接口,get请求,发现提示:No 'Access-Control-Allow-Origin' header is present on the requested resource. 这个和 ...
- ajax解决跨域问题
1.在介绍之前先介绍几个概念 json: { date: "Sun Dec 24 21:44:42 CST 2017", temperature: "21", ...
- 详解Jquery和AngularJs,Servlet中jsonp解决跨域问题(转)
众所周知,jsonp可以解决跨域问题,下面是我在查阅资料和实际项目使用后的一些总结. Jquery中jsonp的使用 //myUrl = "http://localhost:8090/api ...
随机推荐
- Karma Police - Radiohead
音乐赏析似乎是一件没有意义的工作,与电影相比音乐更加抽象,不同的人对同一首歌会有完全不同的解读. 但一首歌一旦成为经典,就有解读它的必要,因为它一定诉出了一个群体的某些情绪. Karma police ...
- windows下面安装casperjs
因为需要 就学习了一下casperjs,CasperJS是一个开源的导航脚本处理和测试工具,基于PhantomJS(前端自动化测试工具)编写.由于casperjs对PhantomJS的依赖性,所以需要 ...
- win10窗口设置眼睛保护色
经常电脑前坐着,习惯了豆沙色窗口(据说保护眼睛): 目标 记事本,ide,office等窗口颜色豆沙色:如下图 步骤 打开注册表:win+r 运行"regedit": 依次打开[H ...
- css样式设计
1.行内元素(图片.文本)水平居中 通过给父元素设置 text-align:center html代码: <body> <div class="txtCenter" ...
- 1.jquery的变量赋予方式
1.首先通过将变量赋予 $_ = window.$ _jQuery = window.JQuery 2.将函数赋给两个全局变量 window.jQuery = window.$ = jQuery 3. ...
- MCU厂家
新唐(nuvoton):http://www.nuvoton.com/义隆(emc):http://www.emc.com.tw/chs/遠翔(feeling):http://www.feeling- ...
- Windows Store App 全球化:引用分离资源文件中的资源
大部分应用程序仅需要单个默认资源文件,例如Strings/zh-CN/Resources.resw,但是在某些应用程序中,最好将资源分离到多个资源文件中,以便更好地组织资源内容,这样就需要考虑如何引用 ...
- iOS开发网络篇—NSURLConnection基本使用
iOS开发网络篇—NSURLConnection基本使用 一.NSURLConnection的常用类 (1)NSURL:请求地址 (2)NSURLRequest:封装一个请求,保存发给服务器的全部数据 ...
- Linux 编写c++程序之openssl
在使用openssl 库前,需检测是否安装openssl , shell 窗口输入:openssl version , 在openssl 安装完成之后, 可通过vi 编写测试代码 . 本例中附上加密 ...
- IntelliJ IDEA 使用总结
IntelliJ IDEA 使用总结 http://my.oschina.net/xianggao/blog/97539 IntelliJ IDEA 问题解决:1.乱码,主要是快捷键的字样显示乱码 中 ...