Javascript 已解决获取抛出控制台错误401

My

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的预期行为吗？我看不到任何与在401上或其他任何地方抛出错误有关的东西。控制台记录是一个合法错误。我没有使用任何polyfills包装进行

提取

。Chrome版本为63.0.3239.108。

Fetch正在按预期工作。您从服务器返回了一个有效的响应，只是该端点需要某种授权，并返回了一个状态代码为

401

的响应

从fetch（）返回的承诺不会在HTTP错误状态下拒绝 即使响应是HTTP 404或500。相反，它会解决问题 正常情况下（ok状态设置为false），它只会在 网络故障或任何阻止请求完成的情况

---

Fetch正在按预期工作。您从服务器返回了一个有效的响应，只是该端点需要某种授权，并返回了一个状态代码为

401

的响应

从fetch（）返回的承诺不会在HTTP错误状态下拒绝 即使响应是HTTP 404或500。相反，它会解决问题 正常情况下（ok状态设置为false），它只会在 网络故障或任何阻止请求完成的情况

---

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

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

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

 res.header('Access-Control-Allow-Origin','*');
 res.header('Access-Control-Allow-Headers', 'Authorization, X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Allow-Request-Method');
 res.header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, DELETE');
 res.header('Allow', 'GET, POST, OPTIONS, PUT, DELETE');

---

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

 res.header('Access-Control-Allow-Origin','*');
 res.header('Access-Control-Allow-Headers', 'Authorization, X-API-KEY, Origin, X-Requested-With, Content-Type, Accept, Access-Control-Allow-Request-Method');
 res.header('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, DELETE');
 res.header('Allow', 'GET, POST, OPTIONS, PUT, DELETE');

---

这是因为响应中缺少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"));
        }


    }
}

---

这是因为响应中缺少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"));
        }


    }
}

---

错误来自服务器。应在控制台中显示错误。Chrome在控制台中显示失败的请求。我相信一个非200或300会被认为是失败的。看起来

fetch

不会拒绝失败的请求。由您检查状态代码。下面是

fetch

拒绝的几个原因：错误来自服务器。应在控制台中显示错误。Chrome在控制台中显示失败的请求。我相信一个非200或300会被认为是失败的。看起来

fetch

不会拒绝失败的请求。由您检查状态代码。以下是

fetch

拒绝的几个原因：