博客
关于我
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/

    你可能感兴趣的文章
    Postman还能做Mock?又学了一招!
    查看>>
    postman进行http接口测试
    查看>>
    Postman高阶技能:Collection集合批量运行!
    查看>>
    postMessage跨标签页共享数据
    查看>>
    QImage对一般图像的处理
    查看>>
    post为什么会发送两次请求?
    查看>>
    Post表单提交TextArea的值出现转译乱码问题 - Spring MVC处理表单提交
    查看>>
    Power BI 中的 Python 可视化需要什么设置?任何特定的 matplotlib 包版本或系统设置?
    查看>>
    Power BI:如何在 Power Query 编辑器中将 Python 与多个表一起使用?
    查看>>
    power english (3) main text -emotion mastery - focus
    查看>>
    POWER ENGLISH (6) - MODEL
    查看>>
    power english (1) —— passion
    查看>>
    Power English (1) 原文
    查看>>
    power English (3)原文
    查看>>
    POWER ENGLISH(7)- repetition
    查看>>
    SpringBoot中集成SpringBatch详细解析与实战示例(CSV文件读取十万条数据进行业务处理后写入Mysql数据库)
    查看>>
    powerbi 一张表在另外一张表中出现的数量_PowerBi之初步学习笔记
    查看>>
    QGIS怎样设置简体中文以及新建可编辑的多边形的图层
    查看>>
    PowerBuilder 使用自定义事件触发键盘Enter事件
    查看>>
    PowerCreatorCMS UploadResourcePic 任意文件上传漏洞复现
    查看>>