Angular Sanctum Session-base Cross Domain CSRF Cookie

user_4955486 0
Viewed 265

I'm trying to make an SPA app with Angular 10 for front-end and sanctum + Fortify for back-end

I managed to make the login on localhost

but when I'm working with my team we are working on local host network

ex.

192.168.43.68:4200 is angular app 

192.168.43.74:8000 is Laravel app

I have no idea how to test these app

and I'm looking for correct config for .env, sesssion.php, sanctum.php and foritfy.php

or if proxy is need for angular app to automatically Laravel makes the cookies your help would be appreciated.

laravel-sanctum angular laravel fortify csrf
1 Answers

After a while playing around with the problem I have managed to solve it

to test this app in dev mode you must create a proxy file beside your angular.json with the name of proxy.conf.json

then inside this file set up the URLs that must be proxied(in my case I want to proxy all URL starting with /api and /sanctum for csrf)

{
    "/sanctum/*": {
        "target": "http://192.168.43.74:8000/",
        "secure": false,
        "changeOrigin": true,
        "logLevel": "debug",
        "pathRewrite": {
            "^/api": ""
        }
    },
    "/api/*": {
        "target": "http://192.168.43.74:8000/",
        "secure": false,
        "changeOrigin": true,
        "logLevel": "debug",
        "pathRewrite": {
            "^/": ""
        }
    }
}

then import this proxy in angular.json under Architect->serve->option like this

 "options": {
            "browserTarget": "fuse:build",
             "proxyConfig": "proxy.conf.json"
            }

then your can run the project with this command

ng serve --proxy-config proxy.conf.json

or for ease of use you can put it in the Package.json in start

"start": "ng serve --proxy-config proxy.conf.json"

and run your server with npm start

user_49554860
Related