linux docker如何同时部署nginx和nuxt，80和443端口指向nuxt的3000端口_nginx +nuxt

作者：很楠不爱3 | 2024-03-04 06:26:40

踩

nginx +nuxt

先看效果

首页 - 嗨撩聊天回复话术 (liaotianhuifu.com)

背景：博主是个小白，想访问域名的时候，指向nuxt项目

问题：http默认端口是80，https默认端口是443，而nuxt项目默认端口是3000

方案一：docker分别部署nginx和nuxt，然后利用nginx代理转发到nuxt


 server {
        listen       80;
        listen  [::]:80;
        server_name  localhost;
        location / {
           # 第一种，利用内网127.0.0.1访问
             proxy_pass http://127.0.0.1:3000;
           # 第二种，利用外网网1ip访问 但是此种会绕到服务商，会收流量费
             proxy_pass http://xx.xx.xx.xx:3000;
        }
    }

方案二：docker同时部署nginx和nuxt，

1、yml文件


version: "3"
 
services:
  nginx2:
    image: nginx
    restart: always
    container_name: nginx2
    hostname: nginx
    ports:
      - 80:80
      - 443:443
    volumes:
      - /data/nginx/conf:/etc/nginx
      - /data/nginx/logs:/var/log/nginx
      - /data/nginx/html:/usr/share/nginx/html
  service_nuxt2:
    image: nuxt:v1 
    container_name: nuxtapp2
    # 构建自定义命令
    build:
      context: ./  #指定dockerfile文件的所在路径
    ports:
      - "3000:3000"
    environment:
      TZ: Asia/Shanghai

2、dockerfile文件


FROM node-pm2:v14.15.0 
 
RUN mkdir -p /app
 
WORKDIR /app
 
ADD ./.output/ /app/
 
EXPOSE 9000
 
CMD ["pm2 start --no-daemon"]
 
ENTRYPOINT ["/bin/bash","-c"]

3、nginx配置


server {
        listen       80;
        listen  [::]:80;
        server_name  localhost;
        location / {
           # 映射到nuxt3项目
            proxy_pass http://service_nuxt2:3000; # 内网地址
           # return 403;
        }
    }
    
    server {
        #SSL 访问端口号为 443
        listen 443 ssl; 
        #填写绑定证书的域名
        server_name www.liaotianhuifu.com; 
        #证书文件名称
        ssl_certificate scs1683375126842_www.liaotianhuifu.com_server.crt; 
        #私钥文件名称
        ssl_certificate_key scs1683375126842_www.liaotianhuifu.com_server.key; 
        ssl_session_timeout 5m;
        #请按照以下协议配置
        ssl_protocols TLSv1.2 TLSv1.3; 
        #请按照以下套件配置，配置加密套件，写法遵循 openssl 标准。
        ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE; 
        ssl_prefer_server_ciphers on;
        location / {
           #网站主页路径。此路径仅供参考，具体请您按照实际目录操作。
           #例如，您的网站运行目录在/etc/www下，则填写/etc/www。 容器内的路径
           proxy_pass http://service_nuxt2:3000; # 内网地址
        }
}

此处遇到了两个坑，第一，docker 镜像重启命令

docker-compose -f nuxt3_and_nginx.yml up -d --build

由于之前没有加build，导致一直没有生效

docker使用node-pm2部署nuxt

1、执行docker load -i node-pm2.tar这个后，会在本机加载一个镜像，这个镜像是dockerfile的基础镜像


docker load -i node-pm2.tar
 
# 重命名
docker tag 10.5.11.11:5000/library/node-pm2:v14.15.0 node-pm2:v14.15.0
 
# 删除镜像
docker image rm 10.5.11.11:5000/library/node-pm2

2、然后执行docker build -t nuxt:v1 -f Dockerfile ./，会产生一个新镜像

docker build -t nuxt:v1 -f Dockerfile ./

3、docker-compose运行dockfile

docker-compose -f xx.yml up -d --build

声明：本文内容由网友自发贡献，不代表【wpsshop博客】立场，版权归原作者所有，本站不承担相应法律责任。如您发现有侵权的内容，请联系我们。转载请注明出处：https://www.wpsshop.cn/w/很楠不爱3/article/detail/186708?site