Ошибка CORS при использовании API Yii2 и интерфейса ReactJS - PullRequest
Новая
       8

Ошибка CORS при использовании API Yii2 и интерфейса ReactJS

0 голосов
/ 21 сентября 2018

Этот вопрос может показаться кому-то очень простым в использовании API Yii2 и React Js.Я совсем недавно комбинирую эту технологию.

У меня есть API Yii2 с настроенным поведением, как показано здесь 

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,

                ],
            ],

        ]);
    }

, когда я использую запрос на выборку для этого API с помощью GET, он работает отличнои возвращает данные в мой интерфейс activjs.

Теперь я пытаюсь реализовать регистрацию в моем приложении, где мне нужно отправлять данные из моего интерфейса с помощью POST в мой API. (Я реализовал действие регистрации иэто хорошо работает с почтальоном.) Когда я пытаюсь отправить запрос к этому API, я получаю сообщение об ошибке (отсутствует заголовок CORS 'Access-Control-Allow-Origin) на моей консоли.Ниже мой запрос 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
        })
    });
}
...