[英]Possible unhandled promise rejection while catch is present
I have got the following code: 我有以下代码:
export function fetchValueFromApi(){
return function act(dispatch){
dispatch(fetchingLimit);
return fetch('https://someapi/v1/foo/bar?api_key=123456789')
.then(response =>{
console.log("response",response.json());
response.json();
}).then(json =>{
if (json.data()) {
dispatch(receivingValue(json.data.result))
} else {
throw new Error('Error');
}
}).catch(error => dispatch(receivingValueFailed(error)))
}
}
Now I know this call won't succeed. 现在,我知道此呼叫不会成功。 I am expecting it to fail and go into the catch.
我期望它会失败并陷入困境。 However, I am getting this error:
但是,我收到此错误:
Possible Unhandled Promise Rejection
可能的未承诺的拒绝
So for some reason we're not hitting the .catch
. 因此出于某些原因,我们没有点击
.catch
。
How could I solve this? 我该如何解决?
So you are hitting the catch, just not with the error you expected. 因此,您遇到了麻烦,只是没有遇到您期望的错误。
The 403 is not an error as far as fetch is concerned, since the request itself was made successfully (the response is just not what your application expected). 就获取而言,403并不是错误,因为请求本身已成功发出(响应不是您的应用程序期望的)。 You have to handle 40X errors yourself.
您必须自己处理40倍错误。 And as your console.log reveals, the exception happens before your
throw new Error
is reached. 并且正如您的console.log所显示的,在发生
throw new Error
之前,将发生异常。
A fetch() promise will reject with a TypeError when a network error is encountered or CORS is misconfigured on the server side, although this usually means permission issues or similar — a 404 does not constitute a network error, for example.
当遇到网络错误或在服务器端未正确配置CORS时,fetch()承诺将以TypeError拒绝,尽管这通常意味着权限问题或类似问题,例如404并不构成网络错误。
From https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch 来自https://developer.mozilla.org/zh-CN/docs/Web/API/Fetch_API/Using_Fetch
You should 你应该
response.json()
in the first .then handler: .then(response => response.ok && response.json())
response.json()
:. .then(response => response.ok && response.json())
if (json && json.data)
if (json && json.data)
You're not return
ing the promises from your then
handlers, so there is no chaining. 您不会
then
处理程序return
承诺,因此没有链接。 The response body is not even awaited. 甚至没有等待响应机构。 The
catch
handler is not chained to the promise that actually rejects, therefore it the error is indeed unhandled. catch
处理程序未链接到实际拒绝的承诺,因此错误确实未得到处理。
export function fetchValueFromApi(){
return function act(dispatch){
dispatch(fetchingLimit);
return fetch('https://someapi/v1/foo/bar?api_key=123456789')
.then(response => {
var body = response.json();
console.log("response body", body);
return body;
// ^^^^^^
}).then(json => {
if (json.data ) {
// ^
return dispatch(receivingValue(json.data.result))
// ^^^^^^
} else {
throw new Error('Error');
}
}).catch(error =>
dispatch(receivingValueFailed(error))
)
}
}
Remember that arrow functions only implicitly return the expression value when you use the concise body syntax, ie without block braces. 请记住,当您使用简洁的主体语法时,箭头函数仅隐式返回表达式值,即不带大括号。
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.