Question

我的fetch记录了控制台错误，尽管已通过401 Unauthorized

解决了

componentWillMount() {
    this.setState({ isInitializing: true });
    fetch('/api/users/getcurrent')
        .then(resp => {
            console.log('resolved');
            if (resp.status == 200) {
                // do stuff
            }
            this.setState({ isInitializing: false });
        })
        .catch(err => {
            console.log('catched');
            this.setState({ isInitializing: false });
        });
}

这是fetch的预期行为吗？我没有看到任何与MDN或其他任何地方401上的错误相关的内容。控制台记录是合法的错误。我没有在fetch使用任何填料的填料。 Chrome版本为63.0.3239.108。

Answer 1

Fetch正在按预期工作。您从服务器获得了有效的响应，只是该端点期望某种授权并发回状态代码为401的响应。

从fetch（）返回的Promise不会拒绝HTTP错误状态即使响应是HTTP 404或500.相反，它将解决通常（ok状态设置为false），它只会拒绝网络故障或任何事情阻止请求完成。

https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch https://developer.mozilla.org/en-US/docs/Web/HTTP/Status/401

Answer 2

这与fetch本身没什么共同之处。 Chrome Dev工具默认在控制台中记录HTTP错误（4xx和5xx状态），如Additional settings section here中所述。因此，您的获取承诺可以成功解决，您只能看到可以关闭的浏览器日志。

Answer 3

请在代码服务器中设置标题。

fileContents

Answer 4

发生这种情况是因为响应中缺少CORS标头。通过添加以下内容，使它可以按预期工作：

@Component
public class CORSHeadersToUnauthorizedResponseFilter extends OncePerRequestFilter {

    @Override
    protected void doFilterInternal(HttpServletRequest httpServletRequest,
                                    HttpServletResponse httpServletResponse,
                                    FilterChain filterChain) throws IOException, ServletException {

        filterChain.doFilter(httpServletRequest, httpServletResponse);

        if(httpServletResponse.getStatus() == HttpStatus.UNAUTHORIZED.value() ) {

            httpServletResponse.addHeader("Access-Control-Allow-Credentials", "true");
            httpServletResponse.setHeader("Access-Control-Allow-Origin", httpServletRequest.getHeader("origin"));
        }


    }
}

已解决的提取引发控制台错误401

4 个答案: