如何编写脚本自动化启动Angular与Django后端Docker容器
我来帮你搞定这个自动化启动的问题!最简洁可靠的方式是用一个统一的Docker Compose配置文件来管理你的Angular前端和Django后端容器,这样你只需要一条命令就能同时启动两者,还能自动处理容器间的网络通信和启动依赖。
步骤1:整合Docker Compose配置
把你的前端和后端服务都放到同一个docker-compose.yml文件里,Compose会自动创建共享网络,让前端容器能直接访问后端服务。下面是完整的配置:
version: '3' services: # Django后端服务 web: build: ./django-backend # 替换为你的Django项目实际目录路径 command: bash -c "python manage.py makemigrations && python manage.py migrate && python manage.py runserver 0.0.0.0:8000" container_name: app_service volumes: - ./django-backend:/app_service # 本地代码映射到容器内,方便开发调试 ports: - "8000:8000" networks: - app-network # Angular前端服务 angular: build: ./angular-frontend # 替换为你的Angular项目实际目录路径 container_name: av-app-multistage ports: - "80:80" # Nginx默认80端口,映射到本地80端口方便访问 depends_on: - web # 指定依赖后端服务,Compose会优先启动后端 networks: - app-network # 定义共享网络,确保两个容器能互相通信 networks: app-network: driver: bridge
步骤2:调整Angular的API访问地址
因为两个容器在同一个Compose网络里,你可以直接用后端服务名web来访问API(不用localhost或IP)。打开Angular项目的src/environments/environment.ts(生产环境用environment.prod.ts),修改API地址:
export const environment = { production: false, apiUrl: 'http://web:8000/api/' // 用服务名代替localhost };
这样Angular应用就能在容器内正确访问到Django后端了。
步骤3:一键启动所有服务
在存放这个docker-compose.yml的目录下,运行以下命令:
# 第一次运行或修改Dockerfile后,构建镜像并启动容器 docker-compose up --build # 后续启动已构建好的镜像,直接用 docker-compose up
这条命令会自动完成:
- 构建(如果需要)Django和Angular的镜像
- 先启动
app_service后端容器 - 再启动
av-app-multistage前端容器 - 自动配置好两者的网络通信
如果需要后台运行容器,添加-d参数:
docker-compose up -d
停止服务时运行:
docker-compose down
备选方案:Shell脚本启动(不推荐)
如果你一定要用Shell脚本而非Docker Compose,也可以实现,但这种方式需要手动处理网络和启动顺序,可靠性较差。示例脚本如下:
#!/bin/bash # 启动Django后端容器 echo "启动Django后端容器..." docker run -d --name app_service -p 8000:8000 -v $(pwd)/django-backend:/app_service 你的Django镜像名 # 简单延迟等待后端服务启动(不够精准,仅作示例) sleep 10 # 启动Angular前端容器,并连接到后端网络 echo "启动Angular前端容器..." docker run -d --name av-app-multistage -p 80:80 --network container:app_service 你的Angular镜像名
注意:需要替换脚本中的镜像名称,且--network方式不如Compose的网络管理灵活,因此更推荐使用前面的Docker Compose方案。
内容的提问来源于stack exchange,提问作者aditya singh




