html代码：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" >
<head>
<title>使用JSONP解决跨域请求</title>
<script type="text/javascript" src="http://192.168.118.64:8989/htmlunit/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
jQuery(document).ready(function(){
$.ajax({
type: "get",
async: false,
url: "http://192.168.118.64:8989/htmlunit/jsonp/ts.json?code=CA1998",
dataType: "jsonp",
jsonp: "callback",//传递给请求处理程序或页面的，用以获得jsonp回调函数名的参数名(一般默认为:callback)
jsonpCallback:"flightHandler",//自定义的jsonp回调函数名称，默认为jQuery自动生成的随机函数名，也可以写"?"，jQuery会自动为你处理数据
success: function(json){
//alert('您查询到航班信息：票价： ' + json.price + ' 元，余票： ' + json.tickets + ' 张。');
$("#price").text(json.price);
$("#tickets").text(json.tickets);
},
error: function(){
alert('fail');
}
});
});
</script>
</head>
<body>
<div>
<h3>机票信息</h3>
<div>票价：<span id="price">查询中...</span></div>
<div>余票：<span id="tickets">查询中...</span></div>
</div>
</body>
</html>
服务器代码：
package servlet;
import java.io.IOException;
import java.io.PrintWriter;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
/**
* 这个是个JSONP的演示的例子，用于解决跨域请求的问吧。
* @author hc24
*
*/
public class TestServlet extends HttpServlet {
/**
* Destruction of the servlet. <br>
*/
public void destroy() {
super.destroy(); // Just puts "destroy" string in log
// Put your code here
}
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
doPost(request, response);
}
/**
* The doPost method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to post.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
//response.setContentType("text/html");
PrintWriter out = response.getWriter();
/* 得到回调的方法名 */
String methodName=request.getParameter("callback");
/* 得到参数 */
String flightNo=request.getParameter("code");
/*下面应该是根据参数查询价格和座位数 */
try {
Thread.sleep(3000);
} catch (InterruptedException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
float price=1780.00f;
int tickets=5;
StringBuilder sb=new StringBuilder();
sb.append(methodName+"({");
sb.append("code:\""+flightNo+"\",");
sb.append("price:"+price+",");
sb.append("tickets:"+tickets+"");
sb.append("})");
out.write(sb.toString());//返回到客户端
out.flush();
out.close();
}
/**
* Initialization of the servlet. <br>
*
* @throws ServletException if an error occurs
*/
public void init() throws ServletException {
// Put your code here
}
}
相关推荐
PHP AJAX JSONP 实现跨域请求使用实例 在 Web 开发中，跨域请求是指从一个域名下的页面请求另一个域名下的资源，这种情况下，浏览器会限制这种请求，以防止恶意攻击。JSONP（JSON with Padding）是一种解决跨域请求...
**AJAX和JSONP跨域请求的实现过程** 1. **AJAX跨域**: 通常，AJAX请求受到同源策略限制。为实现跨域，我们可以使用CORS（Cross-Origin Resource Sharing）机制。服务器需要在响应头中添加`Access-Control-Allow-...
在两个Tomcat服务器之间进行跨域访问演示，我们可以设置CORS（Cross-Origin Resource Sharing）头信息，允许特定的跨域请求。在Tomcat的配置文件（如server.xml）中，我们可以通过添加过滤器或在Servlet中设置响应头...
"jsonp跨域请求"可能是服务器返回的示例数据，模拟了JSONP的跨域请求过程。 总结，JSONP和CORS是解决JavaScript跨域问题的两种主要方法，它们各有优缺点，适用于不同的场景。JSONP简单易用，但安全性较低；CORS则更...
本篇文章将详细讲解如何利用jQuery的jsonp方法实现Ajax跨域请求，以及如何在服务器端使用.Net的*.handler和WebService来返回JSON数据。 首先，理解JSONP的基本原理。JSONP是一种非官方的协议，通过动态创建`...
JSONP（JSON with Padding）是一种跨域数据交互协议，它利用了`<script>`标签可以跨域请求资源的特性来实现数据的交换。在Web开发中，由于浏览器的同源策略限制，JavaScript通常无法直接访问不同源的资源，但JSONP...
jsonp解决跨域 JsonP（JSON with Padding）是一种常用的解决跨域请求的技术。在本文中，我们将详细介绍 JsonP 的原理、作用、优缺点和使用场景。...JsonP 的使用场景非常广泛，例如跨域请求数据、实时更新数据等。
JSONP（JSON with Padding）是一种跨域数据交互协议，它利用了`<script>`标签可以跨域请求资源的特性，为了解决JavaScript在浏览器端由于同源策略限制无法直接访问不同源的HTTP请求的问题。在本场景中，前端使用...
### JSONP 跨域请求数据实现手机号码查询实例分析 #### 前言 在现代Web开发中，跨域问题一直是前端开发者面临的一个常见难题。简单来说，由于浏览器的同源策略限制，当一个网页尝试从不同的源（即不同的协议、端口...
基于ajax方式的跨域请求jsonp的前后台代码
使用jQuery提供的接口，开发者可以很容易地实现JSONP跨域请求，具体方法包括$.ajax()、$.getJSON()和$.getScript()等。在实际使用过程中，需要注意回调函数名的正确传递和处理，以及确保服务器端正确响应JSONP请求。...
然而，Ajax技术在实现动态网页交互时常常需要跨越这个限制，这时就引入了JSONP（JSON with Padding）作为跨域请求的一种解决方案。本文将详细介绍JSONP的工作原理以及如何在ASP.NET网站开发中应用JSONP解决Ajax跨域...
知识点三: 使用 JSONP 完成 HTTPS 跨域请求的前提条件 使用 JSONP 完成 HTTPS 跨域请求需要满足以下前提条件： 1. 已配置本机 Java 环境 2. 已安装 Tomcat 6.0 知识点四: 生成服务器证书 使用 Keytool 工具生成...
JSONP（JSON with Padding）是一种解决跨域请求的方法，主要用于解决不同域之间因浏览器同源策略限制而无法进行AJAX请求的问题...然而，随着现代浏览器对CORS的支持越来越好，开发者们更倾向于使用CORS来实现跨域请求。
在Web开发中，跨域（Cross-Origin）是一个常见的问题，特别是在使用Ajax进行异步数据交互时。跨域限制是浏览器为了安全原因而设置的一种机制，防止恶意网站通过脚本访问其他站点的数据。本文将深入探讨两种主要的...
在本项目"JSONP跨域实现百度搜索功能(v1.0.0)"中，我们将深入探讨如何利用JSONP技术来实现在网页上嵌入一个能够进行百度搜索的功能。 首先，我们需要理解为什么需要JSONP。浏览器的同源策略是出于安全考虑，不允许...
JSONP的核心在于script标签不受同源策略限制，可以跨域请求数据。 在给定文件中，我们看到了一段使用JSONP方法实现跨域获取数据的JavaScript代码实例及其在HTML页面中的应用。首先，我们定义了一个名为`jsonp`的...
由于浏览器允许不同源的`<script>`标签加载和执行，开发者可以利用这一点来实现跨域请求。 ### JSONP工作原理 1. **客户端（浏览器）**：在JavaScript中，我们创建一个`<script>`元素，并设置其`src`属性为服务器...