Jquery aJax 跨域訪問基於SOAP協議的WebService接口詳情 - jquery-ajax,webservice,soap idgq 博客

一、概念

同源策略

瀏覽器出於安全考慮禁止js操作非本域下的DOM對象同時也禁止XmlHttpRequest向非本域的服務器發送http請求。只要協議、域名、端口有任意一個不同就被認為是不同域，之間的js操作和XHR請求就是跨域操作

SOAP

全名：simple object access protol,簡易對象訪問協議，與RPC一樣都是基於HTTP的請求響應模式的遠程調用協議，通過XML協議傳輸數據。

WebService:

是一種跨編程語言和跨操作系統平台的遠程調用技術。所謂跨編程語言和跨操作平台，就是説服務端程序採用java編寫，客户端程序則可以
採用其他編程語言編寫，反之亦然！跨操作系統平台則是指服務端程序和客户端程序可以在不同的操作系統上運行

二、Demo

新建WebService項目

ctrl+n新建Dynamic Web Project, 項目結構如下

HelloService代碼如下：

import javax.jws.WebMethod;
import javax.jws.WebService;

@WebService
public class HelloService {
    
    @WebMethod
    public String say(String name) {
        System.out.println("-----------"+name);
        return"hello "+name;
    }

}

配置CORS Filter支持跨域, 在web.xml中加入以下代碼：

<filter>
<filter-name>CORS</filter-name>
<filter-class>com.thetransactioncompany.cors.CORSFilter</filter-class>
<init-param>
  <param-name>cors.allowOrigin</param-name>
  <param-value>*</param-value>
</init-param>
 </filter>
 <filter-mapping>
<filter-name>CORS</filter-name>
<url-pattern>/*</url-pattern>
 </filter-mapping>

如果為filter配置了cors.supportedHeaders參數，axis-1.4版本下值必須包含SOAPAction, 同時ajax請求頭中也必須要有SOAPAction：

 <init-param>
  <param-name>cors.supportedHeaders</param-name>
  <param-value>Accept, Origin, Content-Type, SOAPAction</param-value>
</init-param>

需要導入CORS-Filter.jar和java-property-utils.jar這兩個jar包

選中剛剛創建的Web項目，新建web Service 項目：
- start Server成功之後點擊finish，一個webService接口創建成功且已發佈。現在在項目根目錄會有一個wsdl文件夾可以找到一個HellService.wsdl文件，這個文件就是wevservice接口的描述文件。這個文件中<wsdlsoap:address>標籤下location的值就是我們本次發佈的服務對外暴露的地址；
  
  在這個地址後加?wsdl，瀏覽器中訪問既可以查看到該文件。説明我們的服務發佈成功。

跨域請求

任意位置創建一個index.html，用jquery ajax的方式去訪問剛剛暴露的那個接口

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Insert title here</title>
<script type="text/javascript" src="jquery-3.3.1.min.js"></script>
<script type="text/javascript">
    function test() {
        var paramsXml = '<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:q0="http://test.dgq.com" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:xsi="http://www.w3.org/2001/XMLSchemainstance"> <soapenv:Body> <q0:say>  <q0:name>we</q0:name>   </q0:say>  </soapenv:Body>  </soapenv:Envelope>';
        $.ajax({
            url : "http://localhost:8080/WebSeviceTest/services/HelloService",
            type : "POST",
            dataType : "XML",
            contentType : "text/xml; charset=UTF-8",
            data : paramsXml,
            crossDomain: true,
            beforeSend: function (XMLHttpRequest) {
                 XMLHttpRequest.setRequestHeader("SOAPAction", "");
             },
            success : function(data) {
                console.log(data);
            },
            error : function(data) {
                console.log(data);
            }
        });
    }
</script>
</head>
<body>
<input type="button"  onclick="test()" value ="發送請求">
</body>
</html>

contenType必須是text/xml
crossDomain: true,jqueryajax的跨域配置
beforeSend 設置SOAPAction請求頭，這是axis1.x版本的問題，要求必須要有SOAPAction請求頭，即使值是空串，否則後台會報no SOAPAction header
data : paramsXml 這是重點，paramsXml就是我們本次訪問的核心，paramsXml中不僅有我們向後傳遞的參數也有我們要訪問後台方法的描述，paramsXml的值可以在Eclipse中右鍵點擊wsdl文件在web Services小menu中找到test with web Service Explorer選項打開Web Services Explorer: 找到

idgq 博客

idgq 博客

博客 / 詳情