Nuxt 无法使用 docker-compose 访问 asyncData 上的服务器

Question

I've created this boilerplate https://github.com/sebalaini/laravel_docker-compose that I'm using on another project and I'm unable to fetch data with asyncData it returns

Error: connect ECONNREFUSED 127.0.0.1:80
    at TCPConnectWrap.afterConnect [as oncomplete] (net.js:1146:16) {
  errno: -111,
  code: 'ECONNREFUSED',
  syscall: 'connect',
  address: '127.0.0.1',
  port: 80,
  ...

My code looks like this:

  async asyncData ({ $axios, store, req }) {
    const userEmail = 'mail@mail.com'

    await $axios
      .post(`${process.env.BASE_API_URL}/profilepage`, {
        email: userEmail
      })
      .then((resp) => {
        store.commit('setUser', resp.data.user)
      })
      .catch((error) => {
        console.log(error)
      })
  },

the BASE_API_URL it's BASE_API_URL=http://localhost/api I've tried also with http://webserver:80/api/profilepage but no luck.

How can I fix it and be able to fecth data also on the server side? As you can see I have a redirect on the webserver service that points to the Laravel container if match api|storage https://github.com/sebalaini/laravel_docker-compose/blob/master/LOCAL/nginx/nginx.conf#L126

Answer 1

I solved the problem even though TBH I don't get the logic. in the docker-compose.yml I have changed port 80:81 in 80:80 and the nginx.conf to use 80 instead of 81 and now I can use http://webserver/api/... and access the endpoint when on the server side.