1. 程式人生 > >ajax呼叫cxf webservice介面和跨域

ajax呼叫cxf webservice介面和跨域

1.配置webservice

(可以參考部落格上cxf  webservice的配置http://blog.csdn.net/zhshchilss/article/details/43763271)

按照上述配置,就可以使用java客戶端呼叫介面了

ajax的呼叫

1.額外的配置

新增兩個jar包:cors-filter-1.7.jar,java-property-utils-1.9.jar

web.xml新增filter:

<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>  
    <init-param>  
     <param-name>cors.supportedMethods</param-name>  
        <param-value>GET, POST, HEAD, PUT, DELETE</param-value>  
    </init-param>  
    <init-param>  
     <param-name>cors.supportedHeaders</param-name>  
        <param-value>Accept, Origin, X-Requested-With, Content-Type, Last-Modified</param-value>  
    </init-param>  
    <init-param>  
        <param-name>cors.exposedHeaders</param-name>  
        <param-value>Set-Cookie</param-value>  
    </init-param>  
    <init-param>  
        <param-name>cors.supportsCredentials</param-name>  
        <param-value>true</param-value>  
    </init-param>  
</filter>  
<filter-mapping>  
    <filter-name>CORS</filter-name>  
    <url-pattern>/*</url-pattern>  
</filter-mapping>

上述配置是解決跨域問題的

後臺webservice介面

@WebService
public class Hello implements IHello{
    
    public String sayHello(@WebParam(name="name") String name){
        return  "hello: " + name;
    }


public List<Object> sayList() {
Person p = new Person();
p.setName("劉胡蘭");
p.setAge(22);
List<Object> list = new ArrayList<Object>();
list.add("2") ;
list.add("你好");
list.add(p);
// TODO Auto-generated method stub
return list;
}

/**
* 不知道怎麼傳物件
*/
public Person sayMap(String id , Person person ) {
Person p = new Person();
p.setName("劉胡蘭");
p.setAge(22);
// TODO Auto-generated method stub
return p;
}




    public String findData(String type) {
    JSONObject obj = new JSONObject() ;
    if(type.equals("string")){
    obj.put("data", sayHello("劉德華")) ;
    }else if(type.equals("map")){
    obj.put("data", sayMap(null, null)) ;
    }else if(type.equals("list")){
    obj.put("data", sayList()) ;
    }
    return obj.toJSONString() ;
}



ajax呼叫程式碼:

//ajax的各個屬性,也可以換一下,看看都報什麼問題

$.ajax({

//type必須get
    type: 'get',
//contentType: 'application/json',

//這個路徑,webs是工程名,IService是在beans.xml配置的介面Hello的路徑,findData是Hello裡的方法,方法不用配置,呼叫哪個直接/方法名就可以
    url: 'http://*.*.*.*:8080/webs/IService/findData',

//引數名必須arg0
    data:{arg0:'list'},

//返回必須xml
    dataType: 'xml',
    success: function(result) {
var nodes = result.getElementsByTagName("return") ;
var value = nodes[0].firstChild.nodeValue ;
alert(value);
    },
    error: function(result, status) {
        alert('error='+status);
    }
});

期間遇到的問題:

1.ajax使用get之外的呼叫方式,後臺報錯(網上沒找到解決辦法)

2.後臺的入參如public Person sayMap(String id , Person person ) ,

ajax如果傳資料啊{id:1},後臺報錯。傳  data:{arg0:'list'},後臺就可以接到。

但是如果多個引數,第二個之後的還沒找到傳參欄位是啥

3.dataType需要是xml,因為返回的資料是xml格式的東西

4.success裡面解析資料,得到返回的return

其中,接口裡面的四個方法

返回string的介面,ajax接的的資料為:

<soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
<soap:Body>
<ns2:sayHelloResponse xmlns:ns2="http://test.zhshch.com.webs/">
<return>hello: null</return>
</ns2:sayHelloResponse>
</soap:Body>
</soap:Envelope>

返回list的介面,ajax返回資料為:

<soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
<soap:Body>
<ns2:sayListResponse xmlns:ns2="http://test.zhshch.com.webs/">
<return xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xs="http://www.w3.org/2001/XMLSchema" xsi:type="xs:string">2</return>
<return xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xs="http://www.w3.org/2001/XMLSchema" xsi:type="xs:string">你好</return>
<return xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:type="ns2:person">
<age>22</age>
<name>劉胡蘭</name>
</return>
</ns2:sayListResponse>
</soap:Body>
</soap:Envelope>

返回vo的介面,ajax返回資料位:

<soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
<soap:Body>
<ns2:sayMapResponse xmlns:ns2="http://test.zhshch.com.webs/">
<return>
<age>22</age>
<name>劉胡蘭</name>
</return>
</ns2:sayMapResponse>
</soap:Body>
</soap:Envelope>

如上三中,如果解析return的資料,不容易分辨解析vo,list,string

所以這裡對於ajax呼叫的介面,後臺一律定義為


    public String findData(String type) {
    JSONObject obj = new JSONObject() ;

//測試各種情況
    if(type.equals("string")){
    obj.put("data", sayHello("劉德華")) ;
    }else if(type.equals("map")){
    obj.put("data", sayMap(null, null)) ;
    }else if(type.equals("list")){
    obj.put("data", sayList()) ;
    }
    return obj.toJSONString() ;
}

一個入參,字串或json字串

所有返回,都返回json字串

然後前臺的接到的資料為:


json
 string
 
 <soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
<soap:Body>
<ns2:findDataResponse xmlns:ns2="http://test.zhshch.com.webs/">
<return>{"data":"hello: 劉德華"}</return>
</ns2:findDataResponse>
</soap:Body>
</soap:Envelope>


vo:


<soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
<soap:Body>
<ns2:findDataResponse xmlns:ns2="http://test.zhshch.com.webs/">
<return>{"data":{"age":22,"name":"劉胡蘭"}}</return>
</ns2:findDataResponse>
</soap:Body>
</soap:Envelope>


list


<soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
<soap:Body>
<ns2:findDataResponse xmlns:ns2="http://test.zhshch.com.webs/">
<return>{"data":["2","你好",{"age":22,"name":"劉胡蘭"}]}</return>
</ns2:findDataResponse>
</soap:Body>
</soap:Envelope>

通過解析得到json字串

success: function(result) {
var nodes = result.getElementsByTagName("return") ;
var value = nodes[0].firstChild.nodeValue ;

//value的資料結構{data:****} ;
alert(value);

//然後把value轉成json物件,json.data就是後臺傳過來的vo,list,字串等
    },

這是ajax呼叫webservice的例子

網上找了很多其他的例子,但是在本地都一直報錯。

這裡是我本地可以使用的例子