在header加入自定义参数token怎样避免预检请求

要避免预检请求，可以采用以下两种方法来在请求的header中添加自定义参数token：

1. 使用自定义请求头：可以将token作为自定义的请求头添加到请求中。例如，在发送请求时，可以在header中添加一个名为"X-Token"的自定义请求头，将token作为该请求头的值传递给服务器。这样做的好处是，自定义请求头不会触发预检请求。

示例代码（使用JavaScript的XMLHttpRequest）：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/api', true);
xhr.setRequestHeader('X-Token', 'your_token_value');
xhr.send();

2. 将token添加到URL的查询参数中：将token作为URL的查询参数附加到请求URL中。这样做的好处是，查询参数不会触发预检请求。

示例代码（使用JavaScript的XMLHttpRequest）：

var xhr = new XMLHttpRequest();
xhr.open('GET', 'https://example.com/api?token=your_token_value', true);
xhr.send();

需要注意的是，这些方法都需要在服务器端进行相应的配置，以接受并验证token参数。

相关问题

header头加参数跨域

跨域请求中添加header头参数的问题可以通过修改服务器端来解决。根据引用\[1\]和引用\[2\]的内容，可以在服务器端的响应头中设置允许的自定义header参数。具体的做法有两种方式：

方式一：在服务器端的响应头中添加以下内容：

response.setHeader("Access-Control-Allow-Headers", "content-type,Token");

其中，content-type是请求参数的编码格式，Token是自定义的header参数。这样就允许了跨域请求中添加这两个header参数。

方式二：在服务器端的响应头中添加以下内容：

header('Access-Control-Allow-Headers:x-requested-with,content-type,requesttype');

其中，x-requested-with、content-type和requesttype是自定义的header参数。这样就允许了跨域请求中添加这三个header参数。

需要注意的是，无论使用哪种方式，都需要在服务器端的响应头中设置好允许的自定义header参数，否则客户端无法成功提交请求。另外，还需要处理预检请求的情况。根据引用\[3\]的内容，可以在路由中先添加一个OPTIONS请求，然后再进行POST请求。具体的做法如下：

// OPTIONS请求
Route::options('/join/activity', function(){
    return response("OK", 200)
        ->header('Access-Control-Allow-Origin', '*')
        ->header('Access-Control-Allow-Methods', 'POST,GET,OPTIONS,DELETE')
        ->header('Access-Control-Allow-Headers', 'Authorization');
});

// POST请求
Route::post('join/activity', 'Activities\ActivitiesController@joinActivity');

通过以上的设置，就可以在跨域请求中成功添加header头参数了。
#### 引用[.reference_title]
- *1* [axios 发送 header 并且设置允许跨域](https://blog.csdn.net/a1334933655/article/details/121185504)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insert_down28v1,239^v3^insert_chatgpt"}} ] [.reference_item]
- *2* [ajax设置header头部之后造成跨域的解决方案](https://blog.csdn.net/weixin_30393279/article/details/114962009)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insert_down28v1,239^v3^insert_chatgpt"}} ] [.reference_item]
- *3* [跨域问题总结（普通跨域，header头加参数跨域）](https://blog.csdn.net/wuye_lh/article/details/100309813)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insert_down28v1,239^v3^insert_chatgpt"}} ] [.reference_item]
[ .reference_list ]

has been blocked by CORS policy: Request header field token is not allowed by Access-Control-Allow-Headers in preflight response.

这个错误是由于浏览器的同源策略导致的，浏览器会限制跨域请求的访问。在发送跨域请求时，浏览器会先发送一个OPTIONS预检请求，探测该请求服务端是否允许自定义跨域字段。如果服务端不允许该字段，则会返回错误信息提示错误。解决方法可以在服务端设置Access-Control-Allow-Headers响应头，允许自定义的跨域字段。