Najprostszy przykład mydła

Istnieje wiele dziwactw w sposobie, w jaki przeglądarki obsługują XMLHttpRequest, ten kod JS będzie działał we wszystkich przeglądarkach:
https://github.com/ilinsky/xmlhttprequest

Ten kod JS konwertuje XML do łatwych w użyciu obiektów JavaScript:
http://www.terracoder.com/index.php/xml-objectifier

Powyższy kod JS może zostać dołączony do strony, aby spełnić twoje wymagania dotyczące zewnętrznych bibliotek.

var symbol = "MSFT"; 
var xmlhttp = new XMLHttpRequest();
xmlhttp.open("POST", "http://www.webservicex.net/stockquote.asmx?op=GetQuote",true);
xmlhttp.onreadystatechange=function() {
 if (xmlhttp.readyState == 4) {
  alert(xmlhttp.responseText);
  // http://www.terracoder.com convert XML to JSON 
  var json = XMLObjectifier.xmlToJSON(xmlhttp.responseXML);
  var result = json.Body[0].GetQuoteResponse[0].GetQuoteResult[0].Text;
  // Result text is escaped XML string, convert string to XML object then convert to JSON object
  json = XMLObjectifier.xmlToJSON(XMLObjectifier.textToXML(result));
  alert(symbol + ' Stock Quote: $' + json.Stock[0].Last[0].Text); 
 }
}
xmlhttp.setRequestHeader("SOAPAction", "http://www.webserviceX.NET/GetQuote");
xmlhttp.setRequestHeader("Content-Type", "text/xml");
var xml = '<?xml version="1.0" encoding="utf-8"?>' +
 '<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" ' +
                'xmlns:xsd="http://www.w3.org/2001/XMLSchema" ' +
                'xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">' + 
   '<soap:Body> ' +
     '<GetQuote xmlns="http://www.webserviceX.NET/"> ' +
       '<symbol>' + symbol + '</symbol> ' +
     '</GetQuote> ' +
   '</soap:Body> ' +
 '</soap:Envelope>';
xmlhttp.send(xml);
// ...Include Google and Terracoder JS code here...

Dwie inne opcje:

• JavaScript SOAP Klient:
  http://www.guru4.net/articoli/javascript-soap-client/en/

• Generowanie JavaScript z WSDL:
  https://cwiki.apache.org/confluence/display/CXF20DOC/WSDL+to+Javascript

nie można tego zrobić za pomocą prostego JavaScript, chyba że usługa internetowa jest w tej samej domenie co strona. Edit: w 2008 i w IE

Jeśli usługa internetowa jest na innej domenie [i musisz obsługiwać IE

Jeśli serwis internetowy jest na Twojej własnej domenie, nie używaj SOAP. Nie ma ku temu powodu. Jeśli usługa internetowa jest na własnej domenie, zmodyfikuj ją tak, aby mogła zwrócić JSON i zaoszczędzić sobie kłopotów z radzeniem sobie ze wszystkimi kłopotami, które pochodzą z SOAP.

Krótka odpowiedź brzmi: nie rób Żądania SOAP z javascript. Użyj usługi internetowej, aby zażądać danych z innej domeny, a jeśli to zrobisz, przeanalizuj wyniki po stronie serwera i zwróć je w formie przyjaznej dla js.

Możesz użyć jquery.wtyczka soap do wykonania pracy za Ciebie.

Ten skrypt używa $.ajax do wysłania Mydelniczki. Może przyjmować XML DOM, XML string lub JSON jako wejście, a odpowiedź może być zwrócona jako XML DOM, XML string lub JSON.

Przykładowe użycie ze strony:

$.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
    }
});

Tomasz:

JSON jest preferowany do użytku front-end, ponieważ jest javascript. Dlatego nie masz XML do czynienia z. Mydło to ból bez korzystania z biblioteki z tego powodu. Ktoś wspomniał o SOAPClient, która jest dobrą biblioteką, zaczęliśmy od niej dla naszego projektu. Jednak miał pewne ograniczenia i musieliśmy przepisać duże fragmenty. Został wydany jako SOAPjs i obsługuje przekazywanie złożonych obiektów do serwera i zawiera przykładowy kod proxy do korzystania z usług z innych domen.

Czy ktoś tego próbował? https://github.com/doedje/jquery.soap

Przykład:

$.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
}
});

Spowoduje

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

<html>
 <head>
    <title>Calling Web Service from jQuery</title>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            $("#btnCallWebService").click(function (event) {
                var wsUrl = "http://abc.com/services/soap/server1.php";
                var soapRequest ='<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">   <soap:Body> <getQuote xmlns:impl="http://abc.com/services/soap/server1.php">  <symbol>' + $("#txtName").val() + '</symbol>   </getQuote> </soap:Body></soap:Envelope>';
                               alert(soapRequest)
                $.ajax({
                    type: "POST",
                    url: wsUrl,
                    contentType: "text/xml",
                    dataType: "xml",
                    data: soapRequest,
                    success: processSuccess,
                    error: processError
                });

            });
        });

        function processSuccess(data, status, req) { alert('success');
            if (status == "success")
                $("#response").text($(req.responseXML).find("Result").text());

                alert(req.responseXML);
        }

        function processError(data, status, req) {
        alert('err'+data.state);
            //alert(req.responseText + " " + status);
        } 

    </script>
</head>
<body>
    <h3>
        Calling Web Services with jQuery/AJAX
    </h3>
    Enter your name:
    <input id="txtName" type="text" />
    <input id="btnCallWebService" value="Call web service" type="button" />
    <div id="response" ></div>
</body>
</html>

Hear jest najlepszym JavaScript z soap tutorial z przykładem.

Http://www.codeproject.com/Articles/12816/JavaScript-SOAP-Client

Kilka świetnych przykładów(i gotowy Klient JavaScript SOAP!) tutaj: http://plugins.jquery.com/soap/

Sprawdź readme i uważaj na ograniczenia przeglądarki tego samego pochodzenia.

Łatwe korzystanie z usług internetowych SOAP za pomocą JavaScript -> Listing B

function fncAddTwoIntegers(a, b)
{
    varoXmlHttp = new XMLHttpRequest();
    oXmlHttp.open("POST",
 "http://localhost/Develop.NET/Home.Develop.WebServices/SimpleService.asmx'",
 false);
    oXmlHttp.setRequestHeader("Content-Type", "text/xml");
    oXmlHttp.setRequestHeader("SOAPAction", "http://tempuri.org/AddTwoIntegers");
    oXmlHttp.send(" \
<soap:Envelope xmlns:xsi='http://www.w3.org/2001/XMLSchema-instance' \
xmlns:xsd='http://www.w3.org/2001/XMLSchema' \
 xmlns:soap='http://schemas.xmlsoap.org/soap/envelope/'> \
  <soap:Body> \
    <AddTwoIntegers xmlns='http://tempuri.org/'> \
      <IntegerOne>" + a + "</IntegerOne> \
      <IntegerTwo>" + b + "</IntegerTwo> \
    </AddTwoIntegers> \
  </soap:Body> \
</soap:Envelope> \
");
    return oXmlHttp.responseXML.selectSingleNode("//AddTwoIntegersResult").text;
}

Może to nie spełnia wszystkich twoich wymagań, ale jest to początek rzeczywistej odpowiedzi na twoje pytanie. (Zamieniłem XMLHttpRequest()na ActiveXObject("MSXML2.XMLHTTP") ).

Najprostszy przykład składa się z:

1. uzyskiwanie danych wejściowych użytkownika.

2. Composing XML SOAP message similar to this

   <soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
                  xmlns:xsd="http://www.w3.org/2001/XMLSchema"
                  xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">
     <soap:Body>
       <GetInfoByZIP xmlns="http://www.webserviceX.NET">
         <USZip>string</USZip>
       </GetInfoByZIP>
     </soap:Body>
   </soap:Envelope>
   

3. Wysyłanie wiadomości do adresu URL webservice przy użyciu XHR

4. Analizowanie odpowiedzi XML SOAP webservice podobnej do tej

   <soap:Envelope xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/"
                  xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
                  xmlns:xsd="http://www.w3.org/2001/XMLSchema">
    <soap:Body>
     <GetInfoByZIPResponse xmlns="http://www.webserviceX.NET">
      <GetInfoByZIPResult>
       <NewDataSet xmlns="">
        <Table>
         <CITY>...</CITY>
         <STATE>...</STATE>
         <ZIP>...</ZIP>
         <AREA_CODE>...</AREA_CODE>
         <TIME_ZONE>...</TIME_ZONE>
        </Table>
       </NewDataSet>
      </GetInfoByZIPResult>
     </GetInfoByZIPResponse>
    </soap:Body>
   </soap:Envelope>
   

5. Prezentowanie wyników użytkownikowi.

Ale to dużo kłopotów bez zewnętrznych bibliotek JavaScript.

function SoapQuery(){
  var namespace = "http://tempuri.org/";
  var site = "http://server.com/Service.asmx";
  var xmlhttp = new ActiveXObject("Msxml2.ServerXMLHTTP.6.0");
  xmlhttp.setOption(2,  13056 );  /* if use standard proxy */
  var args,fname =  arguments.callee.caller.toString().match(/ ([^\(]+)/)[1]; /*Имя вызвавшей ф-ции*/
  try { args =   arguments.callee.caller.arguments.callee.toString().match(/\(([^\)]+)/)[1].split(",");  
    } catch (e) { args = Array();};
  xmlhttp.open('POST',site,true);  
  var i, ret = "", q = '<?xml version="1.0" encoding="utf-8"?>'+
   '<soap:Envelope xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xmlns:xsd="http://www.w3.org/2001/XMLSchema" xmlns:soap="http://schemas.xmlsoap.org/soap/envelope/">'+
   '<soap:Body><'+fname+ ' xmlns="'+namespace+'">';
  for (i=0;i<args.length;i++) q += "<" + args[i] + ">" + arguments.callee.caller.arguments[i] +  "</" + args[i] + ">";
  q +=   '</'+fname+'></soap:Body></soap:Envelope>';
            // Send the POST request
            xmlhttp.setRequestHeader("MessageType","CALL");
            xmlhttp.setRequestHeader("SOAPAction",namespace + fname);
            xmlhttp.setRequestHeader('Content-Type', 'text/xml');
            //WScript.Echo("Запрос XML:" + q);
            xmlhttp.send(q);
     if  (xmlhttp.waitForResponse(5000)) ret = xmlhttp.responseText;
    return ret;
  };





function GetForm(prefix,post_vars){return SoapQuery();};
function SendOrder2(guid,order,fio,phone,mail){return SoapQuery();};

function SendOrder(guid,post_vars){return SoapQuery();};

Angularjs $http wrap base on XMLHttpRequest . Tak długo, jak w treści nagłówka ustawiony będzie następujący kod.

"Content-Type": "text/xml; charset=utf-8"

Na przykład:

function callSoap(){
var url = "http://www.webservicex.com/stockquote.asmx";
var soapXml = "<soapenv:Envelope xmlns:soapenv=\"http://schemas.xmlsoap.org/soap/envelope/\" xmlns:web=\"http://www.webserviceX.NET/\"> "+
         "<soapenv:Header/> "+
         "<soapenv:Body> "+
         "<web:GetQuote> "+
         "<web:symbol></web:symbol> "+
         "</web:GetQuote> "+
         "</soapenv:Body> "+
         "</soapenv:Envelope> ";

    return $http({
          url: url,  
          method: "POST",  
          data: soapXml,  
          headers: {  
              "Content-Type": "text/xml; charset=utf-8"
          }  
      })
      .then(callSoapComplete)
      .catch(function(message){
         return message;
      });

    function callSoapComplete(data, status, headers, config) {
        // Convert to JSON Ojbect from xml
        // var x2js = new X2JS();
        // var str2json = x2js.xml_str2json(data.data);
        // return str2json;
        return data.data;

    }

}

Pytanie brzmi: "jaki jest najprostszy przykład SOAP przy użyciu Javascript?'

Ta odpowiedź jest przykładem w węźle .środowisko js , a nie przeglądarka. (Nazwijmy skrypt soap-node.js) i użyjemy publicznego serwisu internetowego SOAP z Europy PMC jako przykład, aby uzyskać listę referencyjną artykułu.

const XMLHttpRequest = require("xmlhttprequest").XMLHttpRequest;
const DOMParser = require('xmldom').DOMParser;

function parseXml(text) {
    let parser = new DOMParser();
    let xmlDoc = parser.parseFromString(text, "text/xml");
    Array.from(xmlDoc.getElementsByTagName("reference")).forEach(function (item) {
        console.log('Title: ', item.childNodes[3].childNodes[0].nodeValue);
    });

}

function soapRequest(url, payload) {
    let xmlhttp = new XMLHttpRequest();
    xmlhttp.open('POST', url, true);

    // build SOAP request
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4) {
            if (xmlhttp.status == 200) {
                parseXml(xmlhttp.responseText);
            }
        }
    }

    // Send the POST request
    xmlhttp.setRequestHeader('Content-Type', 'text/xml');
    xmlhttp.send(payload);
}

soapRequest('https://www.ebi.ac.uk/europepmc/webservices/soap', 
    `<?xml version="1.0" encoding="UTF-8"?>
    <S:Envelope xmlns:S="http://schemas.xmlsoap.org/soap/envelope/">
    <S:Header />
    <S:Body>
        <ns4:getReferences xmlns:ns4="http://webservice.cdb.ebi.ac.uk/"
            xmlns:ns2="http://www.scholix.org"
            xmlns:ns3="https://www.europepmc.org/data">
            <id>C7886</id>
            <source>CTX</source>
            <offSet>0</offSet>
            <pageSize>25</pageSize>
            <email>[email protected]</email>
        </ns4:getReferences>
    </S:Body>
    </S:Envelope>`);

Przed uruchomieniem kodu należy zainstalować dwa pakiety:

npm install xmlhttprequest
npm install xmldom

Teraz możesz uruchomić kod:

node soap-node.js

I zobaczysz wyjście jak poniżej:

Title:  Perspective: Sustaining the big-data ecosystem.
Title:  Making proteomics data accessible and reusable: current state of proteomics databases and repositories.
Title:  ProteomeXchange provides globally coordinated proteomics data submission and dissemination.
Title:  Toward effective software solutions for big biology.
Title:  The NIH Big Data to Knowledge (BD2K) initiative.
Title:  Database resources of the National Center for Biotechnology Information.
Title:  Europe PMC: a full-text literature database for the life sciences and platform for innovation.
Title:  Bio-ontologies-fast and furious.
Title:  BioPortal: ontologies and integrated data resources at the click of a mouse.
Title:  PubMed related articles: a probabilistic topic-based model for content similarity.
Title:  High-Impact Articles-Citations, Downloads, and Altmetric Score.