如何从 Javascript/jQuery 调用 SOAP WS答案

【问题标题】：How to call SOAP WS from Javascript/jQuery如何从 Javascript/jQuery 调用 SOAP WS
【发布时间】：2012-10-09 09:31:54
【问题描述】：

我想直接从 Javascript 调用 SOAP WebService。我一直在环顾四周，但仍然无法正常工作。我假设我必须构建 SOAP 信封（见下文）。我也使用 jQuery。

首先，我确定我可以调用位于其他地方的 SOAP Webservice 吗？也就是说没有跨域限制。

我也不确定我需要使用什么正确的 URL，SOAP 服务是使用 Ladon 公开的，出于调试目的，我检查了 WS 是否与soapUI 配合良好，这里是我可以找到的 URL ：

WSDL URL : http://192.168.1.5/ws/MyWS/soap/description // 据我了解不可能是这个
服务端点：http://192.168.1.5/ws/MyWS/soap
SOAPAction：http://192.168.1.5/ws/MyWS/soap/myOperation

我认为我应该使用端点或 SOAPAction，但它不起作用。我可能会在这里遗漏一些东西，或者后来的 Javascript 有缺陷，我无法确定。

现在这是我实际调用的 JS（cmets 内部有一些问题）：

<html>
<meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
<head>

<script type="text/javascript" src="ressources/jquery-1.7.1.min.js"></script>

<script type="text/javascript">

// inspired by http://openlandscape.net/2009/09/25/call-soap-xm-web-services-with-jquery-ajax/

var soapServiceURL = 'http://192.168.1.5/ws/MyWS/soap/myOperation; // not sure what to put here from a LADON point of view

function callSOAPWS(myParameter)
{
  var soapMessage =
  '<soapenv:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:urn="urn:LDetector"> \
     <soapenv:Header/> \
     <soapenv:Body> \
        <urn:myOperation soapenv:encodingStyle="http://schemas.xmlsoap.org/soap/encoding/"> \
           <myParameter xsi:type="xsd:string">' + myParameter + '</myParameter > \
        </urn:myOperation > \
     </soapenv:Body> \
  </soapenv:Envelope>';

  alert("Check SOAP: [" + soapMessage + "]");

  jQuery.ajax({
          url: soapServiceURL,
          type: "POST",
          dataType: "xml",
          data: soapMessage,
          contentType: "text/xml; charset=\"utf-8\"",

          //processData: false,   // what is it for? may be should be true when using 'complete:' ?
          //timeout: 5000,

          // below I first try to have only 'complete:' then I tried to have 'success:' + 'error:', then the 3. Nothing seems to be ok. I do not find which one i should use.
          complete: myCallback,

          success: function( response ){
              document.getElementById('debug').innerHTML = document.getElementById('debug').innerHTML + '\n' + 'success!' + '\n';
              alert("success!!!");
          },

          error: function(XMLHttpRequest,textStatus, errorThrown){
              document.getElementById('debug').innerHTML = document.getElementById('debug').innerHTML + '\n' + 'error : ' + textStatus + '\n';
              alert("error : " + textStatus);
          }

  });

  alert('if we reach this line, is it a fail?!');
  return false;
}

function myCallback(xmlHttpRequest, status)
{
  jQuery(xmlHttpRequest.responseXML)
      .find('detected')
      .each(function()
   {
     var result = jQuery(this).find('result').text();
     document.getElementById('debug').innerHTML = document.getElementById('debug').innerHTML + '\n' + result + '\n';
     alert('ok : [' + result + ']');
   });
}

// https://stackoverflow.com/questions/11916780/changing-getjson-to-jsonp?rq=1

jQuery(document).ready(function() {
    callSOAPWS('this is a test');
});

</script>
</head>
<body>

<div id="debug" style="background-color:#EEEEEE; height:250px; width:600px; overflow:auto;">&nbsp;</div>

</body>
</html>

最好的问候

编辑： 在继续尝试搜索答案时，我读到 => Simplest SOAP example Prestaul 说“这不能用直接的 JavaScript 完成，除非 Web 服务在同一个域上作为你的页面。”所以，也许我正在尝试做一些不可能的事情？是它不能工作的原因吗？

【问题讨论】：

标签： javascript jquery soap

【解决方案1】：

由于浏览器内置的same origin policy 限制，您无法发送跨域 AJAX 请求。为了完成这项工作，您的包含 jQuery 代码的 HTML 页面必须与 Web 服务 (http://192.168.1.5/ws/MyWS/) 托管在同一域中。

有一些解决方法涉及在服务器上使用 JSONP，但由于您的 Web 服务是 SOAP，因此无法正常工作。

如果您无法将 javascript 移动到与 Web 服务相同的域中，唯一可靠的方法是构建一个服务器端脚本，该脚本将托管在与 javascript 代码相同的域中，并充当2个域之间的桥梁。因此，您将向服务器端脚本发送 AJAX 请求，该脚本将调用远程 Web 服务并返回结果。

【讨论】：

谢谢，所以我错误地认为将 SOAP 与完整的 JS 客户端一起使用是一种解决方法。是的，我已经测试了我上面放置的代码，它在同一台服务器上使用时有效。顺便说一句，我还需要其他服务器能够这样做......我会看看你建议的方式。

【解决方案2】：

这个怎么样？ https://github.com/doedje/jquery.soap

看起来很简单。也许对你有帮助。

例子：

$.soap({
url: 'http://my.server.com/soapservices/',
method: 'helloWorld',

data: {
    name: 'Remy Blom',
    msg: 'Hi!'
},

success: function (soapResponse) {
    // do stuff with soapResponse
    // if you want to have the response as JSON use soapResponse.toJSON();
    // or soapResponse.toString() to get XML string
    // or soapResponse.toXML() to get XML DOM
},
error: function (SOAPResponse) {
    // show error
}
});

会导致

<soap:Envelope
xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
  <soap:Body>
    <helloWorld>
        <name>Remy Blom</name>
        <msg>Hi!</msg>
    </helloWorld>
  </soap:Body>
</soap:Envelope>

【讨论】：

【解决方案3】：

下面的代码工作正常。可能对你有帮助。

    var SoaMessage = '<soapenv:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" >'
                + '<soapenv:Header/>'
                  + '<soapenv:Body>'
                    + '<myoperation soapenv:encodingStyle="http://schemas.xmlsoap.org/soap/encoding/" xmlns="http://MyService/"> '
                     + ' <AgencyId xsi:type="xsd:string">ADBC</AgencyId >'
                  + '</myoperation >'
                 + '</soapenv:Body>'
             + '</soapenv:Envelope>';
    var url = "http://XXXXXXX/XXX/XXXXX?wsdl";
    $.support.cors = true;
    $.ajax({
        type: "POST",
        url: url,
        jsonpCallback: "MyCallbackDED",
        dataType: "xml",
        processData: false,
        contentType: "text/xml; charset=\"utf-8\"",
        success: function (msg) {
            alert("suc: " + msg.tradeLicenseData.master[0].arabicAddress + ": " + msg.tradeLicenseData.master[0].arabicAddress);

        },
        error: function (msg) {
            alert("Failed: " + msg.status + ": " + msg.statusText);
        }

    });

【讨论】：