Прокси в Vue CLI для AXIOS
Ситуация такая:
У меня запущено два модуля:
- Бэкэнд на
http://my.local:9091/etl/api/v1 - Фронтэнд на
http://my.local:8080
Я из фронта хочу делать запросы на бэк, но из-за CORS мне это надо делать через прокси. Но прокси почему-то не работают. Фронт пишу на Vue CLI.
vue.config.js:
module.exports = {
outputDir: 'target/dist',
assetsDir: 'static',
devServer: {
disableHostCheck: true,
host: 'my.local',
port: 8080,
https: false,
proxy: {
'/etl': {
target: 'http://my.local:9091',
ws: true,
changeOrigin: true
}
}
}
}
axios импортирую из файлa http-commons.js:
import axios from 'axios'
export const AXIOS = axios.create({
baseURL: `/etl/api/v1`,
headers: {
'Access-Control-Allow-Origin': 'http://localhost:8080'
}
})
И в Компонентах использую его так:
<script>
import {AXIOS} from '../../http-commons'
export default {
data() {
return {
title: "",
url: "",
port: 0,
response: ""
}
},
methods: {
addSource() {
console.log(this.title + " " + this.url + " " + this.port)
AXIOS.post(`sources`, {
sources: [
{
title: this.title,
url: this.url,
port: this.port
}
]
}).then(response => {
this.response = response.data
}).catch(e => {
this.response=e
})
}
}
}
</script>
Где я могу ошибаться или как лучше делать запросы на апи в бэке? Нужен вариант именно с прокси.