反应授权标头不起作用答案

【问题标题】：React Authorization Header Not Working反应授权标头不起作用
【发布时间】：2026-02-14 00:40:01
【问题描述】：

我目前正在使用 oAuth 身份验证，它在休息客户端中运行良好。

但在 React Js (401) 中显示错误。反应的代码是：

let UserAPI = {

    login(username, password){
        const requestOptions = {
            method: 'POST',
            headers: {'Authorization': 'Basic ' + btoa('livechat-api-client:livechat'), 'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8' },
            body: `username=${username}&password=${password}&grant_type=password`
        };
        return fetch('http://localhost/cronos/oauth/token', requestOptions)
            .then(response => {
                if (!response.ok) {
                    return Promise.reject(response.statusText);
                }
                return response.json();
            })
            .then(user => {
                // login successful if there's a jwt token in the response
                if (user && user["access_token"]) {
                    // store user details and jwt token in local storage to keep user logged in between page refreshes
                    localStorage.setItem('user', JSON.stringify(user));
                }
                return user;
            });
    }
}

export default UserAPI;

【问题讨论】：

你得到的确切错误是什么
我收到 401 错误，我认为授权标头不起作用
您是否在错误中看到 Access-Control-Allow-origin header not present 消息
相同的进程在休息客户端工作正常，但在反应 401 错误发生，在服务器端没有错误，所以我认为反应有些错误
我很确定这是一个 cors 问题，请查看*.com/questions/36554013/…。还有你的后端使用什么语言

标签： javascript reactjs

【解决方案1】：

感谢所有这些问题都是关于 cors 的。我在 spring 应用程序中添加了 cors 过滤器，并允许 spring security 中的选项。

添加了新的过滤器

 @Component
    @Order(3)
    public class CorsFilter implements Filter {

        public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
            final HttpServletResponse response = (HttpServletResponse) res;
            response.setHeader("Access-Control-Allow-Origin", "*");
            response.setHeader("Access-Control-Allow-Methods", "POST, PUT, GET, OPTIONS, DELETE");
            response.setHeader("Access-Control-Allow-Headers", "Authorization, Content-Type");
            response.setHeader("Access-Control-Max-Age", "3600");
            if ("OPTIONS".equalsIgnoreCase(((HttpServletRequest) req).getMethod())) {
                response.setStatus(HttpServletResponse.SC_OK);
            } else {
                chain.doFilter(req, res);
            }
        }

        @Override
        public void destroy() {
        }

        @Override
        public void init(FilterConfig config) throws ServletException {
        }
    }

在 Spring Security 中我忽略了 OPTIONS http 方法

@Override
    public void configure(WebSecurity web) throws Exception {
        web.ignoring().antMatchers(HttpMethod.OPTIONS, "/oauth/token");
}

【讨论】：