ajax跨域调用webservice

langjiao

2011-03-03

跨域请求有多种实现方式，这里只谈谈通过iframe

很简单，就是在一个主页面嵌入一个iframe,而这个iframe的url可以指向不同的域的地址，问题是现在这两个域还不能传递信息，下来看看如何传递信息把

1、iframe可以设置父窗口的锚，这样就可以把返回的参数设置到父框架的锚

2、主框架可以通过location.hash方法可以获得窗口的锚

因为是在不同的域过于通过javascript出于安全考虑无法获得不同域的任何信息，但可以设置不同框架的url，所以我们要设置url的时候不能让页面跳转又要传递信息，在url后面加"#"好在把我们的信息放在后面，这样页面就不回跳转并且带了要交互的信息，为了安全起见我们可以把我要传的消息通过ecodeURIComponent加密和decodeURIComponent解密

下面为测试代码：

１、index.jsp文件

<%@ page language="java" import="java.util.*" pageEncoding="ISO-8859-1"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <base href="<%=basePath%>">
    
    <title>My JSP 'index.jsp' starting page</title>
    <meta http-equiv="pragma" content="no-cache">
    <meta http-equiv="cache-control" content="no-cache">
    <meta http-equiv="expires" content="0">    
    <meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
    <meta http-equiv="description" content="This is my page">
    <!--
    <link rel="stylesheet" type="text/css" href="styles.css">
    -->
    <script>
    <!--
        var time=null;
        var oldText=null;
        function getText(){
            //document.frames[0].src="#"
            var text=location.hash;
            if(text.length>=1&&text.charAt(0)=='#'){
                text=text.substring(1);
                text=decodeURIComponent(text);
            }
            return text;
        }
        function circle(){
            var text=getText();
            if(text!=oldText){
                oldText=text;
                document.getElementById("text").value=text;
            }
            timer = window.setTimeout(circle, 100);
        }
        window.onload=function(){
            timer = window.setTimeout(circle, 100);
        }
        -->
    </script>
  </head>
  
  <body>
    This is my JSP page. <br>
    <input type="button" value="button" onclick="getText()"/><input type="text" value="" id="text"/>
    <iframe id="iframe" src="http://192.168.1.28:8080/HelloWorld/test.html"  width="300" height="200"/>
  </body>
</html>

２、test.html

<html>
<title>
Call webservice with javascript and xmlhttp.
</title>
<body>
<script language="javascript">
<!--
//Test function with get method.
function RequestByGet(data){

var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
//Webservice location.
var URL="http://192.168.1.28:8080/HelloWorld/services/HelloWorldService";
xmlhttp.Open("GET",URL, false);
xmlhttp.SetRequestHeader ("Content-Type","text/xml; charset=utf-8");
xmlhttp.SetRequestHeader ("SOAPAction","http://service.tough_tide.com");
xmlhttp.Send(data);
var result = xmlhttp.status;
//OK
if(result==200) {
document.write(xmlhttp.responseText);
}
xmlhttp = null;
}

//Test function with post method
/*
 <soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:q0="http://service.tough_tide.com" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
 <soapenv:Body>
  <q0:example>
  <q0:in0>helloworld</q0:in0> 
  </q0:example>
  </soapenv:Body>
  </soapenv:Envelope>*/
function RequestByPost(value)
{
var data;
data = '<?xml version="1.0" encoding="utf-8"?>';
data = data + '<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:q0="http://service.tough_tide.com" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">';
data = data + '<soapenv:Body>';
data = data + '<q0:example>';
data = data + '<q0:in0>'+document.getElementById("content").value+'</q0:in0>';
data = data + '</q0:example>';
data = data + '</soapenv:Body>';
data = data + '</soapenv:Envelope>';
var xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
var URL="http://192.168.1.28:8080/HelloWorld/services/HelloWorldService";
xmlhttp.Open("POST",URL, false);
xmlhttp.SetRequestHeader ("Content-Type","text/xml; charset=utf-8");
xmlhttp.SetRequestHeader ("SOAPAction","http://service.tough_tide.com");
xmlhttp.Send(data);
//document.write(xmlhttp.responseText);
//document.getElementById("text").value= xmlhttp.responseText;

var oRE = /<ns1:out>(.*)<\/ns1:out>/gi;
oRE.test(xmlhttp.responseText);
document.getElementById("text").value=RegExp["$1"];
changeURL(RegExp["$1"]);
}
function changeURL(str){
    var f = parent;
    //var url=parent.location.href;
    f.location.href = "http://localhost:8080/HelloWorld/index.jsp" + "#"+encodeURIComponent(str);
}
-->
</Script>

<input type="text" id="content" />
<input type="button" value="CallWebserviceByPost" onClick="RequestByPost('Zach')">
<textarea rows="30" cols="50" id="text"></textarea>
</body>
</html>

３、webService的WDSL

<?xml version="1.0" encoding="UTF-8" ?> 
- <wsdl:definitions targetNamespace="http://service.tough_tide.com" xmlns:tns="http://service.tough_tide.com" xmlns:wsdlsoap="http://schemas.xmlsoap.org/wsdl/soap/" xmlns:soap12="http://www.w3.org/2003/05/soap-envelope" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soapenc11="http://schemas.xmlsoap.org/soap/encoding/" xmlns:soapenc12="http://www.w3.org/2003/05/soap-encoding" xmlns:soap11="http://schemas.xmlsoap.org/soap/envelope/" xmlns:wsdl="http://schemas.xmlsoap.org/wsdl/">
- <wsdl:types>
- <xsd:schema xmlns:xsd="http://www.w3.org/2001/XMLSchema" attributeFormDefault="qualified" elementFormDefault="qualified" targetNamespace="http://service.tough_tide.com">
- <xsd:element name="example">
- <xsd:complexType>
- <xsd:sequence>
  <xsd:element maxOccurs="1" minOccurs="1" name="in0" nillable="true" type="xsd:string" /> 
  </xsd:sequence>
  </xsd:complexType>
  </xsd:element>
- <xsd:element name="exampleResponse">
- <xsd:complexType>
- <xsd:sequence>
  <xsd:element maxOccurs="1" minOccurs="1" name="out" nillable="true" type="xsd:string" /> 
  </xsd:sequence>
  </xsd:complexType>
  </xsd:element>
  </xsd:schema>
  </wsdl:types>
- <wsdl:message name="exampleRequest">
  <wsdl:part name="parameters" element="tns:example" /> 
  </wsdl:message>
- <wsdl:message name="exampleResponse">
  <wsdl:part name="parameters" element="tns:exampleResponse" /> 
  </wsdl:message>
- <wsdl:portType name="HelloWorldServicePortType">
- <wsdl:operation name="example">
  <wsdl:input name="exampleRequest" message="tns:exampleRequest" /> 
  <wsdl:output name="exampleResponse" message="tns:exampleResponse" /> 
  </wsdl:operation>
  </wsdl:portType>
- <wsdl:binding name="HelloWorldServiceHttpBinding" type="tns:HelloWorldServicePortType">
  <wsdlsoap:binding style="document" transport="http://schemas.xmlsoap.org/soap/http" /> 
- <wsdl:operation name="example">
  <wsdlsoap:operation soapAction="" /> 
- <wsdl:input name="exampleRequest">
  <wsdlsoap:body use="literal" /> 
  </wsdl:input>
- <wsdl:output name="exampleResponse">
  <wsdlsoap:body use="literal" /> 
  </wsdl:output>
  </wsdl:operation>
  </wsdl:binding>
- <wsdl:service name="HelloWorldService">
- <wsdl:port name="HelloWorldServiceHttpPort" binding="tns:HelloWorldServiceHttpBinding">
  <wsdlsoap:address location="http://localhost:8080/HelloWorld/services/HelloWorldService" /> 
  </wsdl:port>
  </wsdl:service>
  </wsdl:definitions>

4、请求的信封

- <soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:q0="http://service.tough_tide.com" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance">
- <soapenv:Body>
- <q0:example>
  <q0:in0>asdfdsa</q0:in0> 
  </q0:example>
  </soapenv:Body>
  </soapenv:Envelope>

本文来自CSDN博客，转载请标明出处：http://blog.csdn.net/huangfeng1982712/archive/2008/03/27/2223097.aspx

ajax 科技新闻