`
j2ee_zhongqi
  • 浏览: 202662 次
  • 性别: Icon_minigender_1
  • 来自: 深圳
社区版块
存档分类
最新评论

ajax跨域调用webservice

阅读更多
跨域请求有多种实现方式,这里只谈谈通过iframe
很简单,就是在一个主页面嵌入一个iframe,而这个iframe的url可以指向不同的域的地址,问题是现在这两个域还不能传递信息,下来看看如何传递信息把
1、iframe可以设置父窗口的锚,这样就可以把返回的参数设置到父框架的锚
2、主框架可以通过location.hash方法可以获得窗口的锚

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

2、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>

3、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
分享到:
评论
1 楼 xiaokang1582830 2012-11-14  
这有涉及到跨域?

相关推荐

    ajax跨域调用webservice的实现代码

    主要介绍了 ajax跨域调用webservice服务例子和理解,最近ajax访问webservice遇到跨域的问题,网上搜索资料,总结如下

    ajax跨域请求调用webservice接口+视频教程

    ajax跨域请求调用webservice接口+视频教程,上次的不带视频教程,这次带一个视频教程,一个流程下来,想学不会都很难!

    ajax+webservice跨域实现文件上传

    ajax跨域调用webservice实现文件上传,项目使用vs2019创建,请示用vs2019以上版本工具进行打开。

    Jquery Ajax 跨域调用asmx类型 WebService范例代码

    摘要:Ajax 在 Web 2.0 时代起着非常重要的作用,然而有时因为同源策略 (SOP)(俗称:跨域问题(cross domain)) 它的作用会受到限制。在本文中,将学习如何克服合作限制。本文以asmx方式搭建webservice作为测试用...

    Ajax请求WebService跨域问题的解决方案

     用Jquery中Ajax方式在asp.net开发环境中WebService接口的调用 2、出现的问题 原因分析:浏览器同源策略的影响(即JavaScript或Cookie只能访问同域下的内容); 3、解决方案: (1) JSONP:只支持GET方式 (2) CROS:...

    JS调用WebService.zip

    3,通过js请求,就是通过ajax请求,使用jQuery的ajax,通过jQuery.post(url)发送。使用的是XMLHttpRequest对象。 不可以通过jQuery的post方式发送! 因为对于jQuery来说,限制跨域访问。跨域是指两个服务器之间的...

    JSONP跨域GET请求解决Ajax跨域访问问题

    前几天,工作上有一新需求,需要前端web页面异步调用后台的Webservice方法返回信息。实现方法有多种,本例采用jQuery+Ajax,完成后,在本地调试了一切ok,但是部署到服务器上以后就出现问题了,后台服务调用没有响应...

    json 跨域demo

    LBS云服务,JSON跨域 java代码对应的WebService如何调用服务 ... *ajax跨域问题的解决方案 *调用本系统的action类,通过WebService调用方式实现 *$.getJSON(url?callback=?,funciton(data){ //解析data---json });

    浅析JSONP解决Ajax跨域访问问题的思路详解

    前几天,工作上有一新需求,需要前端web页面异步调用后台的Webservice方法返回信息。实现方法有多种,本例采用jQuery+Ajax,完成后,在本地调试了一切ok,但是部署到服务器上以后就出现问题了,后台服务调用没有响应...

    .NET WEB开发工具集合.zip

    其中主要功能包括:文件格式转换(doc转pdf、ppt转pdf、pdf转txt、pdf转pic,包括免安装Office常见第三方库实现和使用Office自己的COM实现),文件上传服务器,ajax具体用法(包括Aspx文件、Ashx文件、WebService、...

    Asp.netWebAPI解决跨域详解

    浏览器安全防止web页面发出AJAX请求到另一个领域。这种限制称为同源策略,这是为了防止恶意网站读取敏感数据。然而,有时候。您可能想要让其他网站调用您的webAPI。CrossOriginResourceSharing(CORS)是一种W3C标准,...

Global site tag (gtag.js) - Google Analytics