小编Ste*_*ris的帖子

axios、nuxt 和 docker 的奇怪行为

我正在设置一个全栈应用程序,其中 nuxt js 运行我的客户端代码,express js 运行我的 api,mysql 作为我的数据库。为了运行所有这些进程,我一直在使用 docker,更具体地说是 docker-compose。经过大量配置后,我已经让所有三个映像一起运行。但有一个问题,我不知道如何使用 nuxt/axios 调用我的 api。

我尝试了很多不同的策略。我的 Express api 可供“外部世界”使用http://localhost:8080,因此我设置了 axiosbaseURL来反映这一点。我在一些 nuxt js 中间件中运行了一些测试 axios gets ,并不断收到连接拒绝错误。我终于发现我可以使用 docker-compose 网络来连接我的前端和后端,所以我将我的 axios 重新映射baseURLhttp://api:8080(api 是我的 docker-compose 映像的名称),并且在 nuxt js 中间件的 axios 请求中,它就像魅力一样。后来我在写一些代码,想用vue方法发送axios请求。尽管中间件中的 axios 请求正在处理此问题baseURL,但该方法中的新 axios 请求给出了错误

commons.app.js:434 选项http://api:8080/api/v1/get/colors net::ERR_NAME_NOT_RESOLVED

我尝试将 axios baseURL 更改回 localhost,现在方法中的 axios 请求可以工作,但中间件中的 axios 请求不起作用。

docker-compose.yml

version: "3.3"

services:
  mysql:
    container_name: mysql
    image: mysql:5.7
    environment:
      MYSQL_USER: ${MYSQL_DEV_USER}
      MYSQL_PASSWORD: ${MYSQL_DEV_PASSWORD}
      MYSQL_DATABASE: ${MYSQL_DEV_DATABASE}
      MYSQL_ROOT_PASSWORD: …
Run Code Online (Sandbox Code Playgroud)

vue.js docker-compose axios nuxt.js

5
推荐指数
1
解决办法
4217
查看次数

标签 统计

axios ×1

docker-compose ×1

nuxt.js ×1

vue.js ×1