Jsonp(JSON with Padding)是资料格式 json 的一种“使用模式”,可以让网页从别的网域获取资料。

关于Jsonp更详细的资料请参考http://baike.baidu.com/view/2131174.htm,下面给出例子:

一.客户端

  1. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  2. <html>
  3. <head>
  4. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
  5. <title>Insert title here</title>
  6. <script type="text/javascript" src="resource/js/jquery-1.7.2.js"></script>
  7. </head>
  8. <script type="text/javascript">
  9. $(function(){
  10. /*
  11. //简写形式,效果相同
  12. $.getJSON("http://app.example.com/base/json.do?sid=1494&busiId=101&jsonpCallback=?",
  13. function(data){
  14. $("#showcontent").text("Result:"+data.result)
  15. });
  16. */
  17. $.ajax({
  18. type : "get",
  19. async:false,
  20. url : "http://app.example.com/base/json.do?sid=1494&busiId=101",
  21. dataType : "jsonp",//数据类型为jsonp
  22. jsonp: "jsonpCallback",//服务端用于接收callback调用的function名的参数
  23. success : function(data){
  24. $("#showcontent").text("Result:"+data.result)
  25. },
  26. error:function(){
  27. alert('fail');
  28. }
  29. });
  30. });
  31. </script>
  32. <body>
  33. <div id="showcontent">Result:</div>
  34. </body>
  35. </html>

二.服务器端

  1. import java.io.IOException;
  2. import java.io.PrintWriter;
  3. import java.util.HashMap;
  4. import java.util.Map;
  5. import javax.servlet.http.HttpServletRequest;
  6. import javax.servlet.http.HttpServletResponse;
  7. import net.sf.json.JSONObject;
  8. import org.springframework.stereotype.Controller;
  9. import org.springframework.web.bind.annotation.RequestMapping;
  10. @Controller
  11. public class ExchangeJsonController {
  12. @RequestMapping("/base/json.do")
  13. public void exchangeJson(HttpServletRequest request,HttpServletResponse response) {
  14. try {
  15. response.setContentType("text/plain");
  16. response.setHeader("Pragma", "No-cache");
  17. response.setHeader("Cache-Control", "no-cache");
  18. response.setDateHeader("Expires", 0);
  19. Map<String,String> map = new HashMap<String,String>();
  20. map.put("result", "content");
  21. PrintWriter out = response.getWriter();
  22. JSONObject resultJSON = JSONObject.fromObject(map); //根据需要拼装json
  23. String jsonpCallback = request.getParameter("jsonpCallback");//客户端请求参数
  24. out.println(jsonpCallback+"("+resultJSON.toString(1,1)+")");//返回jsonp格式数据
  25. out.flush();
  26. out.close();
  27. } catch (IOException e) {
  28. e.printStackTrace();
  29. }
  30. }
  31. }

jq+jsonp+ajax解决跨域问题的更多相关文章

  1. ajax解决跨域

    http://www.cnblogs.com/sunxucool/p/3433992.html 为什么会出现跨域跨域问题来源于JavaScript的同源策略,即只有 协议+主机名+端口号 (如存在)相 ...

  2. JSONP方法解决跨域请求

    Ajax跨域请求的问题 跨域:跨域名, 一个域名下的文件去请求了和他不一样的域名下的资源文件(注意是请求文件,而不是数据接口),那么就会产生跨域请求,下面来写一个ajax来跨域请求的例子 <!D ...

  3. 用jQuery与JSONP轻松解决跨域访问的问题【转】

    原文地址:http://www.jb51.net/article/46463.htm 好在,有jquery帮忙,跨域问题似乎没那么难缠了.这次也借此机会对跨域问题来给刨根问底,结合实际的开发项目,查阅 ...

  4. ajax解决跨域方法(适用于自己写接口解决跨域)

    原因是这样的:最近用PHP开发了一个网站,这个网站需要提供接口,接口开发完成之后,在本地进行请求,跨域测试. jsonp处理跨域和用PHP函数来处理跨域就不说了. 现在说的使用用 header 这个来 ...

  5. 用jQuery与JSONP轻松解决跨域访问的问题

    浏览器端的真正跨域访问,推荐的是目前jQuery $.ajax()支持get方式的跨域,这其实是采用jsonp的方式来完成的. var qsData = {'searchWord':$("# ...

  6. C# 和Jsonp的一个小demo 用jQuery与JSONP轻松解决跨域访问的问题

    客服端:      在A项目下面 建立一个 JsonpClient.aspx页面,代码如下: <%@ Page Language="C#" AutoEventWireup=& ...

  7. 使用jsonp完美解决跨域问题

    调用web接口,get请求,发现提示:No 'Access-Control-Allow-Origin' header is present on the requested resource. 这个和 ...

  8. ajax解决跨域问题

    1.在介绍之前先介绍几个概念 json: { date: "Sun Dec 24 21:44:42 CST 2017", temperature: "21", ...

  9. 详解Jquery和AngularJs,Servlet中jsonp解决跨域问题(转)

    众所周知,jsonp可以解决跨域问题,下面是我在查阅资料和实际项目使用后的一些总结. Jquery中jsonp的使用 //myUrl = "http://localhost:8090/api ...

随机推荐

  1. WPF:ListView 分组合并

    CollectionViewSource 绑定的是从数据库取出的数据ListBind 以DeptName为分组依据 <Window.Resources> <CollectionVie ...

  2. apche的主配置文件)

    apche的主配置文件conf/httpd.conf(根据个人主机的路径设置,以下仅供参考) 需配置的行号与方法(示列): 172  #ServerName localhost:80 173 Serv ...

  3. 读<jquery 权威指南>[3]-动画

    一. 显示与隐藏——hide(),show() 1. 方法: hide(speed,[callback]); show(speed,[callback]); 说明:这两个方法还可以实现带动画效果的显示 ...

  4. PDF 补丁丁 0.4.2.1013 测试版发布:修复替换PDF文档字体等问题

    新的测试版修复了若干问题,建议下载了旧测试版的用户更新.修复的问题列表: 替换PDF文档字体可能将字体宽度变成0. 书签编辑器在加载XML书签时不显示对应文档的预览. 自动生成书签功能复制文本筛选器后 ...

  5. WCF初探-1:认识WCF

    1.WCF是什么? WindowsCommunication Foundation(WCF)是由微软发展的一组数据通信的应用程序开发接口,它是.NET框架的一部分,由.NET Framework 3. ...

  6. OC方法和文件编译

    OC方法和文件编译 一.OC方法 (一)对象方法 (1)对象方法以-开头如 -(void)xx; (2)对象方法只能又对象来调用 (3)对象方法中可以访问当前对象的成员变量 (4)调用格式   [对象 ...

  7. [双连通分量] POJ 3694 Network

    Network Time Limit: 5000MS   Memory Limit: 65536K Total Submissions: 9434   Accepted: 3511 Descripti ...

  8. java中byte, int的转换

    最近在做些与编解码相关的事情,又遇到了byte和int的转换,看着那些关于反码.补码的说明依旧头疼,还是记下些实用的方法吧.int -> byte可以直接使用强制类型转换: byte b = ( ...

  9. MySQLdb 1031 Error

    Python import MySQLdb 有可能报:site-packages/pkg_resources.py:1031: UserWarning: /home/***/.python-eggs ...

  10. 集合ArrayList

    /*集合ArrayList * 例如: * 1.创建:ArrayList<Egg> myList = new ArrayList<Egg>(); *      Egg类型的集合 ...