Javascript를 사용하는 가장 간단한 SOAP 예제는 무엇입니까?
최대한 유용한 답변을 얻으려면 :
- 기능적 (즉, 실제로 작동)
- 코드의 다른 곳에서 설정할 수있는 하나 이상의 매개 변수를 보냅니다.
- 코드의 다른 곳에서 읽을 수있는 하나 이상의 결과 값 처리
- 최신 브라우저 버전으로 작업
- 외부 라이브러리를 사용하지 않고 최대한 명확하고 짧게 작성하십시오
Javascript를 사용하는 가장 간단한 SOAP 예제는 무엇입니까?
최대한 유용한 답변을 얻으려면 :
답변:
이것은 내가 만들 수있는 가장 간단한 JavaScript SOAP 클라이언트입니다.
<html>
<head>
<title>SOAP JavaScript Client Test</title>
<script type="text/javascript">
function soap() {
var xmlhttp = new XMLHttpRequest();
xmlhttp.open('POST', 'https://somesoapurl.com/', true);
// build SOAP request
var sr =
'<?xml version="1.0" encoding="utf-8"?>' +
'<soapenv:Envelope ' +
'xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" ' +
'xmlns:api="http://127.0.0.1/Integrics/Enswitch/API" ' +
'xmlns:xsd="http://www.w3.org/2001/XMLSchema" ' +
'xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/">' +
'<soapenv:Body>' +
'<api:some_api_call soapenv:encodingStyle="http://schemas.xmlsoap.org/soap/encoding/">' +
'<username xsi:type="xsd:string">login_username</username>' +
'<password xsi:type="xsd:string">password</password>' +
'</api:some_api_call>' +
'</soapenv:Body>' +
'</soapenv:Envelope>';
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4) {
if (xmlhttp.status == 200) {
alert(xmlhttp.responseText);
// alert('done. use firebug/console to see network response');
}
}
}
// Send the POST request
xmlhttp.setRequestHeader('Content-Type', 'text/xml');
xmlhttp.send(sr);
// send request
// ...
}
</script>
</head>
<body>
<form name="Demo" action="" method="post">
<div>
<input type="button" value="Soap" onclick="soap();" />
</div>
</form>
</body>
</html> <!-- typo -->
xmlhttp.setRequestHeader('SOAPAction', 'http://myurl.com/action');
하기 직전에 추가 xmlhttp.send(sr)
하십시오.
브라우저가 XMLHttpRequest를 처리하는 방식에는 많은 단점이 있습니다.이 JS 코드는 모든 브라우저에서 작동합니다 :
https://github.com/ilinsky/xmlhttprequest
이 JS 코드는 XML을 사용하기 쉬운 JavaScript 객체로 변환합니다 :
http://www.terracoder.com/index.php/xml-objectifier
외부 라이브러리 요구 사항을 충족하지 않기 위해 위의 JS 코드를 페이지에 포함시킬 수 있습니다.
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...
다른 두 가지 옵션 :
자바 스크립트 SOAP 클라이언트 :
http://www.guru4.net/articoli/javascript-soap-client/en/
WSDL에서 JavaScript를 생성하십시오.
https://cwiki.apache.org/confluence/display/CXF20DOC/WSDL+to+Javascript
웹 서비스가 페이지와 동일한 도메인에 있지 않으면 JavaScript를 사용하여 수행 할 수 없습니다. 편집 : 2008 년 및 IE <10에서는 서비스가 페이지와 동일한 도메인에 있지 않으면 Javascript로 수행 할 수 없습니다.
웹 서비스가 다른 도메인에 있고 IE <10을 지원해야하는 경우 결과를 검색하여 사용자에게 반환하는 자체 도메인의 프록시 페이지를 사용해야합니다. 이전 IE 지원이 필요하지 않은 경우 서비스에 CORS 지원을 추가해야합니다. 두 경우 모두 결과를 직접 구문 분석하지 않아도되므로 timyates가 제안한 lib와 같은 것을 사용해야합니다.
웹 서비스가 자신의 도메인에있는 경우 SOAP를 사용하지 마십시오. 그렇게 할 이유가 없습니다. 웹 서비스가 자신의 도메인에있는 경우 JSON을 반환하고 SOAP와 함께 제공되는 모든 번거 로움을 덜어 줄 수 있도록 수정하십시오.
짧은 대답은 : 자바 스크립트에서 SOAP 요청을하지 마십시오. 웹 서비스를 사용하여 다른 도메인에서 데이터를 요청하고, 그렇게하면 서버 측에서 결과를 구문 분석하여 js 친화적 인 형식으로 리턴하십시오.
XMLHttpRequest
아마도 jquery와 같은 라이브러리를 통해 사용할 수 있습니다 . 노드 클라이언트는 다른 것을 사용할 것입니다. 대부분의 웹 서비스는 REST를 API 디자인을위한 안내서로 사용하지만 좋은 패턴이 많이 있습니다. 여기서 핵심은 자바 스크립트 클라이언트 (브라우저 / 노드 / 어디서나)가 기본적으로 JSON을 이해하기 때문에 요청 / 응답 본문이 JSON이라는 것입니다.
jquery.soap 플러그인 을 사용하여 작업을 수행 할 수 있습니다.
이 스크립트는 $ .ajax를 사용하여 SOAPEnvelope를 보냅니다. XML DOM, XML 문자열 또는 JSON을 입력으로 사용할 수 있으며 응답은 XML DOM, XML 문자열 또는 JSON으로 리턴 될 수 있습니다.
사이트에서의 사용 예 :
$.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
}
});
도마:
JSON은 자바 스크립트이므로 프런트 엔드 사용에 선호됩니다. 따라서 처리 할 XML이 없습니다. SOAP는이 때문에 라이브러리를 사용하지 않으면 고통입니다. 누군가 좋은 라이브러리 인 SOAPClient를 언급했는데 프로젝트를 위해 시작했습니다. 그러나 그것은 약간의 한계가 있었고 우리는 그것의 큰 덩어리를 다시 써야했습니다. SOAPjs 로 출시되었으며 복잡한 개체를 서버로 전달하는 기능을 지원하며 다른 도메인의 서비스를 사용하기위한 샘플 프록시 코드도 포함되어 있습니다.
누구든지 이것을 시도 했습니까? 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>
<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>
듣기는 SOAP 자습서가 포함 된 최고의 JavaScript입니다.
http://www.codeproject.com/Articles/12816/JavaScript-SOAP-Client
몇 가지 훌륭한 예 (및 기성품 JavaScript SOAP 클라이언트!) : http://plugins.jquery.com/soap/
읽어보기를 확인하고 동일한 출처 브라우저 제한 사항에 유의하십시오.
JavaScript- > Listing B를 사용하여 SOAP 웹 서비스를 쉽게 소비
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;
}
이것은 귀하의 모든 요구 사항을 충족 시키지는 못하지만 실제로 귀하의 질문에 대답하기 시작합니다. ActiveXObject ( "MSXML2.XMLHTTP")에 대해 XMLHttpRequest () 를 전환했습니다 .
가장 간단한 예는 다음으로 구성됩니다.
이와 유사한 XML SOAP 메시지 작성
<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>
XHR을 사용하여 웹 서비스 URL에 메시지 게시
이와 비슷한 웹 서비스의 XML SOAP 응답 파싱
<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>
사용자에게 결과를 제시합니다.
그러나 외부 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는 XMLHttpRequest를 기반으로 합니다. 헤더 내용 세트에서 다음 코드가 수행하는 한.
"Content-Type": "text/xml; charset=utf-8"
예를 들면 다음과 같습니다.
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;
}
}
문제는 'Javascript를 사용하는 가장 간단한 SOAP 예제는 무엇입니까?'입니다.
이 답변은 브라우저가 아닌 Node.js 환경 의 예입니다 . (스크립트의 이름을 soap-node.js로 지정합니다.) 유럽 PMC의 공개 SOAP 웹 서비스를 예로 사용하여 기사의 참조 목록을 가져옵니다.
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>ukpmc-phase3-wp2b---do-not-reply@europepmc.org</email>
</ns4:getReferences>
</S:Body>
</S:Envelope>`);
코드를 실행하기 전에 다음 두 패키지를 설치해야합니다.
npm install xmlhttprequest
npm install xmldom
이제 코드를 실행할 수 있습니다 :
node soap-node.js
다음과 같이 출력이 표시됩니다.
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.