Here you will learn how to use Laravel Breeze and Cookie.
- Install Laravel
- Install Laravel Breeze startup kit
- Add below line of codes in your .env file
Copy to Clipboard
1
APP_URL=http://localhost:80002
FRONTEND_URL=http://localhost:30003
SESSION_DOMAIN=localhost4
SANCTUM_STATEFUL_DOMAINS=localhost:3000Remember that top level domain should be same for your Laravel and your SPA application. e.g. localhost.
In your frontend application e.g. Vue.js, remember to send these parameters:
Copy to Clipboard
x
1
import axios from 'axios'2
3
export const client = axios.create({4
baseURL: 'http://localhost:8000/',5
withXSRFToken: true,6
withCredentials: true,7
})Now you will have a working backend and frontend cookie for authentication.
If you are using Postman for APIs, then remember to do these steps in your Postman.
- Create environment in your workspace:
| Variable | Type | Initial value | Current value |
|---|---|---|---|
| base_url | default | http://localhost:8000 | http://localhost:8000 |
| frontendUrl | default | http://localhost:3000 | http://localhost:3000 |
| XSRF-TOKEN | default |
- In
Pre-request Scriptsof your collection add below:
Copy to Clipboard
14
1
const jar = pm.cookies.jar();2
3
jar.get(pm.environment.get("frontendUrl"), "XSRF-TOKEN", (err, cookie) => {4
console.log(err, cookie, pm.environment.get("frontendUrl"))5
pm.request.addHeader({6
key: "X-XSRF-TOKEN",7
value: cookie8
});9
10
pm.request.addHeader({11
key: "origin",12
value: pm.environment.get("frontendUrl")13
});14
});Now you have successfully create a Laravel and Vue.js project. Also you can test your APIs in Postman.
Leave A Comment