前端如何使用docker在本地启动nginx服务

368 阅读2分钟
  1. 默认你已经安装docker,安装教程:www.runoob.com/docker/dock…

  2. 拉取nginx官方镜像

    docker pull nginx

  3. 直接运行镜像(镜像名称为nginx,这个名称随意)

    docker run --name nginx -p 80:80 -d nginx

    到这里我们其实已经成功了,可以访问localhost访问nginx内部默认的index页面,但是如果我们想修改nginx的配置或者替换静态资源,每一次我们需要进入docker进行操作,这样十分不方便,所以我们需要把配置文件、静态资源目录以及日志文件给挂载到宿主机上,这样数据也更安全一些。挂载之后我们就可以直接在宿主机的目录里进行操作了,我们后续修改配置、替换静态资源等都会同步到容器内。以下是挂载操作:

  4. 我们先进入容器查看一下相关的目录,然后exit退出就好

    docker exec -it nginx bash
    root@04d4401da506:/# find / -name nginx
    find: '/proc/24/task/24/fdinfo': Permission denied
    find: '/proc/24/map_files': Permission denied
    find: '/proc/24/fdinfo': Permission denied
    find: '/proc/25/task/25/fdinfo': Permission denied
    find: '/proc/25/map_files': Permission denied
    find: '/proc/25/fdinfo': Permission denied
    find: '/proc/26/task/26/fdinfo': Permission denied
    find: '/proc/26/map_files': Permission denied
    find: '/proc/26/fdinfo': Permission denied
    find: '/proc/27/task/27/fdinfo': Permission denied
    find: '/proc/27/map_files': Permission denied
    find: '/proc/27/fdinfo': Permission denied
    /usr/share/doc/nginx
    /usr/share/nginx
    /usr/lib/nginx
    /usr/sbin/nginx
    /var/log/nginx
    /var/cache/nginx
    /etc/init.d/nginx
    /etc/default/nginx
    /etc/logrotate.d/nginx
    /etc/nginx
    root@04d4401da506:/# exit
    exit
    

    文件对应含义如下:

    /etc/nginx:配置文件的目录

    /usr/share/nginx/html:html目录

    /var/log/nginx:日志目录

  5. 在宿主机创建一个目录,用来存储容器内的配置文件等

    mkdir /opt/nginx

  6. 拷贝容器中nginx的配置目录到/opt/nginx,并改名为conf,另外两个目录在容器启动时会自动生成

    docker cp nginx:/etc/nginx /opt/nginx
    mv /opt/nginx/nginx /opt/nginx/conf
    
  7. 删除该容器,此容器仅作为初始化配置文件生成器而存在

    docker rm -f nginx

  8. 重新启动一个容器,并把配置文件挂载到宿主机

    docker run -p 80:80 --name nginx \
    -v /opt/nginx/conf:/etc/nginx \ 
    -v /opt/nginx/html:/usr/share/nginx/html \ 
    -v /opt/nginx/log:/var/log/nginx \ 
    -d nginx
    
  9. 注意事项:

    1. 宿主机挂载的目录必须是docker有权访问的目录,即共享目录,使用docker desktop添加目录方法如下:

      image.png

    2. mac本找不到新建的目录的问题,访达顶部选择自己的设备,点击shift+command+。查看被隐藏的文件即可,将nginx目录用vscode打开编辑即可。

      image.png