ajax
ajax_domain_access.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>Test Jsonp</title>
<script type="text/javascript" src="tw-sack.js"></script>
<script type="text/javascript">
var ajax = new sack();
function a(){
ajax.requestFile = "http://localhost:8080/AjaxDomain/test";
ajax.method = "GET";
ajax.onCompletion = jsonpCallback;
ajax.runAJAX();
}
function jsonpCallback(result)
{
alert(result.msg);
}
</script>
<script type="text/javascript"
src="http://localhost:8080/AjaxDomain/test?jsonp=jsonpCallback"></script>
</head>
<body>
<input type="button" value="root1" id="root1" onclick="a()"/>
</body>
</html>
tw-sack.js
function sack(file) {
this.xmlhttp = null;
this.resetData = function() {
this.method = "POST";
this.queryStringSeparator = "?";
this.argumentSeparator = "&";
this.URLString = "";
this.encodeURIString = true;
this.execute = false;
this.element = null;
this.elementObj = null;
this.requestFile = file;
this.vars = new Object();
this.responseStatus = new Array(2);
};
this.resetFunctions = function() {
this.onLoading = function() { };
this.onLoaded = function() { };
this.onInteractive = function() { };
this.onCompletion = function() { };
this.onError = function() { };
this.onFail = function() { };
};
this.reset = function() {
this.resetFunctions();
this.resetData();
};
this.createAJAX = function() {
try {
this.xmlhttp = new ActiveXObject("Msxml2.XMLHTTP");
} catch (e1) {
try {
this.xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
} catch (e2) {
this.xmlhttp = null;
}
}
if (! this.xmlhttp) {
if (typeof XMLHttpRequest != "undefined") {
this.xmlhttp = new XMLHttpRequest();
} else {
this.failed = true;
}
}
};
this.setVar = function(name, value){
this.vars[name] = Array(value, false);
};
this.encVar = function(name, value, returnvars) {
if (true == returnvars) {
return Array(encodeURIComponent(name), encodeURIComponent(value));
} else {
this.vars[encodeURIComponent(name)] = Array(encodeURIComponent(value), true);
}
}
this.processURLString = function(string, encode) {
encoded = encodeURIComponent(this.argumentSeparator);
regexp = new RegExp(this.argumentSeparator + "|" + encoded);
varArray = string.split(regexp);
for (i = 0; i < varArray.length; i++){
urlVars = varArray[i].split("=");
if (true == encode){
this.encVar(urlVars[0], urlVars[1]);
} else {
this.setVar(urlVars[0], urlVars[1]);
}
}
}
this.createURLString = function(urlstring) {
if (this.encodeURIString && this.URLString.length) {
this.processURLString(this.URLString, true);
}
if (urlstring) {
if (this.URLString.length) {
this.URLString += this.argumentSeparator + urlstring;
} else {
this.URLString = urlstring;
}
}
// prevents caching of URLString
this.setVar("rndval", new Date().getTime());
urlstringtemp = new Array();
for (key in this.vars) {
if (false == this.vars[key][1] && true == this.encodeURIString) {
encoded = this.encVar(key, this.vars[key][0], true);
delete this.vars[key];
this.vars[encoded[0]] = Array(encoded[1], true);
key = encoded[0];
}
urlstringtemp[urlstringtemp.length] = key + "=" + this.vars[key][0];
}
if (urlstring){
this.URLString += this.argumentSeparator + urlstringtemp.join(this.argumentSeparator);
} else {
this.URLString += urlstringtemp.join(this.argumentSeparator);
}
}
this.runResponse = function() {
eval(this.response);
}
this.runAJAX = function(urlstring) {
if (this.failed) {
this.onFail();
} else {
this.createURLString(urlstring);
if (this.element) {
this.elementObj = document.getElementById(this.element);
}
if (this.xmlhttp) {
var self = this;
if (this.method == "GET") {
totalurlstring = this.requestFile + this.queryStringSeparator + this.URLString;
this.xmlhttp.open(this.method, totalurlstring, true);
} else {
this.xmlhttp.open(this.method, this.requestFile, true);
try {
this.xmlhttp.setRequestHeader("Content-Type", "application/x-www-form-urlencoded;charset=utf-8")
//this.xmlhttp.setRequestHeader("Content-Type", "text/xml;charset=gbk")
} catch (e) { }
}
this.xmlhttp.onreadystatechange = function() {
switch (self.xmlhttp.readyState) {
case 1:
self.onLoading();
break;
case 2:
self.onLoaded();
break;
case 3:
self.onInteractive();
break;
case 4:
self.response = self.xmlhttp.responseText;
self.responseXML = self.xmlhttp.responseXML;
//alert(self.response);
self.responseStatus[0] = self.xmlhttp.status;
self.responseStatus[1] = self.xmlhttp.statusText;
if (self.execute) {
self.runResponse();
}
if (self.elementObj) {
elemNodeName = self.elementObj.nodeName;
elemNodeName.toLowerCase();
if (elemNodeName == "input"
|| elemNodeName == "select"
|| elemNodeName == "option"
|| elemNodeName == "textarea") {
self.elementObj.value = self.response;
} else {
self.elementObj.innerHTML = self.response;
}
}
if (self.responseStatus[0] == "200") {
self.onCompletion();
} else {
self.onError();
}
self.URLString = "";
break;
}
};
this.xmlhttp.send(this.URLString);
}
}
};
this.reset();
this.createAJAX();
}
testservlet
package com.kanba.ajaxdomain;
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;
public class Test extends HttpServlet {
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
this.doPost(req, resp);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
//String string = request.getParameter("username");
//if("a".equals(string))
// String jsoncallback=request.getParameter("jsoncallback");
// //out.print(jsoncallback+"({\"account\":\"XX\",\"passed\":\"true\",\"error\":\"drr\"})");
// out.println("jsonpCallback({msg:'this is json data'})");
String callback = request.getParameter("callback");
out.print(callback + "([{name:\"John\",password:'xuxiangpan'}])");
out.flush();
out.close();
}
}
下面是用jquery ajax 跨域[size=large][/size]
test.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>test.html</title>
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="this is my page">
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
<script type="text/javascript" src="jquery-1.3.js"></script>
<script type="text/javascript">
function a(){
$.getJSON("http://root1.kanba.tv:8080/AjaxDomain/test?callback=?",
function(json){
//alert(json);
alert(json[0].name);
}
);
}
</script>
</head>
<body>
This is my HTML page.
<input type="button" value="root1" id="root1" onclick="a()"/>
</body>
</html>
test对应的servlet
package com.kanba.ajaxdomain;
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;
public class Test extends HttpServlet {
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
this.doPost(req, resp);
}
protected void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html;charset=utf-8");
PrintWriter out = response.getWriter();
String callback = request.getParameter("callback");
out.print(callback + "([ { name:\"John\",password:'xuxiangpan'} ] )");
out.flush();
out.close();
}
}
用jsp也可以
url test.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String callback = request.getParameter("callback");
out.print(callback + "([ { name:\"John\",password:'xuxiangpan'} ] )");
%>
分享到：
相关推荐
【AJAX跨域解决办法】 在Web开发中，AJAX（Asynchronous JavaScript and XML）是一种在无需刷新整个页面的情况下更新部分网页的技术。然而，由于浏览器的同源策略限制，AJAX请求通常只能发送到与当前页面同一源的...
本教程将详细讲解如何在Spring Boot项目中利用Redis来存储和共享Session，并解决Ajax跨域问题。 首先，我们需要理解Spring Boot中的Session管理。默认情况下，Spring Boot使用内存中的HttpSession来存储用户会话...
本示例“demo跨域ajax_DEMO_ajax跨域”着重解决C#后端与JavaScript前端之间的跨域限制。这里我们将深入探讨什么是跨域、为何会产生跨域问题以及如何通过C#和Ajax实现跨域通信。 首先，我们需要了解什么是跨域。根据...
ajax跨域
JavaScript跨域和Ajax跨域是Web开发中常见的问题，尤其在进行前后端分离或API调用时，由于浏览器的同源策略限制，不同域名、协议或端口的资源请求会被阻止，这就是所谓的“跨域”。本文将深入探讨JavaScript和Ajax...
以下是实现AJAX跨域调用WCF服务的具体步骤和相关知识点： 1. **开启WCF服务的跨域支持**：在WCF服务的配置文件（通常是ServiceName.svc.cs或IServiceName.cs）中，需要启用跨域资源共享（CORS）。这可以通过添加`...
**Ajax跨域详解** 在Web开发中，Ajax（Asynchronous JavaScript and XML）技术允许我们实现页面的异步更新，无需刷新整个页面即可获取并展示新数据。然而，由于浏览器的安全策略，同一源策略（Same-Origin Policy）...
**Ajax跨域访问解决方案** 在Web开发中，Ajax（Asynchronous JavaScript and XML）技术被广泛用于实现页面的异步更新，提升用户体验。然而，由于浏览器的同源策略限制，Ajax请求只能向同源（协议、域名和端口相同）...
**CORS技术详解：解决AJAX跨域问题** 在Web开发中，由于浏览器的同源策略限制，AJAX请求只能向同一源（协议+域名+端口）发送，这在跨域请求时会遇到障碍。为了解决这个问题，CORS（Cross-Origin Resource Sharing，...
本篇文章将详细讲解如何利用jQuery的jsonp方法实现Ajax跨域请求，以及如何在服务器端使用.Net的*.handler和WebService来返回JSON数据。 首先，理解JSONP的基本原理。JSONP是一种非官方的协议，通过动态创建`...
### 解决Ajax跨域问题 在现代Web开发中，跨域问题经常出现并困扰着开发者。根据提供的文件信息，本文将详细介绍如何通过JSONP等方法解决Ajax跨域问题。 #### Ajax与同源策略 首先，我们需要了解为什么会出现跨域...
本文将深入探讨如何解决Ajax跨域请求的问题。 首先，理解“同源策略”是解决问题的关键。同源策略是浏览器为了保障网络安全而设定的一种机制，它禁止了一个源的文档或脚本访问另一个源的属性，这里的“源”指的是...
### 如何实现Ajax跨域访问 在Web开发中，由于同源策略的限制，JavaScript只能对同源的页面进行操作，不能对不同源的页面进行请求。然而，在实际的应用场景中，经常会出现需要向不同域名下的服务器发起请求的情况。...
本教程将重点讲解如何在ASP.NET Web环境中处理Ajax跨域访问。 一、理解同源策略 同源策略是浏览器为了保护用户安全而实施的一项安全机制，它禁止了一个源（domain）的文档或脚本获取或操作另一个源的资源。这意味着...
标题 "IE7 Ajax跨域问题" 涉及到的是在使用Ajax技术在Internet Explorer 7（IE7）浏览器中处理跨域请求时遇到的挑战。在Web开发中，Ajax（Asynchronous JavaScript and XML）是一种在不刷新整个页面的情况下与服务器...
【Ajax跨域文件上传详解】 Ajax（Asynchronous JavaScript and XML）技术允许我们在不刷新整个页面的情况下，通过JavaScript异步地与服务器交换数据并更新部分网页内容。在现代Web开发中，Ajax广泛应用于创建动态和...
但随着互联网应用的发展，这种需求变得越来越普遍，于是诞生了"ajax跨域获取数据"的技术解决方案。这个话题涵盖了多个关键知识点，包括同源策略、CORS（跨源资源共享）以及JSONP等。 1. 同源策略：同源策略是浏览器...
### Ajax跨域问题及其解决方案 #### 一、Ajax跨域问题概述 在现代Web开发中，前后端分离架构越来越流行。这种模式下，前端页面与后端服务通常部署在不同的服务器上，甚至可能位于不同的域名下。当浏览器发起对不同...
可以将book.aa.com用iframe添加到 www.aa.com的某个页面下,在www.aa.com和iframe里面都加上document.domain = "aa.com"，这样就可以统一域了，可以实现跨域访问。就和平时同一个域中镶嵌iframe一样，直接调用里面的...