Надеюсь, это поможет тому, кто столкнулся с той же проблемой!

аюсь отправить данныеAPI эмоций Microsoft Cognitive Servicesв формеContent-Type: application/octet-stream.

Я получаю строку Base64 изображения с холста, вызываяcanvas.toDataURL('image/jpeg', 0.1);(Я также пытался назвать его с 1, 0,5, 0,2, просто чтобы проверить, работает ли он и перестает ли давать мне ошибки)

Затем с этой строкой Base64 я вызываю EmotionServicegetUserEmotion метод.

Я следовал инструкциям, упомянутым вэтот ответ, чтобы сделать AJAX-вызов с использованием HttpClient Angular. Вот как выглядит мой сервис:

import { Injectable } from '@angular/core';
import { HttpClient, HttpHeaders } from '@angular/common/http';

@Injectable()
export class EmotionService {

  apiUrl: string = 'https://westus.api.cognitive.microsoft.com/emotion/v1.0/recognize';

  constructor(private http: HttpClient) {}

  getUserEmotion(userImageBlob) {
    let headers = new HttpHeaders();
    headers = headers.set('Ocp-Apim-Subscription-Key', 'my-api-key-here');
    headers = headers.set('Content-Type', 'application/octet-stream');
    return this.http.post(this.apiUrl, { "data": this.makeBlob(userImageBlob) }, { headers: headers });
  }

  makeBlob(dataURL) {
    var BASE64_MARKER = ';base64,';
    if (dataURL.indexOf(BASE64_MARKER) == -1) {
      var parts = dataURL.split(',');
      var contentType = parts[0].split(':')[1];
      var raw = decodeURIComponent(parts[1]);
      return new Blob([raw], { type: contentType });
    }
    var parts = dataURL.split(BASE64_MARKER);
    var contentType = parts[0].split(':')[1];
    var raw = window.atob(parts[1]);
    var rawLength = raw.length;

    var uInt8Array = new Uint8Array(rawLength);

    for (var i = 0; i < rawLength; ++i) {
      uInt8Array[i] = raw.charCodeAt(i);
    }

    return new Blob([uInt8Array], { type: contentType });
  }

}

Вот как выглядит моя вкладка Network для запроса:

У меня есть следующие вопросы:

В ответе SO, за которым я следую, они также указали, что я должен установитьprocessData:false вариант для моего вызова AJAX. Но я не уверен, как это сделать с помощью Angular'sHttpClient.data Поле в запросе также будет пустым. Но когда я отлаживал, я получал правильный объект Blob отmakeBlob метод. Почему это происходит?

Ответы на вопрос(1)

Ваш ответ на вопрос