使用nginx部署静态资源(linux)

374 阅读2分钟

使用nginx部署静态资源(linux)

本篇使用hexo搭建个人博客,并打包成为静态网站部署在web服务器nginx上

一. hexo的搭建和使用

1. 在linux环境下安装nodejs和npm

# 步骤如下:
1. wget https://nodejs.org/dist/v14.15.4/node-v14.15.4-linux-x64.tar.xz # 下载压缩包
2. tar -xvf node-v14.15.4-linux-x64.tar.xz # 解压

image-20221230223418775.png

2. 将解压文件移动到/usr/local/nodejs

mkdir -p /usr/local/nodejs
mv node-v14.15.4-linux-x64/* /usr/local/nodejs/

3. 创建软连接

ln -s /usr/local/nodejs/bin/node node
ln -s /usr/local/nodejs/bin/npm npm

4. 创建完软连接后,相当于windows下的设置完环境变量,现在即可查看node的版本和npm的版本

node -v
npm -v

5. 全局安装hexo

npm install hexo-cli -g

6. 同npm和node一样,给hexo创建软连接,创建完成后,输入hexo,即可如图所示

ln -s /usr/local/nodejs/bin/hexo hexo

image-20221230224604344

image-20221230224604344.png

7. 创建文件夹,拉取hexo的初始化代码

hexo init

image-20221230224701200.png

image-20221230224711767.png

8. 安装对应的依赖并启动

npm install
hexo s

image-20221230224756101.png

9. 访问对应的网址,效果如下:

image-20221230224825700.png

10. 创建笔记文件,就可以在hexo形成一个页面

hexo new <创建的文件名>

二、 安装nginx

1. 安装nginx并解压

wget http://nginx.org/download/nginx-1.22.1.tar.gz
tar -xvf nginx-1.22.1.tar.gz

2. 解压完成后,使用make命令编译,并安装

make
make install

3. 修改配置文件的端口

image-20221230225959752.png

4. 启动nginx

cd /usr/local/nginx/sbin
ls
./nginx

image-20221230225901864.png

5. 访问 localhost:8089

image-20221230230055804.png

三、 使用nginx部署hexo生成静态网站

1. 使用hexo g对生成的博客源码变成一个静态文件,生成的结果创建了一个public文件

image-20221230230316822.png

2. 修改nginx配置文件,启动的静态资源改成hexo所生成的public

image-20221230230531656.png

3. 重启nginx服务器

./nginx -s reload

4. 输入localhost:8089

image-20221230230656221.png

四、 使用docker容器部署静态资源

1. 创建容器,指定容器的端口为80,名字为web2

docker run -p 80 –name web2 -I -t centos /bin/bash

2. 在创建的容器中安装nginx需要的lib库

先安装依赖lib库:依赖库主要有g++、gcc、openssl-devel、pcre-devel和zlib-devel

由于centos已经停止维护了,所以直接安装依赖会报错,需要先执行两行命令,设置对应的下载地址

image-20221230231121954.png

1. yum install gcc-c++
2. 安装pcre-devel,【yum install pcre pcre-devel】
3. 安装zlib-devel 【yum install zlib zlib-devel 】'
4. 安装openssl-devel【yum install openssl openssl--devel】'

3. 安装nginx

wget http://nginx.org/download/nginx-1.22.1.tar.gz
tar -xvf nginx-1.22.1.tar.gz
make
make install

4. 将外部的静态文件拷贝到容器中对应的位置,修改配置文件,把静态资源的路径配置上

docker cp /homework/blog/public web2:/homework/blog/public

image-20221230232024712.png

5. 重新进入容器内部

docker attach 容器id

6. 在容器中启动nginx服务

./nginx # cd /usr/local/nginx/sbin

7. 查看nginx服务是否正常运行

docker top web2(容器名字)

image-20221230232001889.png

8. 查看容器所映射的端口号

docker port web2

image-20221230231943274.png

9. 访问对应的端口localhost:49154 效果如图

image-20221230231916965.png