React and Yii2 connection error - No 'Access-Control-Allow-Origin' header is present on the requested resource

Question

I tried million of different examples I found on the internet.

But I still can't do it :(

Here is my REST controller:

<?
namespace app\controllers\admiral_api;

use yii\rest\Controller;

class MainPageController extends Controller {

    public function actionIndex() {
        return 'test';
    }

}
?>

I figured out I need to enable this 'Access-Control-Allow-Origin' via CORS filter on server side with Yii2. And it still doesn't work no matter what I tried.

Do you have any examples that work for you in this situation? Thank you!

Answer 1

You need to add Origin in Controller behaviors method.

public function behaviors() {
        return [
            'corsFilter' => [
                'class' => \yii\filters\Cors::className(),
                'cors' => [
                    // restrict access to
                    'Origin' => (YII_ENV_PROD) ? [''] : ['http://localhost:3000', 'http://your.store.com'],
                    // Allow only POST and PUT methods
                    'Access-Control-Request-Method' => ['GET', 'HEAD', 'POST', 'PUT'],
                    // Allow only headers 'X-Wsse'
                    'Access-Control-Request-Headers' => ['X-Wsse', 'Content-Type'],
                    // Allow credentials (cookies, authorization headers, etc.) to be exposed to the browser
                    'Access-Control-Allow-Credentials' => true,
                    // Allow OPTIONS caching
                    'Access-Control-Max-Age' => 3600,
                    // Allow the X-Pagination-Current-Page header to be exposed to the browser.
                    'Access-Control-Expose-Headers' => ['X-Pagination-Current-Page'],
                ],
            ],
        ];
    }