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. Yii 添加Input时间插件

    1.首先引入时间组件的JS文件,组件可以在网上下载到没有的可以到网上去下载 <script language="javascript" type="text/jav ...

  2. .NET WebForm 简介

    WebForm是微软开发的一款产品,它将用户的请求和响应都封装为控件.让开发者认为自己是在操作一个windows界面.极大地提高了开发效率. 在学习WebForm时,其知识量比WinForm要多,在实 ...

  3. Rhel6-cacti+nagios+ganglia(apache)配置文档

    (lamp平台) 系统环境: rhel6 x86_64 iptables and selinux disabled 主机: 192.168.122.119 server19.example.com 1 ...

  4. net 的单元测试 初学

    1. 都要以一个方法 这样的去测试 2. 利用工具 Install-Package Moq -Version 4.0 (最高的是4.5  4.0适用于自己项目的版本)   Moq.dll 进行测试   ...

  5. 【转】解决编译安装NGINX时make报错

    编译参数:--[root@localhostnginx-1.4.6]#./configure--user=nginx--group=nginx--prefix=/usr/local/nginx--wi ...

  6. Libgdx 开发指南(1.2) 应用框架——模块概览

    模块概览 引言 LibGDX由一些为一个典型游戏架构中的各个步骤提供服务的模块组成. Input:为所有平台提供一致的输入模型与处理器.支持键盘.触屏.加速度传感器与鼠标. Graphics:使用硬件 ...

  7. 使用Template控制Editor显示方式

    @Html.EditorFor可以由Template决定显示 虽然都是EditorFor,页面上显示却不同,ReleaseDate是一个Jquery DatePicker: 怎么实现的呢?就是Temp ...

  8. linux内核分析——扒开系统调用的三层皮

    万子惠 + 原创作品转载请注明出处 + <Linux内核分析>MOOC课程http://mooc.study.163.com/course/USTC-1000029000 实验部分 选择2 ...

  9. java类型转化之SimpleDateFormat-时间转化

    关于Date,时间戳(long),String类型之间的相互转换,主要是用到类SimpleDateFormat. 先介绍SimpleDateFormat类的一些常见格式: 1.参数: code des ...

  10. vi 编辑器命令 (share)

    转自:http://man.ddvip.com/soft/vieditor/vi.html 一.Unix编辑器概述 编辑器是使用计算机的重要工具之一,在各种操作系统中,编辑器都是必不可少的部件.Uni ...