How to make Yii2 (PHP) work with PHPSESSID when developing locally with Vue and Webpack?

Question

Yii

Essence. Still wanting to get simple Yii working with Vue. That is, do not write rest, do not use jwt with refresh tokens, do not set up subdomains. Etc. In this case, it's just a website and nothing more. At the same time, I would like to use webpack to immediately update the page after a change in the source code and other goodies. It's about local development. Currently php (yii2) is spinning in docker at
127.0.0.1:8000 .
The vue project ( quasar.js ) is a completely separate application - localhost:8080/# After the build, everything is assembled, copied to the right place in the Yii project, integrated into the base view . Yii does not notice that it is fooled, does not use its frontend with its pensioner forms and signs on the bootstrap, everything works as it should.
However, devServer webpack, although it launches the application, updates the code promptly, Alas, it does not receive a session in the application in php. The session is simply not created in the application. Of course, I tried setting up a proxy in webpack:

proxy: {
        '/': {
          target: 'http://127.0.0.1:8000',
          pathRewrite: {'^/': ''},
          changeOrigin: true,
          secure: false,
        }

without a proxy, requests do not work at all, they work with it, even some of the cookies come:

Cookie: XDEBUG_SESSION=PHPSTORM; csrftoken=pGnICOt7JvtQWQCJH3IBTuVti4BY9zwmi9d9Ip8WnY7q5iStlin4gPvxIcFa1kqu; _ga=GA1.1.1833168217.1577004843; gpr=true; _csrf=721KYaxSy6rOCGu9rLf30vfETmVrHkQU

But we want to use standard sessions so as not to bother with jwt , and here we see a complete epic fail. There is no session. That is, such a cookie PHPSESSID=15dd74539c9f9abd33d9451cb626fd23; available only in dreams ....
I understand that the question is specific, but what if? Any ideas are welcome!
Goodnight!

Answer 1

Solution: (I hope :) . )
During the build process, we place the ready-made css, fonts, js, statics folders in the web yii folder. The Yii index.php file should also be present there. The content of the resulting index.html build is placed in one of the empty Yii views. You also need to add <?= Html::csrfMetaTags() ?> there.
All of the above operations occur automatically during the build process and are performed by webpack. There, in general, you can write whatever you want. Copying, adding code to files And so on. The view we created is opened when our application starts.
After the above manipulations, in the body of the page where the SPA is located, there will be meta tags with srf :
<?= Html::csrfMetaTags() ?>
further, before starting Vue (for example in mounted() {.....} ) you need to extract the csrf from the page's meta tags and add it to axios.defaults.headers.common
This will work for an application that works in the usual way. The webpack version doesn't know anything about <?= Html::csrfMetaTags() ?> . Accordingly, we write a getToken action that returns csrf to us. This is necessary for development, so that the application works with webpack and its goodies.

public function actionGetToken()
    {
        return yii:: $app->getRequest()->getCsrfToken();
    }

This action does not require csrf (it is considered safe as it is GET ). Further, in vue (for example, in mounted() {.....} ), depending on ENV, when starting the application, we take csrf either from meta tags or by calling the getToken action. It works, but....
After we go through the authentication procedure, the session is updated and the old csrf turns into a pumpkin. It is also updated every time we load a new page. In this case, we have SPA and multiple loading of new pages does not threaten us. So the only thing that needs to be done is to update the csrf token immediately after authentication. I just return it as the result of a successful login.
Update axios.defaults.headers.common again with the current csrf , and that's it. Other requests signed with this token work fine.
The getToken action is only needed for local development and should be disabled in production.

Answer 2

Set an intersector for Achios on requests.
If there is no cookie you need, refer to the page that contains only the session start method, for example, login.