Posting data using Axios Api in Vue Posting data using Axios Api in Vue vue.js vue.js

Posting data using Axios Api in Vue


You are using absolute URL's. There are two ways you can handle this.

  • Configure your server to handle CORS Headers
  • Configure a local reverse-proxy using a tool like webpack-dev-server or nginx.

If you choose the second, which is recommended over the other, your code will be like this:

axios          .post("/api/todos", _todo)          .then(res => (this.todos = [...this.todos, res.data]))

And in your reverse-proxy, made possible by webpack-dev-server:

module.exports = {  //...  devServer: {    proxy: {      '/api': 'https://jsonplaceholder.typicode.com'    },    secure: true  }};

More on this: