I'm currently following the Vue JS 2 Tutorial #32 - HTTP Requests using vue-resource to connect to jsonplaceholder.typicode.com. If I don't use a proxy, it triggers a CORS error.
Here's my vue.config.js setup:
module.exports = {
devServer: {
proxy: {
'^/api': {
target: 'https://jsonplaceholder.typicode.com',
ws: true,
changeOrigin: true,
pathRewrite: { '^/api': '' }
}
}
}
}
When making an HTTP post request:
this.$http.post('/api/posts', {
userId: 1,
title: this.blog.title,
body: this.blog.content,
}).then(function (data) {
console.log(data)
});
The error that I encounter is:
XHR POST http://localhost:8080/api/posts [HTTP/1.1 404 Not Found 3ms]
I've attempted various solutions such as:
Vue.js - proxy in vue.config.js is being ignored
Vue proxy setting does not work
using axios and vue-resource
After trying different edits including:
Changing
'/api/post'to'/api/posts', but still facing issues.Switching from
'/api/posts'to
which resulted in another CORS error.'https://jsonplaceholder.typicode.com/posts'Adding
pathRewrite: { '^/api': '' }into the vue.config.json proxy configuration, yet the problem persists.Exploring solutions like Proxy changeOrigin setting doesn't seem to work, with no success.