reactjs - 使用 Yii2 API 和 ReactJS 前端的 CORS 错误
问题描述
对于使用 Yii2 API 和 React Js 的人来说,这个问题似乎很容易。结合这项技术,我很新。
我有一个 Yii2 API,其行为配置如下所示
public $serializer = [
'class' => 'yii\rest\Serializer',
'collectionEnvelope' => 'items',
];
public static function allowedDomains()
{
return [
'*' // star allows all domains
'http://localhost:3000',
];
}
public function behaviors()
{
return array_merge(parent::behaviors(), [
// For cross-domain AJAX request
'corsFilter' => [
'class' => \yii\filters\Cors::className(),
'cors' => [
// restrict access to domains:
'Origin'=> static::allowedDomains(),
'Access-Control-Request-Method' => ['POST','GET','PUT','OPTIONS'],
'Access-Control-Allow-Credentials' => false,
'Access-Control-Max-Age' => 3600,// Cache (seconds)
'Access-Control-Request-Headers' => ['*'],
'Access-Control-Allow-Origin' => false,
],
],
]);
}
当我使用 GET 在此 API 上使用获取请求时,它运行良好并将数据返回到我的 reactjs 前端。
现在,我正在尝试为我的应用程序实现一个注册,我需要使用 POST 从我的前端向我的 API 发送数据。(我已经实现了我的注册操作,它与邮递员配合得很好。)当我尝试发出一个发布请求时对于此 API,我在控制台上收到错误消息(CORS 标头“Access-Control-Allow-Origin missing”)。下面是我的 Reactjs 请求,我真的不知道我错过了什么。对此的任何帮助将不胜感激。
//this function is to save data to the API
saveUser = (user) => {
fetch(URL_SIGNUPUSER, {
method: 'post',
mode: "cors",
headers: {
'Accept': 'application/json',
'Content-Type': 'application/json',
//'Access-Control-Allow-Credentials': "*"
},
body: JSON.stringify({
name:user.name,
username:user.username,
email:user.email,
password:user.password,
})
}).then(res=>res.json())
.then(()=>{
this.setState({
user: { name:'',
username:'',
email:'',
password:'',
confirm_password:'',
},
success:true,
error:false
})
});
}
解决方案
推荐阅读
- c++ - 用于 LED 板动画的 Arduino 地图或列表
- c# - 如何使用将使用相同构造函数的相同元素初始化引用类型列表?
- python - PyTorch:如何编写只返回权重的神经网络?
- python - 索引嵌套在字典中的命名元组
- axios - 什么是axios默认超时
- c# - .Core mvc 发布的应用程序部分视图在 ASPNETCORE_ENVIRONMENT “生产”中不起作用,但在“开发”中工作正常
- python - 消除 python 列表中的 n 最高值
- jquery - 具有动态值的 jQuery hasClass()
- sapui5 - 在ui5中使用javascript更改和设置smarttable的可见字段
- bazel - 如何在 bazel 中获取工作区状态