gpt4 book ai didi

javascript - CORS 发布请求失败

转载 作者:数据小太阳 更新时间:2023-10-29 06:10:23 24 4
gpt4 key购买 nike

我使用 SLIM 微框架构建了一个 API。我设置了一些使用以下代码添加 CORS header 的中间件。

class Cors{

public function __invoke(Request $request, Response $response, $next){

$response = $next($request, $response);
return $response
->withHeader('Access-Control-Allow-Origin', 'http://mysite')
->withHeader('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type, Accept, Origin, Authorization')
->withHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
}

}

对于我的前端,我使用了 VueJS。我设置了 VueResource 并使用以下代码创建了一个函数。

register (context, email, password) {
Vue.http({
url: 'api/auth/register',
method: 'POST',
data: {
email: email,
password: password
}
}).then(response => {
context.success = true
}, response => {
context.response = response.data
context.error = true
})
}

在 chrome 中,控制台会记录以下错误。

XMLHttpRequest cannot load http://mysite:9800/api/auth/register. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://mysite' is therefore not allowed access.

奇怪的是,GET 请求工作得很好。

最佳答案

你在这里解决了一半的 1/2。

您缺少的是一个 OPTIONS 路由,其中​​还需要添加这些 header 。

$app->options('/{routes:.+}', function ($request, $response, $args) {
return $response
->withHeader('Access-Control-Allow-Origin', 'http://mysite')
->withHeader('Access-Control-Allow-Headers', 'X-Requested-With, Content-Type, Accept, Origin, Authorization')
->withHeader('Access-Control-Allow-Methods', 'GET, POST, PUT, DELETE, OPTIONS');
});

关于javascript - CORS 发布请求失败,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/38005829/

24 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com