Docker编写SSR应用程序、服务器请求和浏览器请求
我正在执行以下部署(docker compose),其中包括一个带有Nuxt(SSR)的前端和一个带有Django的后端: 部署Docker编写SSR应用程序、服务器请求和浏览器请求,docker,docker-compose,axios,nuxt.js,server-side-rendering,Docker,Docker Compose,Axios,Nuxt.js,Server Side Rendering,我正在执行以下部署(docker compose),其中包括一个带有Nuxt(SSR)的前端和一个带有Django的后端: 部署 version: '3' services: backend: restart: always build: ./task_processor_back expose: - "8000" env_file: .env command: /usr/local/bin/gunicorn task
version: '3'
services:
backend:
restart: always
build: ./task_processor_back
expose:
- "8000"
env_file: .env
command: /usr/local/bin/gunicorn task_processor.wsgi:application -w 2 -b :8000
frontend:
restart: always
build: ./task_processor_front
expose:
- "3500"
depends_on:
- "backend"
links:
- backend
command: npm start
// store/index.ts
import { Dispatch } from 'vuex';
export const actions = {
async nuxtServerInit({ dispatch }: { dispatch: Dispatch }) {
await dispatch('tasks/fetchTasks', true); #ends with a call to Axios
}
};
我正在使用通过Axios调用后端API的nuxtServerInit函数
NuxtServerInit
version: '3'
services:
backend:
restart: always
build: ./task_processor_back
expose:
- "8000"
env_file: .env
command: /usr/local/bin/gunicorn task_processor.wsgi:application -w 2 -b :8000
frontend:
restart: always
build: ./task_processor_front
expose:
- "3500"
depends_on:
- "backend"
links:
- backend
command: npm start
// store/index.ts
import { Dispatch } from 'vuex';
export const actions = {
async nuxtServerInit({ dispatch }: { dispatch: Dispatch }) {
await dispatch('tasks/fetchTasks', true); #ends with a call to Axios
}
};
其他Axios呼叫
// store/task.ts
@Action
async sendReply(reply: Reply) {
return new Promise((resolve, reject) => {
TaskProcessor.sendReply(reply)
.then(() => resolve())
.catch(() => reject());
})
}
问题在于,当它通过docker compose部署时,它会创建一个名为的网络,通过该网络它可以与其他部署的资源(docker)通信。我意识到SSR(服务器)部分的所有调用,如nuxtServerInit函数,都必须通过所述网络在内部完成,而在浏览器中执行的javascript函数的调用必须在外部网络中完成。以上我的意思是:
numxt.config.js
Internal: axios: { baseURL: 'http://backend:8000' } //backend = resource name in docker-compose
External: axios: { baseURL: 'http://localhost:8000' }
我可以验证这一点,因为如果我离开内部配置,它会从nuxtServerInit函数成功调用,但当我从浏览器调用时,它不会。否则,如果我离开外部配置(并注释nuxtServerInit函数),它将从浏览器正常工作
我如何在docker compose中处理这两个场景