参考地址：http://www.cnblogs.com/sunxucool/p/3433992.html
前台ajax异步请求，经常会遇到跨域请求数据，无返回的情况。何为跨域呢请求，如果在A网站中，我们希望使用Ajax来获得B网站中的特定内容,如果A网站与B网站不在同一个域中，那么就出现了跨域访问问题。Ajax的跨域访问问题是现有的Ajax开发人员比较常遇到的问题，一般会用jQuery的jsonp来解决。
jsonp是jQuery 一个专门用来解决跨域问题的类；
比较一下json与jsonp格式的区别：
json格式：
{
"message":"获取成功",
"state":"1",
"result":{"name":"工作组1","id":1,"description":"11"}
}
jsonp格式
callback({
"message":"获取成功",
"state":"1",
"result":{"name":"工作组1","id":1,"description":"11"}
})
看出来区别了吧，在url中callback传到后台的参数是神马callback就是神马，jsonp比json外面有多了一层，callback()。这样就知道怎么处理它了。于是修改后台代码。
下面我们用一台机器的两个不同的tomcat来模拟跨域请求，开启两个tomcat端口分别为8080和8013。
端口为8080的tomcat作为服务器，器servlet代码如下：
package com.servlet;
import java.io.IOException;
import java.io.Writer;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.json.JSONException;
import org.json.JSONObject;
public class KuaYuTestServlet extends HttpServlet {
public KuaYuTestServlet() {
super();
}
public void destroy() {
super.destroy();
}
public void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
doPost(request,response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
Writer writer = response.getWriter();
//展示不明白为什么要这么写，但是必须要写
String callback = request.getParameter("callback");
//添加json测试数据
JSONObject json = new JSONObject();
try {
json.put("ret", "ret");
json.put("msg", "msg");
json.put("zoneid","zoneid");
} catch (JSONException e) {
e.printStackTrace();
}
response.setContentType("text/html");
response.setCharacterEncoding("utf-8");
//写数据
writer.write(callback + "(" + json + ")");
}
public void init() throws ServletException {
}
}
端口为8013的tomcat做为客服端，其页面调用代码如下：
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>跨域测试2</title>
<script type="text/javascript" src="js/jquery.min.js"></script>
<script type="text/javascript">
$.ajax({
url : "http://127.0.0.1:8080/kuaYu2/KuaYuTestServlet",
dataType : 'jsonp',
processData : false,
type : 'get',
success : function(data) {
alert(data.ret);
},
error : function(XMLHttpRequest, textStatus,errorThrown) {
alert(XMLHttpRequest.status);
alert(XMLHttpRequest.readyState);
alert(textStatus);
}
});
</script>
</head>
<body>
<input type="text" value="">
</body>
</html>
附测试项目，将该项目分别发布到两个服务器上即可。
相关推荐
jQuery，作为一个强大的JavaScript库，提供了便捷的方式来处理这种问题，特别是通过其Ajax功能进行跨域请求。本示例"Jquery跨域Ajax请求测试"将详细讲解如何利用jQuery实现这一功能。 首先，了解同源策略是理解跨域...
基于ajax方式的跨域请求jsonp的前后台代码
【Ajax跨域请求WebService.asmx】是一个常见的Web开发技术应用场景，主要涉及到JavaScript的Ajax技术、C#编程语言以及ASP.NET的WebService组件。Ajax（Asynchronous JavaScript and XML）是一种在不刷新整个页面的...
**Ajax跨域请求问题与jQuery JSONP解析** 在Web开发中，Ajax技术被广泛用于实现页面的异步更新，但浏览器的同源策略（Same-Origin Policy）限制了Ajax请求只能向同源（协议、域名、端口均相同）的服务器发送。这在...
### AJAX跨域请求详解 #### 一、引言 在Web开发中，由于浏览器的同源策略限制，AJAX请求通常只能向同源服务器发送请求。然而，在实际应用中，跨域请求的需求非常常见。本篇文章将通过一个具体的示例（JSP页面+后台...
今天在项目中需要做远程数据加载并渲染页面，直到开发阶段才意识到ajax跨域请求的问题。于是想用代理的方式来解决这个跨域问题。 什么是跨域？简单的来说，出于安全方面的考虑，页面中的JavaScript无法访问其他...
这个"ajax跨域请求demo.zip"压缩包提供了一个关于如何实现Ajax跨域请求的示例，涉及到前后端的交互。 首先，我们关注"前端代码"部分。前端通常使用JavaScript库如jQuery来实现Ajax请求。jQuery的`$.ajax()`方法是...
为了解决AJAX跨域问题，开发者可以采用以下几种策略： 1. JSONP(JSON with Padding) JSONP是一种绕过同源策略的方法，它利用了`<script>`标签不受同源策略限制的特点。JSONP的工作原理是服务器提供一个可被调用的...
总的来说，JSONP是Ajax跨域请求的一种实用解决方案，尤其适用于只支持GET请求且不涉及复杂交互的场景。但是，它也有一些局限性，比如不支持POST请求、无法控制HTTP头部、无错误处理机制等。因此，在现代Web开发中，...
当使用AJAX进行跨域请求时，我们需要采取特殊的方法来规避同源策略。这里将详细讲解如何通过jQuery的AJAX实现跨域请求。 首先，了解什么是CORS（Cross-Origin Resource Sharing，跨源资源共享）。CORS是一种机制，...
6. **Domain属性（仅限子域）**：在cookies中设置`domain`属性可以实现跨子域共享，但这仅限于同一主域下的子域名之间，对AJAX跨域请求帮助有限。 在实际应用中，开发者通常根据项目需求和服务器环境选择合适的跨域...
总结，JSONP和CORS是解决JavaScript跨域问题的两种主要方法，它们各有优缺点，适用于不同的场景。JSONP简单易用，但安全性较低；CORS则更安全，但需要服务器端的配合。在实际开发中，根据项目需求和浏览器兼容性选择...
ajax请求报parsererror错误是很宽泛的概念,很多情况下都报这个错, 在很多时候,即使ajax提交、返回都正常 XMLHttpRequest.status=200 (正常响应) XMLHttpRequest.readyState=4 (正常接收) ajax也会提示一个parse...
**CORS技术详解：解决AJAX跨域问题** 在Web开发中，由于浏览器的同源策略限制，AJAX请求只能向同一源（协议+域名+端口）发送，这在跨域请求时会遇到障碍。为了解决这个问题，CORS（Cross-Origin Resource Sharing，...
本篇将详细介绍如何解决Ajax跨域访问的问题。 1. **什么是同源策略** 同源策略是浏览器为了保护用户安全而实施的一项安全策略，它限制了来自不同源的“文档”或脚本对彼此的交互。在没有明确许可的情况下，...
"详解Spring Boot 2.0.2+Ajax解决跨域请求的问题" 知识点1：什么是跨域请求？ 跨域请求是指浏览器从一个域名下的网页去请求另一个域名下的资源时，会出现的安全限制问题。该限制是因为浏览器的同源策略（Same-...
1. **AJAX跨域**: 通常，AJAX请求受到同源策略限制。为实现跨域，我们可以使用CORS（Cross-Origin Resource Sharing）机制。服务器需要在响应头中添加`Access-Control-Allow-Origin`字段，允许特定的源进行跨域访问...
### Ajax跨域问题及其解决方案 #### 一、Ajax跨域问题概述 在现代Web开发中，前后端分离架构越来越流行。这种模式下，前端页面与后端服务通常部署在不同的服务器上，甚至可能位于不同的域名下。当浏览器发起对不同...