Vue.js，对Laravel API的Axios多个get CORS请求随机失败

Question

I have this problem - on Vue component created life cycle hook I am making 2 CORS get requests via Axios to external Laravel API. If I make only one of the requests everything is fine and it works 100% of the time. But if I make 2 or more requests I sometimes get failed requests on random in the network tab. Obviously I am doing something wrong with Axios. Can you please help me.

This is my component created hook - I call VueX actions.

 created () { this.$store.dispatch('getPets'); this.$store.dispatch('getSpecies'); }, 

And this are my actions in VueX store

 actions: { getPets(context) { return new Promise((resolve, reject) => { axios.get('api/pets') .then(response => { context.commit('SET_PETS', response.data); context.commit('SET_SELECTED_PET', response.data.data[0]); resolve(response); }) .catch(error => { reject(error); }); }); }, getSpecies(context) { return new Promise((resolve, reject) => { axios.get('api/species') .then(response => { context.commit('SET_SPECIES', response.data); resolve(response); }) .catch(error => { reject(error); }); }); }, setSelectedPet(context, pet) { context.commit('SET_SELECTED_PET', pet); }, } 

Then I get failed requests on random - sometimes both requests are ok (200 status), other times one of them is failing... Requests

The request is failed - there is no response, I think that the request does not go to the Laravel API at all. Laravel logs are empty too.

I think I am doing something wrong with Axios, because its not from my browser or firewall - I have stopped firewall and tested in incognito and other browsers without any extensions. Any help will be appreciated.

This are the Axios headers I set up in the main js file.

 // Set axios to call the backend API and set its headers on every page reload window.axios = require('axios'); window.axios.defaults.baseURL = 'http://api.aaa'; window.axios.defaults.timeout = 30000; window.axios.defaults.headers.common = { 'X-Requested-With': 'XMLHttpRequest', 'Accept': 'application/json', 'Content-Type': 'application/json', 'Authorization': 'Bearer '+getToken(), }; 

Answer 1

Ok, after some time I finally figured it out. It was the PHP opCache that was causing this behavior. If you have the similar problem just turn opChache off.

Btw can you give me your thoughts about what can cause this behavior from Laravel because I dont want to lose opCache as an option for similar Laravel projects?