In the Vue cli project, where to place the Laravel api application and how to call api in vue js?

Question

vue is inside: C:\xampp\htdocs\booking

Laravel api inside: C:\xampp\htdocs\booking-api

FYI: vue application is working on http: // localhost: 8080

If the folder structure is similar to the above, then the application works fine, I can call api like this,

axios.get('http://localhost/booking-api/public/Rooms').then((response)=>this.items = response.data);

But I want a folder booking-apiinside the folder booking. If I put it, and if I call api as shown below,

axios.get('/booking-api/public/Rooms').then((response)=>this.items = response.data);

This will not work, and the console window will be such

Request URL:http://localhost:8080/booking-api/public/Rooms
Request Method:GET
Status Code:404 Not Found

So, how can I place the project apiinside the application vueand how to call api from vue.

Answer 1

, , vue.js - . .

1. vue.js, npm run dev
2. npm run dev vue localhost:8080

api-

1. , . laravel, , , php artisan serve. 127.0.0.1 localhost:8000.

2. , : axios.post('localhost:8000/api/postData',data).then((response) => {//do something here}

Cross Origin, csrf, .