Linux云服务器的配置与部署网页教程

186 阅读5分钟

准备

1、一台Linux云服务器
2、终端工具

作者推荐

Liunx操作系统五花八门,Linux官网给出的就有:

Snipaste_2023-06-28_15-32-11.png

排在最前面的两个,是目前最火的两个操作系统:UbuntuCentOS
我个人使用的是:Ubuntu

终端工具也是五花八门
常见的有:XShell 和 XFTPPuttySecureCRT 和 SecureFXMobaxtermtermius

个人推荐:
1、Github开源的:Tabby
2、国产免费的:Aechoterm
用过的都说好

我的环境

系统:Ubuntu 22.04
终端工具:Tabby(下载安装教程

配置服务器

  • 1、登录服务器,登录成功后界面如下:

Snipaste_2023-06-28_15-58-19.png

  • 2、更新安装源

指令:apt-get update

Snipaste_2023-06-28_16-01-38.png

  • 更新完成

Snipaste_2023-06-28_16-02-25.png

  • 3、防火墙

1、下载:apt install ufw -y
2、查看防火墙状态:ufw status

  • Status: inactive (关闭中)
  • Status: active (运行中)

3、启用防火墙:ufw enable
4、添加端口/协议:ufw allow 端口号/tcp

  • 常见的有:22-ssh80-http443-https3306-mysql8080-tomcat

5、添加完后,可查看防火墙规则编号:ufw status numbered

Snipaste_2023-06-28_16-14-21.png

  • 4、Nginx

1、安装:apt install nginx -y
2、完成后,可查看Nginx版本号:nginx -v

Snipaste_2023-06-28_16-16-44.png

3、关闭Nginx服务开机启动:sudo systemctl disable nginx
4、停止Nginx服务:sudo systemctl stop nginx
5、现在你可以通过你的服务器ip访问网页,界面显示如下:

Snipaste_2023-06-28_16-21-45.png

部署网页

  • 1、准备你的个人网站,我这里就随便找了一个网上的模板

Snipaste_2023-06-28_16-45-00.png

  • 把模板下载到本地,修改里面的内容

Snipaste_2023-06-28_16-48-47.png

  • 2、准备Nginx的配置文件

1、Nginx配置文件:server.nginx.conf
2、标准化的映射机制文件:mime.types

  • server.nginx.conf 文件参考内容如下:
# 指定Nginx工作进程以 root用户 运行
user root;
# 设置Nginx工作进程的数量为 1个
worker_processes 1;
# 定义事件模块的配置
events {
  # 设置每个工作进程的最大并发连接数为 1024
  worker_connections 1024;
}
# 定义HTTP模块的配置
http {
  # 引入mime.types文件
  include mime.types;
  # 设置默认的MIME类型为application/octet-stream(二进制流)
  default_type application/octet-stream;
  # 启用sendfile机制,加快文件传输速度
  sendfile on;
  # 启用FastCGI错误拦截功能
  fastcgi_intercept_errors on;
  # 设置客户端与服务器之间的连接保持活动状态的最长时间为 65秒
  keepalive_timeout 65;
  # 启用Gzip压缩,减小传输文件的大小
  gzip on;
  # 定义服务器块配置
  server {
    # 监听端口
    listen 80;
    # 设置服务器名称
    server_name 127.0.0.1;
    # 设置字符编码
    charset utf-8;
    # 个人网站主页配置
    # 访问路径:/
    location / {
      # 设置网页文件在服务器上的存放目录
      root 网页文件在服务器上的存放目录;
      # 设置默认的索引文件
      index index.html;
      # 禁用缓存
      expires -1;
    }
  }
}
  • mime.types 文件参考内容如下:
types {
    text/html                             html htm shtml;
    text/css                              css;
    text/xml                              xml;
    image/gif                             gif;
    image/jpeg                            jpeg jpg;
    application/javascript                js;
    application/atom+xml                  atom;
    application/rss+xml                   rss;

    text/mathml                           mml;
    text/plain                            txt;
    text/vnd.sun.j2me.app-descriptor      jad;
    text/vnd.wap.wml                      wml;
    text/x-component                      htc;

    image/png                             png;
    image/tiff                            tif tiff;
    image/vnd.wap.wbmp                    wbmp;
    image/x-icon                          ico;
    image/x-jng                           jng;
    image/x-ms-bmp                        bmp;
    image/svg+xml                         svg svgz;
    image/webp                            webp;

    application/font-woff                 woff woff2 ttf;
    application/java-archive              jar war ear;
    application/json                      json;
    application/mac-binhex40              hqx;
    application/msword                    doc;
    application/pdf                       pdf;
    application/postscript                ps eps ai;
    application/rtf                       rtf;
    application/vnd.apple.mpegurl         m3u8;
    application/vnd.ms-excel              xls;
    application/vnd.ms-fontobject         eot;
    application/vnd.ms-powerpoint         ppt;
    application/vnd.wap.wmlc              wmlc;
    application/vnd.google-earth.kml+xml  kml;
    application/vnd.google-earth.kmz      kmz;
    application/x-7z-compressed           7z;
    application/x-cocoa                   cco;
    application/x-java-archive-diff       jardiff;
    application/x-java-jnlp-file          jnlp;
    application/x-makeself                run;
    application/x-perl                    pl pm;
    application/x-pilot                   prc pdb;
    application/x-rar-compressed          rar;
    application/x-redhat-package-manager  rpm;
    application/x-sea                     sea;
    application/x-shockwave-flash         swf;
    application/x-stuffit                 sit;
    application/x-tcl                     tcl tk;
    application/x-x509-ca-cert            der pem crt;
    application/x-xpinstall               xpi;
    application/xhtml+xml                 xhtml;
    application/xspf+xml                  xspf;
    application/zip                       zip;

    application/octet-stream              bin exe dll;
    application/octet-stream              deb;
    application/octet-stream              dmg;
    application/octet-stream              iso img;
    application/octet-stream              msi msp msm;

    application/vnd.openxmlformats-officedocument.wordprocessingml.document    docx;
    application/vnd.openxmlformats-officedocument.spreadsheetml.sheet          xlsx;
    application/vnd.openxmlformats-officedocument.presentationml.presentation  pptx;

    audio/midi                            mid midi kar;
    audio/mpeg                            mp3;
    audio/ogg                             ogg;
    audio/x-m4a                           m4a;
    audio/x-realaudio                     ra;

    video/3gpp                            3gpp 3gp;
    video/mp2t                            ts;
    video/mp4                             mp4;
    video/mpeg                            mpeg mpg;
    video/quicktime                       mov;
    video/webm                            webm;
    video/x-flv                           flv;
    video/x-m4v                           m4v;
    video/x-mng                           mng;
    video/x-ms-asf                        asx asf;
    video/x-ms-wmv                        wmv;
    video/x-msvideo                       avi;
}
  • 3、将Nginx配置文件网页文件上传到服务器上,做好目录分类,方便管理

nginx:存放nginx相关资源
web:存放网页相关资源

Snipaste_2023-06-28_17-10-33.png

  • 4、修改Nginx配置文件中的网页资源目录

1、进入web目录下,执行:pwd,即可显示完整目录

Snipaste_2023-06-28_17-14-00.png

2、复制完整目录,将中文提示覆盖

Snipaste_2023-06-28_17-15-25.png

Snipaste_2023-06-28_17-16-46.png

注意,修改的是服务器上的文件,如果是修改的本地文件,需要再上传到服务器

  • 5、准备Nginx指令

1、进入nginx目录下,使用指令:pwd,即可显示完整目录
Snipaste_2023-06-28_17-21-35.png

2、以下是指定nginx配置文件相关指令,将完整目录替换成你的即可使用

检查Nginx配置文件的语法是否正确:sudo nginx -t -c 完整目录/server.nginx.conf
启动Nginx:sudo nginx -c 完整目录/server.nginx.conf
停止Nginx:sudo nginx -s stop -c 完整目录/server.nginx.conf
重启Nginx:sudo nginx -s reload

  • 6、即将看到你的网页,按顺序执行以下两条指令:

1、进入nginx目录下
2、执行:检查Nginx配置文件的语法是否正确 的指令

  • 如下显示,表示语法没问题,否则语法有错误
    Snipaste_2023-06-28_17-28-32.png

3、执行:启动Nginx 的指令
4、访问:你的服务器公网ip/,就能看到你的网页了

Snipaste_2023-06-28_17-35-36.png

结语

至此,你已经学会了服务器的最基础配置网页部署
若有不懂或遇到问题,可以私信我,看到必回
注:出于安全性和权限管理的考虑,一般服务器是采用新建用户来使用的,一般不会用root用户,这里是作为演示方才使用