В настоящее время я пытаюсь передать свои запросы из моего приложения Vue, чтобы я мог отправлять файлы cookie с сервера, который существует отдельно от моего внешнего интерфейса.
У меня есть интерфейс на порту 8080 и сервер на порту 3000. Однако, когда я пытаюсь настроить свой прокси для использования порта 3000 в Vue с помощью devServer.proxy, он все еще отправляет запрос на 8080.
Вот мой код в vue.config.js:
module.exports = {
devServer: {
proxy: {
'/api': {
target: 'https://localhost:3000',
ws: true,
changeOrigin: true
}
}
}
}
Вот мой запрос axios:
axios.post(`/api/auth/login/`, loginDetails, {
withCredentials: true,
credentials: 'include'
})
.then(function (response) {
console.info('login response: ', response)
})
.catch(error => {
console.error(error)
});
Вот ошибка, которую я получаю, которая показывает, что интерфейс все еще отправляет на 8080:
Я также пытался использовать следующее в vue.config.js и не имел префикса к URL-адресу запроса, но безрезультатно.
module.exports = {
devServer: {
proxy: 'http://localhost:3000'
}
}
Вот документация, которую я использую https://cli.vuejs.org/config/#devserver
🤔 А знаете ли вы, что...
Node.js активно использует асинхронное программирование и обратные вызовы для обработки многозадачности.
Решение:
Изучив журналы сервера, я обнаружил, что прокси-сервер работает и пытается найти маршрут /api/auth/login на моем сервере. Однако у меня был только /auth/login, поэтому сервер отправил статус 404.
Я не уверен, что это правильный способ сделать это, но я просто добавил маршрут сервера с помощью /api, и это сработало так:
app.use('/api/auth', authRouter)
Раньше это выглядело так:
app.use('/auth', authRouter)
Спасибо Estus Flask за советы в комментариях.