Javascript 从服务器获取CORS响应，但仅针对两个api调用中的一个

问题摘要：

我陷入了一个奇怪的问题，我对同一个API进行了两次调用，一次成功，另一次返回

504

访问位于的XMLHttpRequest "来源" “”已被CORS策略阻止：否 “Access Control Allow Origin”标头出现在请求的服务器上 资源

---

详细问题

我有一个api，它接受图像为

blob

，并用解析的json进行响应。我有两个图像，所以我使用Promise.all（）调用api两次，如下所示：

let ocrPromises = id_card_images.map((image, index) => {
                let header: IHeadersData = {};
                header = index === 0 ? {card_side: "front"} : {card_side: "back"};
                return this.parseImageUsingOCR(image, header)//makes http call and return promise
            });
let ocrData = await Promise.all(ocrPromises);

其中一个请求立即返回

200

响应，而另一个请求在超过5秒后失败，代码为

504

。有人能提出这种行为的可能原因吗

在chrome网络面板之后。第一个是失败的请求，第二个是通过的请求。

---

parseImageUsingOCR方法，该方法进行实际的服务器调用（这是一段代码）

parseImageUsingOCR（图像，标题：IHeadersData）：承诺{
设blob=UtilityService.dataURItoBlob（图像）；
让transliterationUrl=ConstantService.getTransliterationUrl（）；
让formData:formData=newformdata（）；
formData.append（'image'，blob）；
让userData=StoreService.getUserData（）；
let TranslationHeader:IHeadersData=UtilityService.GetHeaderForoCrParseByCountryAndType(
userData.country，
userData.id\u卡类型
);
音译头={
…音译标题，
img_类型：“id_卡”，
…标题，
//“内容类型”：“应用程序/json”
};
返回新承诺（（解决、拒绝）=>{
//警报（JSON.stringify（音译头））；
this.serverService.makePostRequest（{url:transiterationurl，body:formData，header:transiterationheader}）
.subscribe（（val:{parsed_data:IUser，raw_data:string，s3_url:string}）=>{
if（val.parsed_数据）{
决心({
parsed_数据：此.removeAllUndefinedFieldsFromObject（val.parsed_数据），
s3_url:val.s3_url
})
}否则{
解析（{parsed_data:{}，s3_url:val.s3_url}）；
}
})
})
}

这其实不是CORS的问题

获得200 OK响应的请求显示CORS报头存在。 失败的请求不会从任何应该应答的服务器得到应答，因此该服务器和您之间的网关将返回网关超时（HTTP 504）

无论如何，这是一个问题，网关服务器没有发送CORS头这一事实不会有太大的区别。我怀疑OCR服务器的响应时间太长，网关取消了请求，并用超时来响应

---

要么增加网关超时设置，要么尝试使用较小的图像，希望不会花费OCR太长的时间来处理。

您也可以使用ICR方法发布图像分割代码吗？我补充了这一点。感谢您的服务器是否使用其他服务来解析您的图像？我认为这可能是你想在你的服务器上检查的东西，因为504代码是一个，因为你有一个成功的请求，这也暗示这更可能是后端问题。是的，后端正在使用一些亚马逊服务。但为什么会导致超时？我觉得是对的，谢谢。在AWS负载平衡器后面有一个web服务器，默认空闲超时为60秒，请求确实需要约1.4分钟。增加超时时间可以修复此问题

parseImageUsingOCR(image, header: IHeadersData): Promise<{ parsed_data: any, s3_url: string }> {


        let blob = UtilityService.dataURItoBlob(image);
        let transliterationUrl = ConstantService.getTransliterationUrl();
        let formData: FormData = new FormData();
        formData.append('image', blob);
        let userData = StoreService.getUserData();
        let transliterationHeader: IHeadersData = UtilityService.getHeaderForOCRParseByCountryAndIdType(
            userData.country,
            userData.id_card_type
        );
        transliterationHeader = {
            ...transliterationHeader,
            img_type: 'id_card',
            ...header,
            // "content-type": "application/json"
        };

        return new Promise((resolve, reject) => {
            // alert(JSON.stringify(transliterationHeader));
            this.serverService.makePostRequest({url: transliterationUrl, body: formData, header: transliterationHeader})
                .subscribe((val: { parsed_data: IUser, raw_data: string, s3_url: string }) => {
                    if (val.parsed_data) {
                        resolve({
                            parsed_data: this.removeAllUndefinedFieldsFromObject(val.parsed_data),
                            s3_url: val.s3_url
                        })
                    } else {
                        resolve({parsed_data: {}, s3_url: val.s3_url});
                    }
                })
        })
    }