vue打Docker镜像动态获取IP-nginx做的web服务

简介: vue打Docker镜像动态获取IP-nginx做的web服务

.首先编写启动脚本 start.sh

#!/bin/sh
sed -i  's@<html@<html  VUE_APP_URL=' "$VUE_APP_URL"'@' /usr/share/nginx/html/index.html
 
nginx -g "daemon off ;"

2.打docker镜像的Dockerfile

Dockerfile
FROM nginx:1.17.6
COPY .dist /usr/share/nginx/html
COPY ./start.sh /app/
EXPOSE 8080
WORKDIR /app
ENTRYPOINT ["/app/start.sh"]

3.vue的main.js配置中设置

const  VUE_APP_URL = document.querySelector("html").getAttribute("VUE_APP_URL");
console.log(`${VUE_APP_URL }`);
console.log(VUE_APP_URL );
 
console.log(process.env.VUE_APP_URL )


相关文章
|
2天前
|
应用服务中间件 网络安全 nginx
快速上手!使用Docker和Nginx部署Web服务的完美指南
快速上手!使用Docker和Nginx部署Web服务的完美指南
|
26天前
|
前端开发 应用服务中间件 nginx
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
Nginx配置详解Docker部署Nginx使用Nginx部署vue前端项目
101 0
|
1月前
|
前端开发 应用服务中间件 nginx
使用Docker快速搭建Web服务器Nginx
本文指导如何使用Docker快速搭建Nginx服务器。首先,通过`docker pull`命令获取Nginx镜像,然后以容器形式运行Nginx并映射端口。通过挂载目录实现本地文件与容器共享,便于自定义网页。使用`docker ps`检查运行状态,访问IP:8088确认部署成功。最后,介绍了停止、删除Nginx容器的命令,强调Docker简化了服务器部署和管理。
51 0
|
应用服务中间件 Linux Shell
Docker基础 docker创建centos7容器然后安装配置Nginx,并在浏览器访问
docker 在容器里下载配置nginx,并可在浏览器上访问的方法, 并将容器转为镜像,或将容器转为文件,再将文件转为镜像的两种方式,创建容器时绑定端口的方法,
Docker基础 docker创建centos7容器然后安装配置Nginx,并在浏览器访问
|
应用服务中间件 Linux 网络安全
部署一个网页Docker+Nginx
在docker中运行一个nginx容器,部署一个网页
643 0
部署一个网页Docker+Nginx
|
1月前
|
Kubernetes 负载均衡 应用服务中间件
Ingress Nginx 安装【亲测可用】
Ingress Nginx 安装【亲测可用】
113 2
|
1月前
|
前端开发 应用服务中间件 nginx
Docker安装nginx和基本配置
Docker安装nginx和基本配置
138 0
|
7月前
|
应用服务中间件 nginx Docker
在 Docker 中部署 Nginx 并挂载配置文件
在 Docker 中部署 Nginx 并挂载配置文件
|
3月前
|
应用服务中间件 nginx Docker
docker安装nginx并暴露端口
【1月更文挑战第9天】docker安装nginx并暴露端口
149 0
|
3月前
|
前端开发 应用服务中间件 nginx
Docker 安装 Nginx 部署前端项目
Docker 安装 Nginx 部署前端项目
310 1