博客
关于我
centos下docker +nginx完成负载均衡vue项目
阅读量:247 次
发布时间:2019-02-26

本文共 1776 字,大约阅读时间需要 5 分钟。

Vue与普通Web项目部署对比

Vue项目与普通Web项目在部署方式上有一些不同之处。普通Web项目通常通过在不同Tomcat下部署,然后通过Nginx进行负载均衡。而Vue项目则需要在Nginx中配置负载均衡,将多个Nginx服务用于负载均衡。


搭建步骤说明

  • 安装Docker环境

    首先确保宿主机已经安装了Docker。

    curl -fsSL https://get.docker.com | bash -s docker
  • 拉取Nginx镜像

    打开Docker终端,拉取Nginx镜像:

    docker pull nginx
  • 宿主机准备挂载目录

    创建挂载目录:

    mkdir -p /home/docker-nginx/{html,conf,conf.d,logs}
  • 配置Nginx

    • conf.d目录下创建default.conf文件:
    echo "server {      listen 80;      server_name your_domain.com;      location / {          root /usr/share/nginx/html;          index index.html;      }      access_log off;  }" > /home/docker-nginx/conf.d/default.conf
    • 将配置文件挂载到容器:
    docker run -d --name mynginx -p 39002:80 \      -v /home/docker-nginx/html:/usr/share/nginx/html \      -v /home/docker-nginx/conf/nginx.conf:/etc/nginx/nginx.conf \      -v /home/docker-nginx/conf.d:/etc/nginx/conf.d \      -v /home/docker-nginx/logs:/var/log/nginx nginx
  • 部署前端项目

    将Vue项目打包后的dist文件夹复制到挂载目录/home/docker-nginx/html中即可。


  • 多Nginx负载均衡配置示例

    如果需要多个Nginx服务共享负载,可以在宿主机上运行多个容器,每个容器监听不同的端口。例如:

    • 容器1:
      docker run -d --name mynginx1 -p 39001:80 \      -v /home/docker-nginx/html:/usr/share/nginx/html \      -v /home/docker-nginx/conf/nginx.conf:/etc/nginx/nginx.conf \      -v /home/docker-nginx/conf.d:/etc/nginx/conf.d \      -v /home/docker-nginx/logs:/var/log/nginx nginx
    • 容器2:
      docker run -d --name mynginx2 -p 39003:80 \      -v /home/docker-nginx/html:/usr/share/nginx/html \      -v /home/docker-nginx/conf/nginx.conf:/etc/nginx/nginx.conf \      -v /home/docker-nginx/conf.d:/etc/nginx/conf.d \      -v /home/docker-nginx/logs:/var/log/nginx nginx

    测试访问

    • 访问主Nginx服务(39002端口):
      http://localhost:39002
    • 访问备用Nginx服务(39001或39003端口):
      http://localhost:39001http://localhost:39003

    注意事项

    • 确保挂载目录权限正确,避免权限错误。
    • 如果需要自定义域名,可以在Nginx配置中添加server_name指令。
    • 前端项目部署时,只需将dist文件夹复制到挂载目录即可,无需手动配置。

    转载地址:http://oxfk.baihongyu.com/

    你可能感兴趣的文章
    Vmware系列&虚拟机系列【仅供参考】:使用vCenter Auto Deploy制作ESXI系统封装(适合高版本vSphere)
    查看>>
    Openlayers中加载GeoJson文件显示地图
    查看>>
    Openlayers中加载Geoserver切割的EPSG:900913离线瓦片图层组
    查看>>
    Openlayers中加载Geoserver切割的EPSG:900913离线瓦片地图并显示
    查看>>
    Openlayers中多图层遮挡时调整图层上下顺序
    查看>>
    Openlayers中实现地图上打点并显示图标和文字
    查看>>
    Openlayers中实现地图上添加一条红色直线
    查看>>
    Openlayers中将某个feature置于最上层
    查看>>
    Openlayers中点击地图获取坐标并输出
    查看>>
    Openlayers中设置定时绘制和清理直线图层
    查看>>
    Openlayers入门教程 --- 万字长篇
    查看>>
    Openlayers各组件默认的css样式
    查看>>
    Openlayers图文版实战,vue项目从0到1做基础配置
    查看>>
    VM16+ubuntu20.04+win10如何固定虚拟机的ip (固定IP)
    查看>>
    OpenLayers学习一:地图加载(以类为接口)
    查看>>
    OpenLayers学习三:地图旋转及地图跳转到某一点的方式(以类为接口)
    查看>>
    OpenLayers学习二:点标记的添加删除和修改(以类为接口)
    查看>>
    Openlayers实战教程学习大纲及引导
    查看>>
    Openlayers实战:LayerGroup添加删除显示隐藏
    查看>>
    Openlayers实战:loadstart和loadend事件
    查看>>