502来自API网关的错误响应处于react中,但对邮递员有效



当我通过测试位或通过POSTMAN向API网关上的API发送请求时,请求的发送和接收都很好,我可以得到预期的响应体,但是,当我通过下面的代码发出API请求时,我得到了502错误。

CORS策略没有问题,因为我没有收到任何错误,这是我的请求代码和随后的错误。

POST REQUEST CODE

fetch('https://4diopo9a77.execute-api.eu-west-2.amazonaws.com/DSA_API/imagedata', {
method: 'POST',
body :"{'A':'A'}"
}).then(function(data) {
console.log(data)
})

控制台输出

POST `API_NAME` 502
Response {type: 'cors', url: '*API_NAME*', redirected: false, status: 502, ok: false, …}

错误1堆栈跟踪

POSTRequest @   Home.js:15
getFileData @   Home.js:49
callCallback    @   react-dom.development.js:3945
invokeGuardedCallbackDev    @   react-dom.development.js:3994
invokeGuardedCallback   @   react-dom.development.js:4056
invokeGuardedCallbackAndCatchFirstError @   react-dom.development.js:4070
executeDispatch @   react-dom.development.js:8243
processDispatchQueueItemsInOrder    @   react-dom.development.js:8275
processDispatchQueue    @   react-dom.development.js:8288
dispatchEventsForPlugins    @   react-dom.development.js:8299
(anonymous) @   react-dom.development.js:8508
batchedEventUpdates$1   @   react-dom.development.js:22396
batchedEventUpdates @   react-dom.development.js:3745
dispatchEventForPluginEventSystem   @   react-dom.development.js:8507
attemptToDispatchEvent  @   react-dom.development.js:6005
dispatchEvent   @   react-dom.development.js:5924
unstable_runWithPriority    @   scheduler.development.js:468
runWithPriority$1   @   react-dom.development.js:11276
discreteUpdates$1   @   react-dom.development.js:22413
discreteUpdates @   react-dom.development.js:3756
dispatchDiscreteEvent   @   react-dom.development.js:5889

错误2详细信息

body: ReadableStream
bodyUsed: false
headers: Headers {}
ok: false
redirected: false
status: 502
statusText: ""
type: "cors"
url: "*API_NAME*"
[[Prototype]]: Response

这是POSTMAN请求信息的图片

需要将Cors标题添加到响应中,浏览器阻止了响应,因为它没有返回标题,添加了这个并起到了作用:

"Access-Control-Allow-Origin": '*'

所以我在lambda中的返回看起来是这样的:

return {
"statusCode": 200,
"body": json.dumps(data),
"headers": {
'Content-Type': 'application/JSON',
"Access-Control-Allow-Origin": '*'
},
}

相关内容

最新更新