0
Cho mmình hỏi chút về Vuejs Cors
Mình đang có một ứng dụng viết bằng vuejs bình thường. Mình có gọi API từ một domain khác những cứ bị gp lỗi cors. Đã tìm google mà chưa thấy cách giải quyết. Mong các bạn có thể giúp mình với ạ
methods: {
submit () {
axios.post(`https://xxx/api`)
.then((res) => {
console.log(res);
}).catch((err) => {
console.log(err.response);
});
}
}
Thêm một bình luận
5 CÂU TRẢ LỜI
mình dung java Springboot và Vue2 bạn ạ
+1
Bạn cần add domain phía app chạy vuejs vào header của server API. Ví dụ nếu server API dùng Nginx thì bạn có thể add như sau vào config của Nginx:
add_header 'Access-Control-Allow-Origin' "<domain_client>" always;
0
Nếu bạn có server backend của bạn thì bạn có thể xử lý call API từ domain khác lấy dữ liệu rồi sau đó từ app vue của bạn, bạn call api từ server của bạn vừa xử lý chứ không call trực tiếp API ở một domain khác ở frontend nữa
0
Khi browser tạo XHR request tới API ở domain khác thì request sẽ bị trình duyệt block nhằm tránh các đoạn JS giả mạo.
Khi đang develop thì bạn có thể cài extension https://chrome.google.com/webstore/detail/moesif-origin-cors-change/digfbfaphojjndkpccljibejjbppifbc để browser không block XHR request. Tuy nhiên, khi deploy lên production thì server của bạn cần whitelist cho domain có chạy Vue.js bằng cách response kèm header:
Access-Control-Allow-Origin: https://foo.example
Với foo.example là domain của website chạy ứng dụng Vue.js của bạn.
Bạn nên đọc thêm về nó để hiểu hơn nhé https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS.
Nếu bạn không có quyền access hoặc không có kinh nghiệm update header phía backend hoặc chỉ muốn test thì có thể dùng nhưng proxy trung gian như https://cors-anywhere.herokuapp.com/ để bypass nhé
