Надеюсь, это поможет тому, кто столкнулся с той же проблемой!
аюсь отправить данные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
метод. Почему это происходит?