M
M
massef2018-06-15 17:01:16
CORS
massef, 2018-06-15 17:01:16

Cross domain requests in Vue.js?

Hello. In order to learn vue, I'm trying to send a request to an external API from localhost.
The console swears at the Access-Control-Allow-Origin header
What and where should I write?
I tried to insert https://cors-anywhere.herokuapp.com/ before the request url, that is, the full request was like
https://cors-anywhere.herokuapp.com/https://domain...
this works, but with a large delay, well, not an option to leave it like that.
main.js

import Vue from 'vue'
import App from './App'
import router from './router'
import VueResource from "vue-resource"

Vue.use(VueResource)
Vue.config.productionTip = false;

new Vue({
  el: '#app',
  router,
  components: { App },
  template: '<App/>'
})

component.vue
export default {
    name: 'TestPage',
    data: () => ({
        users: [],
        error: []
    }),
    created: function () {
      let _this = this;

      this.$http.get('https://domain.com/api/').then(response => {
        console.log(response);
      }, response => {
        // error callback
      });

    },
    components: {
        MainLayout,
        Post
    }
  }

Answer the question

In order to leave comments, you need to log in

2 answer(s)
A
Alexander, 2018-06-15
@Dil0ng

On the backend, you can write something like this

header("Access-Control-Allow-Origin: http://localhost:8080");
header("Access-Control-Allow-Methods: POST,GET");
header("Access-Control-Allow-Headers: *");

R
Roman Kitaev, 2018-06-15
@deliro

The backend to which you send requests must allow you cross-domain requests. Such a browser security policy, which is why there are all sorts of JSONP crutches
. Google "CORS headers" - configure - you're done.

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question