AngularJS - Angular와 SOAP 서비스 통합JS 모델
저는 AngularJS를 배우고 있는 숙련된 Flex Developer입니다.이거 진짜 헷갈리네요!!!
어쨌든 SOAP WSDL Request를 통해 백엔드(동일한 도메인) 서버에 서비스 호출을 하고 Angular로 데이터를 채우려고 합니다.JS 모델 개체입니다.나는 Ajax를 시도하고 있었지만 실제 데이터를 되찾는 데 문제가 있었습니다.SOAP 태그를 생성한 방식에 문제가 있는 것 같습니다.저는 성공적인 답변을 받고 있었지만, 데이터가 없었습니다.
Ajax 메서드를 이해할 수 없었던 후에 soapclient.js를 발견하고 Ajax보다 코드가 적고 매우 쉽다는 것을 알게 되었습니다. soapclient.js는 코드를 훨씬 적게 만드는 Ajax 메서드와 유사하게 대부분의 작업을 수행합니다.또한 soapclient.js를 사용하여 SOAP 호출을 수행하고 XML 형식의 응답을 반환할 수 있습니다.
http://javascriptsoapclient.codeplex.com
문제는 Angular를 사용하려고 한다는 것입니다.XML 응답을 Anular로 덤프하는 JSJS 모델 개체입니다.Angular를 설정하는 방법을 잘 모르겠습니다.JS 프로젝트는 제가 하는 일을 위한 것이지만, 저는 제가 하고 있는 일을 분리하기 위한 최선의 방법을 알고 싶습니다.구글을 미친 듯이 검색해봤지만, 초보자에게는 대부분의 사례가 지나치게 복잡해 보입니다.
제가 가진 것은 다음과 같습니다.
<html>
<head>
<script language="JavaScript" type="text/javascript" src="jquery-1.10.1.js"></script>
<script language="JavaScript" type="text/javascript" src="soapclient.js"></script>
<script type="text/javascript">
function getData() {
var url2 = "https://myService";
var pl = new SOAPClientParameters();
pl.add("arg0", false);
SOAPClient.invoke(url2, "methodToCall", pl, true, getDataCallback);
}
function getDataCallback(r, soapResponse) {
alert(r.contents.payeeMailName);
}
</script>
</head>
<body>
<form>
<input type="button" value="Click Here to Call Web Service" onClick="getData()" style="width: 192px">
</form>
<div id="result">Result?</div>
</body>
</html>
이제 SOAP 서비스는 다음과 같은 데이터를 반환합니다.
<return>
<contents>
<eftAcctType>S</eftAcctType>
<id>
<djNumber>201-16-39063</djNumber>
<djSequence>1</djSequence>
</id>
<payeeAddrLine1>124 Agate Drive</payeeAddrLine1>
</contents>
<contents>
<eftAcctType/>
<id>
<djNumber>201-16-39201</djNumber>
<djSequence>1</djSequence>
</id>
<payeeAddrLine1>c/o Kevin Martinez, Attorney at Law</payeeAddrLine1>
</contents>
<contents>
<eftAcctType>C</eftAcctType>
<id>
<djNumber>201-16-38561</djNumber>
<djSequence>1</djSequence>
</id>
<payeeAddrLine1>1360 South Highway 191</payeeAddrLine1>
</contents>
<status>0</status>
</return>
Angular에서 "적절한" 방법은 무엇입니까?JS는 제가 한 방식이 괜찮다고 가정하고, 최선의 방법을 알려주지 않는다면, 그 결과 어떻게 XML 응답의 데이터를 루프하여 Angular 모델 개체로 구문 분석할 수 있습니까?저는 결국 이 데이터를 데이터 그리드에 사용하고 싶습니다.
어떤 도움이든 감사하겠습니다.
2년이 지났지만, 저는 GitHub에 있는 SOAP 웹 서비스를 사용하기 위해 특별히 Angular 모듈을 만들었습니다.
https://github.com/andrewmcgivery/angular-soap
다음은 사용 방법에 대한 블로그 게시물입니다. http://mcgivery.com/soap-web-services-angular-ionic/
간단히 말하면, 다음과 같은 작업을 수행할 수 있습니다.
angular.module('myApp', ['angularSoap'])
.factory("testService", ['$soap',function($soap){
var base_url = "http://www.cooldomain.com/SoapTest/webservicedemo.asmx";
return {
HelloWorld: function(){
return $soap.post(base_url,"HelloWorld");
}
}
}])
.controller('MainCtrl', function($scope, testService) {
testService.HelloWorld().then(function(response){
$scope.response = response;
});
})
$http 가로채기로 구현하는 것이 가장 좋은 방법일 것 같습니다.저는 우리 프로젝트에서 그것을 했고 각 $http 통화는 그대로 유지되기 때문에 잘 작동했습니다.
이것은 제가 우리 프로젝트를 위해 만든 공급자 링크입니다: http://jsfiddle.net/gqp9m/
soapclient 라이브러리에서 복사 붙여넣기를 수행하여 제공업체로 이동했습니다.나는 또한 코드가 jsHint를 통과하도록 구문을 조금 변경했습니다.수정된 기능의 대부분은 설명서 참고 사항과 함께 주석을 달았습니다. jQuery($.parseX경))가 필요합니다.ML 함수 - 재팩터링하여 jQuery의 종속성을 제거할 수 있습니다.
가장 큰 차이점은 제 코드가 첫 번째 요청에 wsdl을 로드하지 않고, 이렇게 전화를 걸기 전에 캐시해야 한다는 것입니다.
myModule.service(['myModule.soap-interceptor', function(soap){
$http.get('http://www.myveryfakedomain.com/CRMAPIWS74?wsdl',
{ isJSON: true }).then(function(result){
soap.setWSDL('http:/www.myveryfakedomain.com/CRMAPIWS74', result.data);
});
}]);
soap은 주입된 soap-procor 인스턴스입니다.wsdl을 부른 다음 soap.set을 호출합니다.WSDL이 기본 URL과 해결된 WSDL을 전달합니다.또한 isJ에 유의하십시오.SON 인수가 $http 호출에 전달되었습니다.이것은 기본적으로 내 코드가 모든 통화를 SOAP 요청으로 처리하기 때문입니다.그게 인터셉트입니다. is JSON:true를 사용하면 $http를 신의 뜻대로 사용할 수 있습니다;)
집합 호출 후WSDL은 항상 그렇듯이 $http로 전화만 하면 됩니다.
$http.get('http:/www.myveryfakedomain.com/CRMAPIWS74/action').then(function(result){
// do something...
});
이 코드는 우리 프로젝트를 위해 작성되었으며 지원되는 오픈 소스 프로젝트가 아닙니다.사용하기 전에 어느 정도의 유지보수나 리팩터링이 필요할 수도 있지만, 좋은 시작입니다.
SOAP wsdl 라이브러리 없이도 이를 달성할 수 있습니다.wsdl을 SOAP UI로 가져오고 봉투를 복사합니다.아래는 Angular의 예입니다.JS SOAP 웹 서비스를 처리하는 방법.
서비스:
app.service('service', function($http) {
this.soapService = function(_anydata) {
var _url = 'soap_service_endpoint_url';
var soapRequest = '<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:jn=""><soapenv:Header/><soapenv:Body><=== xxx ===></soapenv:Body></soapenv:Envelope>';
var soapAction = '<=== soap action ===>';
var headers = {
'SOAPAction': soapAction,
'Content-Type': 'text/xml; charset=utf-8'
};
return $http.post(_url, soapRequest, {
"headers": headers
});
}
});
서비스를 호출하고 XML 출력을 처리합니다.원하는 속성을 캡처할 수 있습니다.
service.soapService(data).then(function success(response) {
var _dataArr = [];
$(response.data).find('Transaction').each(function() {
_dataArr.push({
name: $(this).find('<=== your attributes ===>').text()
});
});
return _dataArr;
}, function error(response) {
console.log('<==== soap error: ' + response);
return response;
});
언급URL : https://stackoverflow.com/questions/17490483/angularjs-soap-service-integration-with-angularjs-model
'programing' 카테고리의 다른 글
| JQuery - 값을 기준으로 드롭다운 항목을 선택하는 방법 (0) | 2023.08.30 |
|---|---|
| 부트스트랩 4의 수직 정렬 중심 (0) | 2023.08.30 |
| dbms_output이 boolean을 인쇄할 수 없습니까? (0) | 2023.08.30 |
| mariadb 10.2.26에서 기본 키 +10000으로 열(항상 생성됨)을 생성하려면 어떻게 해야 합니까? (0) | 2023.08.30 |
| PHP와 Javascript 간에 배열을 전송하는 가장 좋은 방법 (0) | 2023.08.30 |