jjzjj

【Docker】docker+Nginx部署前端项目

程序媛小y 2024-05-08 原文

【Docker】docker+Nginx部署前端项目

文章目录

相关配置安装

安装Docker

 yum install docker

启动服务 start docker

systemctl start docker

Docker中拉取nginx镜像

docker pull nginx

创建配置文件

我们需要在根目录下创建Dockerfile文件和default.conf文件。

其中default.conf文件的名称是什么无所谓，只要在配置文件中注意使用相同名称即可。

Dokcerfile文件具体内容如下：

FROM nginx:latest

# 将项目根目录下dist文件夹下的所有文件复制到镜像中 /usr/share/nginx/html/ 目录下
COPY dist/ /usr/share/nginx/html/
COPY default.conf /etc/nginx/conf.d/default.conf

  • FROM nginx:latest: 命令的意思该镜像是基于 nginx:latest 镜像而构建的。

  • COPY dist/ /usr/share/nginx/html/ :命令的意思是将项目根目录下 dist 文件夹下的所有文件复制到镜像中 /usr/share/nginx/html/ 目录下。

    这里镜像中的目录我们不要动，但需要保证我们项目的打包目录是dist/，或者自定义到你打包的目录下。

  • COPY default.conf /etc/nginx/conf.d/default.conf 命令的意思是将 Nginx 目录下的 default.conf 复制到 etc/nginx/conf.d/default.conf，用本地的 default.conf 配置来替换 Nginx 镜像里的默认配置。

    这里镜像中的目录我们不要动，但需要保证我们编写的文件名也为default.conf，或者与你自己写的文件名对应


default.conf

下面的配置直接照抄就好，特别注意，监听的端口号并不需要动，这里的80端口指的是容器的端口，最后我们会将容器的端口映射到我们宿主服务器的端口，比如映射到8888端口。

8888:80
  • 然后 注意修改为自己的服务器IP地址

完整配置：

upstream my_server{
  server 121.41.4.33:3000; # 后端server 地址
  keepalive 2000;
}

server {
    listen       80; #这里的端口号不要动，80端口指的是容器的端口，最后我们会将容器的端口映射到我们宿主服务器的端口，比如映射到8888端口
    server_name  111.20.xxx.xxx; # 修改为docker服务宿主机的ip/域名
    
    #charset koi8-r;
    access_log  /var/log/nginx/host.access.log  main;
    error_log  /var/log/nginx/error.log  error;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
        try_files $uri $uri/ /index.html =404;
    }
     #  这里就是和vue本地代理的意思一样，已api开头的路径都代理到本机的3000端口
    location /api/ {
        proxy_pass http://my_server/api;
        proxy_set_header Host $host:$server_port;
        rewrite ^/api/(.*) /$1 break;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   html;
    }
    
}

项目打包与部署

将打包项目，把dist文件夹和刚刚创建的Dockerfile,default.conf放到同一目录，并上传到服务器。

比如，我的代码存放位置是/home/test目录。

然后需要构建镜像

docker build -t test .

docker build -t我们并不需要动，

后面的test是我们构建的镜像的名称，.代表需要进行构建的代码的存放位置，这里是.是因为我当期所在目录就是/home/test，并且我的项目的三个文件就位于/home/test目录下。

如果我们此时位于其他目录，当前目录下没有要进行镜像打包的文件，那就需要更改路径。

比如：

dokcer build -t test /home/test

然后使用dokcer images可以查看我们已经存在的镜像


镜像构建好后，我们就可以拿这个镜像启动一个容器

docker run -d -p 8888:80 --name test-image test
  • -d 后台方式运行
  • -p 8888:80 端口映射，将宿主的8888端口映射到容器的80端口
  • –name 容器名 镜像名

然后我们可以使用docker ps查看当前正在运行的容器

并且使用IP地址和端口号访问当前的项目


注意

上面我们进行了端口映射，那就需要在服务器中开启要使用的端口，

我们可以在云服务器中的安全组进行设置。

或者使用命令设置

查看已开放端口命令：firewall-cmd --list-all

  • 查看防火墙状态：active (running) 即是开启状态

    systemctl status firewalld

  • 查看已开发端口命令：firewall-cmd --list-all

  • 新增防火墙开放端口：

    firewall-cmd --zone=public --add-port=3306/tcp --permanent

  • 开放端口后需要重新加载防火墙：

    firewall-cmd --reload

一些相关指令

如果我们不再需要这个容器和镜像，

首先需要先停止这个容器，然后在移出容器和镜像。

首先拿docker ps找到指定容器的ID，

使用docker stop [ID] 停止容器

docker rm [ID] 移除容器

然后拿docker images查看已存在的镜像ID，

使用docker rmi [ID] 移除镜像

可能我们的docker没有设置开机启动：

systemctl start docker # 启动docker
systemctl status docker # 查看docker的运行状态

一个相关报错：关于：Cannot connect to the Docker daemon at unix:///var/run/docker.sock. Is the docker daemon running?


后续，我们将使用docker和github actions实现自动化部署。

Dockerspanclasstokennginx前端

有关【Docker】docker+Nginx部署前端项目的更多相关文章

  1. ruby - 如何在 buildr 项目中使用 Ruby 代码？ - 2

    如何在buildr项目中使用Ruby？我在很多不同的项目中使用过Ruby、JRuby、Java和Clojure。我目前正在使用我的标准Ruby开发一个模拟应用程序，我想尝试使用Clojure后端(我确实喜欢功能代码)以及JRubygui和测试套件。我还可以看到在未来的不同项目中使用Scala作为后端。我想我要为我的项目尝试一下buildr(http://buildr.apache.org/)，但我注意到buildr似乎没有设置为在项目中使用JRuby代码本身!这看起来有点傻，因为该工具旨在统一通用的JVM语言并且是在ruby中构建的。除了将输出的jar包含在一个独特的、仅限ruby​​

  2. ruby-on-rails - 如何优雅地重启 thin + nginx？ - 2

    我的瘦服务器配置了nginx，我的ROR应用程序正在它们上运行。在我发布代码更新时运行thinrestart会给我的应用程序带来一些停机时间。我试图弄清楚如何优雅地重启正在运行的Thin实例，但找不到好的解决方案。有没有人能做到这一点？ 最佳答案 #Restartjustthethinserverdescribedbythatconfigsudothin-C/etc/thin/mysite.ymlrestartNginx将继续运行并代理请求。如果您将Nginx设置为使用多个上游服务器，例如server{listen80;server

  3. ruby-on-rails - 项目升级后 Pow 不会更改 ruby​​ 版本 - 2

    我在我的Rails项目中使用Pow和powifygem。现在我尝试升级我的ruby​​版本(从1.9.3到2.0.0，我使用RVM)当我切换ruby​​版本、安装所有gem依赖项时，我通过运行railss并访问localhost:3000确保该应用程序正常运行以前，我通过使用pow访问http://my_app.dev来浏览我的应用程序。升级后，由于错误Bundler::RubyVersionMismatch:YourRubyversionis1.9.3,butyourGemfilespecified2.0.0，此url不起作用我尝试过的:重新创建pow应用程序重启pow服务器更新战俘

  4. ruby-on-rails - 新 Rails 项目 : 'bundle install' can't install rails in gemfile - 2

    我已经像这样安装了一个新的Rails项目:$railsnewsite它执行并到达:bundleinstall但是当它似乎尝试安装依赖项时我得到了这个错误Gem::Ext::BuildError:ERROR:Failedtobuildgemnativeextension./System/Library/Frameworks/Ruby.framework/Versions/2.0/usr/bin/rubyextconf.rbcheckingforlibkern/OSAtomic.h...yescreatingMakefilemake"DESTDIR="cleanmake"DESTDIR="

  5. ruby-on-rails - 每次我尝试部署时，我都会得到 - (gcloud.preview.app.deploy) 错误响应 : [4] DEADLINE_EXCEEDED - 2

    我是Google云的新手，我正在尝试对其进行首次部署。我的第一个部署是RubyonRails项目。我基本上是在关注thisguideinthegoogleclouddocumentation.唯一的区别是我使用的是我自己的项目，而不是他们提供的“helloworld”项目。这是我的app.yaml文件runtime:customvm:trueentrypoint:bundleexecrackup-p8080-Eproductionconfig.ruresources:cpu:0.5memory_gb:1.3disk_size_gb:10当我转到我的项目目录并运行gcloudprevie

  6. Ruby 从大范围中获取第 n 个项目 - 2

    假设我有这个范围:("aaaaa".."zzzzz")如何在不事先/每次生成整个项目的情况下从范围中获取第N个项目？ 最佳答案 一种快速简便的方法:("aaaaa".."zzzzz").first(42).last#==>"aaabp"如果出于某种原因你不得不一遍又一遍地这样做，或者如果你需要避免为前N个元素构建中间数组，你可以这样写:moduleEnumerabledefskip(n)returnto_enum:skip,nunlessblock_given?each_with_indexdo|item,index|yieldit

  7. ruby-on-rails - Ruby on Rails 可以部署在 Azure 网站上吗？ - 2

    我可以在Azure网站上部署RubyonRails吗？ 最佳答案 还没有。目前仅支持.NET和PHP。 关于ruby-on-rails-RubyonRails可以部署在Azure网站上吗？，我们在StackOverflow上找到一个类似的问题： https://stackoverflow.com/questions/12964010/

  8. Get https://registry-1.docker.io/v2/: net/http: request canceled while waiting - 2

    1.错误信息：Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:requestcanceledwhilewaitingforconnection(Client.Timeoutexceededwhileawaitingheaders)或者：Errorresponsefromdaemon:Gethttps://registry-1.docker.io/v2/:net/http:TLShandshaketimeout2.报错原因：docker使用的镜像网址默认为国外，下载容易超时，需要修改成国内镜像地址（首先阿里

  9. jenkins部署1--jenkins+gitee持续集成 - 2

    前置步骤我们都操作完了，这篇开始介绍jenkins的集成。话不多说，看操作1、登录进入jenkins后会让你选择安装插件，选择第一个默认的就行。安装完成后设置账号密码，重新登录。2、配置JDK和Git都需要执行路径，所以需要先把执行路径找到，先进入服务器的docker容器，2.1JDK的路径root@69eef9ee86cf:/usr/bin#echo$JAVA_HOME/usr/local/openjdk-82.2Git的路径root@69eef9ee86cf:/#whichgit/usr/bin/git3、先配置JDK和Git。点击：ManageJenkins>>GlobalToolCon

  10. 深度学习部署：Windows安装pycocotools报错解决方法 - 2

    深度学习部署：Windows安装pycocotools报错解决方法1.pycocotools库的简介2.pycocotools安装的坑3.解决办法更多Ai资讯：公主号AiCharm本系列是作者在跑一些深度学习实例时，遇到的各种各样的问题及解决办法，希望能够帮助到大家。ERROR:Commanderroredoutwithexitstatus1:'D:\Anaconda3\python.exe'-u-c'importsys,setuptools,tokenize;sys.argv[0]='"'"'C:\\Users\\46653\\AppData\\Local\\Temp\\pip-instal

随机推荐