从角HttpClient调用异步方法获得响应头azure AI计算机视觉

Question

我正在尝试使用角来实现Azure计算机视觉识别文本AI。我需要从第一个Http调用的响应中找到一个特定的头，然后调用第二个。但我找不到头像。你能帮我找出我在这里缺少的东西吗？您可以在下面的代码中看到我已经尝试过的东西。

async post(url: string): Promise<any> {
    const body = {
      url: url,
      observe: 'response'
    };
    const options = {
      headers: new HttpHeaders({
        'Content-Type': 'application/json',
        'Ocp-Apim-Subscription-Key': config.api.apiKey,
        'Access-Control-Expose-Headers': 'allow',
        'resolveWithFullResponse': 'true',
        'responseType': 'text'
      })
    };
    const result = await this.http.post(config.api.baseUrl, body, options)
      .subscribe(async (res: Response) => {
        console.log(res);
        const operationLocation = res.headers.get('Operation-Location');
        return await this.http.get(operationLocation, options).toPromise();
      });
    return result;
  }

我能够在浏览器网络中看到响应头，但是res对象始终是空的。

​

​

Azure文档说：“服务已经接受了请求，稍后将开始处理。它将立即返回接受，并包含一个”操作位置“头。客户端应使用此标头中指定的URL进一步查询操作状态。操作ID将在48小时内过期。”

Answer 1

最后，我解决了这个问题。幸运的是，我阅读了这份文件，其中提到“识别文本方法不会返回成功响应正文中的任何信息”。后来，我能够使用OCR API接口完成我的需求。我必须将我的基本URL更改为下面的URL。

https://westeurope.api.cognitive.microsoft.com/vision/v2.0/ocr

home.component.ts

async submit() {
    if (this.url.value) {
        const result: any = await this.detectionService.post(this.url.value);
        const resultArray: Array < string > = [];
        this.lines = result.regions[0].lines.forEach((obj: any) => {
            obj.words.forEach((word: any) => {
                resultArray.push(word.text);
            });
        });
        this.stringResult = resultArray.join(' ');
    }
}

service.ts

async post(url: string): Promise<any> {
    const body = {
      url: url
    };
    const options = {
      headers: new HttpHeaders({
        'Content-Type': 'application/json',
        'Ocp-Apim-Subscription-Key': config.api.apiKey
      })
    };
    return await this.http.post(config.api.baseUrl, body, options).toPromise();
  }

我得到了如下所需的输出。

{"language":"en","textAngle":0,"orientation":"Up","regions":[{"boundingBox":"74,172,995,446","lines":[{"boundingBox":"159,172,884,76","words":[{"boundingBox":"159,177,47,58","text":"If"},{"boundingBox":"221,194,129,54","text":"you"},{"boundingBox":"369,183,180,53","text":"want"},{"boundingBox":"566,183,73,53","text":"to"},{"boundingBox":"657,172,185,64","text":"shine"},{"boundingBox":"864,176,124,60","text":"like"},{"boundingBox":"1008,194,35,42","text":"a"}]},{"boundingBox":"74,261,995,76","words":[{"boundingBox":"74,279,243,52","text":".—sun,"},{"boundingBox":"335,261,145,60","text":"first"},{"boundingBox":"501,261,158,68","text":"burn"},{"boundingBox":"683,261,124,60","text":"like"},{"boundingBox":"827,279,35,42","text":"a"},{"boundingBox":"882,279,187,58","text":"sun.."}]},{"boundingBox":"381,347,436,43","words":[{"boundingBox":"381,347,51,43","text":"X:"},{"boundingBox":"440,348,222,42","text":"P.TAbdul"},{"boundingBox":"680,352,137,38","text":"Kalam"}]},{"boundingBox":"541,589,158,29","words":[{"boundingBox":"541,589,17,22","text":"B"},{"boundingBox":"560,589,139,29","text":"rainyQ!0te'"}]}]}]}

Answer 2

尝试使用HttpResponse作为预期的响应类型，这将为您提供完整的响应。以便您可以从其中访问标头。

const result = await this.http.post<HttpResponse<Object>>(config.api.baseUrl, body, options)
      .subscribe(async (res: Response) => {
        console.log(res);
        const operationLocation = res.headers.get('Operation-Location');
        return await this.http.get(operationLocation, options).toPromise();
});