自定义标头已从我的请求中删除答案

【问题标题】：Custom headers are stripped from my request自定义标头已从我的请求中删除
【发布时间】：2020-04-19 02:17:45
【问题描述】：

我正在尝试将 Authorization 标头添加到从我的 React 应用程序到 Spring Boot 后端的 get 请求中。我已经尝试过 fetch 和 axios：

fetch('http://127.0.0.1:8080/api/tender', {
            method: 'GET',
            headers: {
                Authorization: 'Bearer' + token,
                'Access-Control-Allow-Origin': '*'
            }
        });

axios.defaults.headers.common['Authorization'] = 'Bearer' + token;
axios.defaults.headers.common['Access-Control-Allow-Origin'] = '*';
axios.get('http://127.0.0.1:8080/api/tender').then((res) => console.log(res));

我从 devtools 查看的原始标题：

Host: 127.0.0.1:8080
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:71.0) Gecko/20100101 Firefox/71.0
Accept-Language: nb-NO,nb;q=0.9,no-NO;q=0.8,no;q=0.6,nn-NO;q=0.5,nn;q=0.4,en-US;q=0.3,en;q=0.1
Accept-Encoding: gzip, deflate
Access-Control-Request-Method: GET
Access-Control-Request-Headers: access-control-allow-origin,authorization
Referer: http://localhost:3000/import
Origin: http://localhost:3000
DNT: 1
Connection: keep-alive
Pragma: no-cache
Cache-Control: no-cache
Accept: */*

在调用 api 之前以某种方式删除了我的自定义标头，我收到以下错误：Missing security token, please log in 如果我编辑并重新发送相同的请求，将授权添加到我的标头，api 会以 200 响应

编辑：

忽略 http 选项方法的令牌验证会给出 200 响应。但我最初的请求从未运行。我希望我的 get-request 在选项方法返回 OK 后立即运行

【问题讨论】：

问题中显示的请求标头适用于浏览器在尝试从您的代码发出 GET 请求之前自动发出的 CORS 预检 OPTIONS 请求。问题显示的是预期行为。除了浏览器自己设置的标头之外，浏览器有意在该预检 OPTIONS 请求中不包含任何标头。因此，这意味着将请求发送到的服务器必须允许未经身份验证的 OPTIONS 请求（不期望 Authorization 标头或任何其他凭据）。见stackoverflow.com/a/45406085/441757
顺便说一下，从前端代码的 headers 对象中删除 'Access-Control-Allow-Origin': '*'。该标头仅是响应标头。尝试将其设置为请求标头对您没有帮助。
不应该在选项请求返回正常后立即运行我的初始获取请求吗？
如果选项请求确实返回了 ok — 带有正确的响应标头 — 那么是的，浏览器将运行 get 请求。因此，如果浏览器没有运行您的 get 请求，则意味着浏览器已确定预检未成功。这可能是因为选项响应的状态代码是错误代码而不是 200 OK 成功响应，或者可能是因为选项响应没有浏览器期望的标头。因此，您可以查看浏览器在 devtools 控制台中登录的错误消息。并使用Network页面获取响应状态码
在删除 http 选项方法的令牌验证后，我已经收到 200 OK 成功响应。我的 get 请求仍然没有运行

标签： typescript spring-boot cors axios fetch

【解决方案1】：

我的 Spring Boot 后端未正确处理预检选项请求。原来我缺少 cors 配置：

@EnableWebSecurity
@Configuration
public class WebSecurityConfig extends WebSecurityConfigurerAdapter {

    @Override
    protected void configure(HttpSecurity http) throws Exception {
        http
                .httpBasic().disable()
                .cors().configurationSource(request -> new CorsConfiguration().applyPermitDefaultValues())
                .and()
                .csrf().disable();
    }
}

这个配置解决了这个问题。

【讨论】：

【解决方案2】：

我不确定这是否能解决您的问题，但在 'Bearer' 之后是否缺少空格？

'Bearer'+token => 'Bearer '+token ?

【讨论】：

我的请求标头中没有授权值。如果包含令牌，我的后端将返回无效的未丢失令牌错误消息