Приложение для загрузки сервиса мыла с использованием угловых

Question

Я пользуюсь сервисами soap, в сервисах soap я передаю XML и вместе с вложенными файлами. В инструменте SoapUI его работа отлично. Но в моем случае я хочу добиться через Angular6. Вот мой код XML.

<soapenv:Envelope xmlns:soapenv="http://schemas.xmlsoap.org/soap/envelope/" xmlns:wsdl="http://service.wsvc.mhb.crimsonlogic.com/wsdl">
 <soapenv:Header><wsse:Security soapenv:mustUnderstand="1" xmlns:wsse="http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-secext-1.0.xsd" xmlns:wsu="http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-wssecurity-utility-1.0.xsd"><wsse:UsernameToken wsu:Id="UsernameToken-4C616D2C88CB4E2F9915586128832798"><wsse:Username>this.userName</wsse:Username>
    <wsse:Password Type="http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-username-token-profile-1.0#PasswordDigest"> token.getPasswordDigest()  </wsse:Password><wsse:Nonce EncodingType="http://docs.oasis-open.org/wss/2004/01/oasis-200401-wss-soap-message-security-1.0#Base64Binary"> token.getNonceBase64() </wsse:Nonce><wsu:Created> token.getCreated() </wsu:Created></wsse:UsernameToken></wsse:Security>
     </soapenv:Header>
      <soapenv:Body>
      <wsdl:SubmitMessageRequest>
      <wsdl:DocumentType> document </wsdl:DocumentType>
       <wsdl:Subject>this.fileName</wsdl:Subject>
       <wsdl:PayloadName>
        <wsdl:href>cid: this.fileName</wsdl:href>
        </wsdl:PayloadName>
       <wsdl:AttachmentFile>
        <wsdl:href>?</wsdl:href>
         </wsdl:AttachmentFile>
         </wsdl:SubmitMessageRequest>
        </wsdl:MessageSubmission>
      </soapenv:Body>
      </soapenv:Envelope>

Answer 1

Сервисы SOAP используют протокол HTTP, поэтому это возможно. Для связи с сервисами SOAP вы можете использовать угловой модуль ngx-soap . Внутри тела SOAP-запроса вам нужно поместить файл, который вы хотите загрузить, в виде двоичных данных.

Файл шаблона

<input
  style="display: none"
  type="file" (change)="onFileChanged($event)"
  #fileInput>
<button (click)="fileInput.click()">Select File</button>
<button (click)="onUpload()">Upload!</button>

Файл компонента

export class MyFileUploadComponent {
  selectedFile: File
  client: Client;

  constructor(private soap: NgxSoapService) {
     this.soap.createClient('assets/fileuploader.wsdl').subscribe(client => this.client = client);
  }

  onFileChanged(event) {
    this.selectedFile = event.target.files[0]
  }

  onUpload() {
    // upload code goes here
    const body = {
          file: this.selectedFile
    };
    (<any>this.client).Add(body).subscribe((res: ISoapMethodResponse) => this.message = res.result.AddResult);
  }
}