代码之家 › 专栏 › 技术社区 › Sandeep Gupta

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

ajax javascript

Sandeep Gupta · 技术社区 · 6 年前

问题概要:

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

访问XMLHttpRequest ' https://ocr.mywebsite.ai/tesseract/basic/ '从原点 ' http://localhost:8080 '已被CORS策略阻止:否请求的资源。

细节问题

我有一个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网络面板。第一个是失败的请求,第二个是通过的请求。

分析图像 进行实际服务器调用的方法(这是一个角度为7的代码)

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});
                    }
                })
        })
    }

1 回复 | 直到 6 年前

geekonaut 6 年前

这其实不是球衣的问题。

得到200ok响应的请求显示CORS头存在。失败的请求不会从任何服务器应答,因此服务器和您之间的网关将返回网关超时(HTTP 504)。

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

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