10月05, 2018

一个前端必会的 Nginx免费教程

alt

由于前端技术的蓬勃发展和你自身的不断努力,很多小伙伴已经打通了任督二脉,做到了前后端通吃。你们就是自己程序世界里的神,在这里你们无所不能,创造世界,制定规则和逻辑。当一个属于你的世界做好后,你需要展示给朋友,发布于众人,让爱你的人欣赏。这时候我们需要一个强有力的服务器作为容器,而Nginx可以满足你的一切幻想。

课程说明:

课程详细讲解Nginx的使用和配置,包括文字教程和视频教程。当然你不用花费一分钱,这一切都是免费的,你只要记住http://jspang.com 这个网址就可以看这个教程。

本文首发http://jspang.com,如果转载,请带上这句话。

教程更新说明

本人并不是职业讲师,白天需要到公司上班,还在一线写程序,所以更新频率不是很快。

每周更新三集视频。

关于打赏

本网站95%以上的视频全部是免费的,而且很多小伙伴靠着这些视频学到了东西、找到了工作,如果你也从中学到了东西,并且手头宽裕,希望你进行打赏,金额随意。

打赏后可以加入Nginx微信群和上百名小伙伴一起学习,技术胖会在视频录制期间每天跟大家一起互动,一起学习

如果你在学习中遇到了什么问题,欢迎在微信群中留言讨论。也可以在文章下方进行留言,我也会积极回答你的问题。

第01节:初识Nginx和环境准备

作为一个前端,我相信你一定听说过Nginx。因为它在最近两年实在是太火了,作为一个前端如果不会Nginx,都不敢跟别人说自己是大前端。那Nginx到底是什么?我们还是引用官方的介绍吧:

"Nginx是一款轻量级的HTTP服务器,采用事件驱动的异步非阻塞处理方式框架,这让其具有极好的IO性能,时常用于服务端的反向代理和负载均衡。"

Nginx的优点

  • 支持海量高并发:采用IO多路复用epoll。官方测试Nginx能够支持5万并发链接,实际生产环境中可以支撑2-4万并发连接数。
  • 内存消耗少:在主流的服务器中Nginx目前是内存消耗最小的了,比如我们用Nginx+PHP,在3万并发链接下,开启10个Nginx进程消耗150M内存。
  • 免费使用可以商业化:Nginx为开源软件,采用的是2-clause BSD-like协议,可以免费使用,并且可以用于商业。
  • 配置文件简单:网络和程序配置通俗易懂,即使非专业运维也能看懂。

当然它的有点还有很多,比如反向代理功能,负载均衡功能,我们会在文章中一一介绍,我这里就不跟大家赘述了。

现在Nginx非常火 :我们可以通过https://w3techs.com/ 这个网站看到,Nginx在服务器中排在第二位,但是是上升最快的网站,占有率达到39.7%。

alt

为什么要学习这篇文章

作为一个前端,或多或少都会对Nginx有一些经验,那为什么还要学习那? 不系统:以前可能你只会配置某项功能(网上搜集),都是碎片化的知识,不没有形成系统化。这样就导致你服务出现问题时,根本不知道从哪里下手来解决这些问题。

那这篇文章我努力做到分功能,分层次的给大家系统的进行讲解,让大家能基本胜任Nginx的配置和运维工作。

学习环境

学习环境你可以有三种选择:

  • 自己找个电脑搭建:需要自己有闲置电脑或者服务器,优点是稳定性高,可控能力强,学习更方便。
  • 购买阿里云ECS:需要花些小钱,我选用的是阿里云学生ECS,每月9.5元。
  • 使用虚拟软件:这个如果电脑配置高,可以安装虚拟软件,缺点是麻烦,影响电脑性能,而且配置也比较多。

我选择阿里云的ECS,纯属个人懒省事,但是我认为这是最高效的。

下面是群里的小伙伴提供的一个阿里云的优惠价格。

玩转校园生态 ,只要9.5元一个月 ,你们可以酌情购买。 https://promotion.aliyun.com/ntms/act/campus2018.html

(Linux的知识我这里不做过多的介绍,如果你对这个不熟悉自己去恶补一下吧)

我用的操作系统是CentOS 7.4 64位版本。

用yum进行安装必要程序

如果你Linux用的很熟练的话,我想这些程序你一定已经用yum安装过了,但是如果你还不熟悉Linux,你可以直接用yum进行安装就可以了。(然后自己百度一下这些东西的用处,这里不做过多的介绍了,只要照做就可以了)

yum -y install gcc gcc-c++ autoconf pcre-devel make automake
yum -y install wget httpd-tools vim

建立目录

其实这个目录你是可以不建立的,但是那样你的系统会很乱,不利于以后的运维。所以我这里根据本人的喜好建立如下目录。

步骤如下(此步骤根据自己喜欢建立):

  1. 进入系统后,在目录下建立了一个jspang的文件夹。
  2. 进入 jspang文件夹 ,命令是 cd jspang
  3. 分别使用mkdir建立 app,backup,download,logs,work文件夹。

这节课我们就先作到这里,下节课我们开始安装我们Nginx。

第02节:Nginx的快速搭建

我的文章多是注重于动手操作,而轻理论的,因为技术胖这个半吊子还没能力把理论知识讲的比书好,所以理论部分你可以自行百度查阅或者看书学习(需要说明的是技术胖并不是说理论不重要)。

Nginx版本说明

  • Mainline version :开发版,主要是给广大Nginx爱好者,测试、研究和学习的,但是不建议使用于生产环境。
  • Stable version : 稳定版,也就是我们说的长期更新版本。这种版本一般比较成熟,经过长时间的更新测试,所以这种版本也是主流版本。
  • legacy version : 历史版本,如果你需要以前的版本,Nginx也是有提供的。

明白了这三种版本的区别后,就可以明明白白的使用了。

基于Yum的方式安装Nginx

我们可以先来查看一下yum是否已经存在,命令如下:

yum list | grep nginx

如果出现类似下面的内容,说明yum源是存在的。 alt

(细心的小伙伴可以发现系统原来的源只支持1.1.12版本,这版本有些低)

如果不存在,或者不是你需要的版本,那我们可以自行配置yum源,下面是官网提供的源,我们可以放心大胆的使用。

[nginx]
name=nginx repo
baseurl=http://nginx.org/packages/OS/OSRELEASE/$basearch/
gpgcheck=0
enabled=1

复制上面的代码,然后在终端里输入:

vim /etc/yum.repos.d/nginx.repo

然后把代码复制进去,这里你可能需要一些Vim的操作知识,如果不熟悉,可以自行学习一下,当然我视频中也是有讲解的。

赋值完成后,你需要修改一下对应的操作系统和版本号,因为我的是centos和7的版本,所以改为这样。

baseurl=http://nginx.org/packages/centos/7/$basearch/

你可以根据你的系统或需要的版本进行修改。

如果都已经准备好了,那就可以开始安装了,安装的命令非常简单:

yum install nginx

安装完成后可以使用命令,来检测Nginx的版本。

nginx -v

如果出现下面图片的内容,说明Nginx就安装成功了。

alt

到这里你就把最新版本的Nginx安装到了Linux系统中,也算是一个非常好的开始。小伙伴一定要动手作一下哦,听是听不会的,你需要动手作一下。

第03节:Nginx基本配置文件详讲

现在Nginx已经顺利安装完成了,之后的任务就是要学习配置和使用它了。个人是比较享受这个过程的,这就好像有一匹充满野性的汗血宝马,你现在要做的就是驯服它。无论是结果和 过程都那么美好。

查看Nginx的安装目录

在使用yum安装完Nginx后,需要知道系统中多了那些文件,它们都安装到了那里。可以使用下面的命令进行查看:

rpm -ql nginx

rpm 是linux的rpm包管理工具,-q 代表询问模式,-l 代表返回列表,这样我们就可以找到nginx的所有安装位置了。

列表列出的内容还是比较多的,我们尽量给大家进行讲解,我们这节先来看看重要的文件。

nginx.conf文件解读

nginx.conf 文件是Nginx总配置文件,在我们搭建服务器时经常调整的文件。

进入etc/nginx目录下,然后用vim进行打开

cd /etc/nginx
vim nginx.conf

下面是文件的详细注释,我几乎把每一句都进行了注释,你可以根据你的需要来进行配置。

#运行用户,默认即是nginx,可以不进行设置
user  nginx;
#Nginx进程,一般设置为和CPU核数一样
worker_processes  1;   
#错误日志存放目录
error_log  /var/log/nginx/error.log warn;
#进程pid存放位置
pid        /var/run/nginx.pid;


events {
    worker_connections  1024; # 单个后台进程的最大并发数
}


http {
    include       /etc/nginx/mime.types;   #文件扩展名与类型映射表
    default_type  application/octet-stream;  #默认文件类型
    #设置日志模式
    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;   #nginx访问日志存放位置

    sendfile        on;   #开启高效传输模式
    #tcp_nopush     on;    #减少网络报文段的数量

    keepalive_timeout  65;  #保持连接的时间,也叫超时时间

    #gzip  on;  #开启gzip压缩

    include /etc/nginx/conf.d/*.conf; #包含的子配置项位置和文件

default.conf 配置项讲解 我们看到最后有一个子文件的配置项,那我们打开这个include子文件配置项看一下里边都有些什么内容。

进入conf.d目录,然后使用vim default.conf进行查看。

server {
    listen       80;   #配置监听端口
    server_name  localhost;  //配置域名

    #charset koi8-r;     
    #access_log  /var/log/nginx/host.access.log  main;

    location / {
        root   /usr/share/nginx/html;     #服务默认启动目录
        index  index.html index.htm;    #默认访问文件
    }

    #error_page  404              /404.html;   # 配置404页面

    # redirect server error pages to the static page /50x.html
    #
    error_page   500 502 503 504  /50x.html;   #错误状态码的显示页面,配置后需要重启
    location = /50x.html {
        root   /usr/share/nginx/html;
    }

    # proxy the PHP scripts to Apache listening on 127.0.0.1:80
    #
    #location ~ \.php$ {
    #    proxy_pass   http://127.0.0.1;
    #}

    # pass the PHP scripts to FastCGI server listening on 127.0.0.1:9000
    #
    #location ~ \.php$ {
    #    root           html;
    #    fastcgi_pass   127.0.0.1:9000;
    #    fastcgi_index  index.php;
    #    fastcgi_param  SCRIPT_FILENAME  /scripts$fastcgi_script_name;
    #    include        fastcgi_params;
    #}

    # deny access to .htaccess files, if Apache's document root
    # concurs with nginx's one
    #
    #location ~ /\.ht {
    #    deny  all;
    #}
}

明白了这些配置项,我们知道我们的服务目录放在了/usr/share/nginx/html下,可以使用命令进入看一下目录下的文件。

cd /usr/share/nginx/html
ls 

可以看到目录下面有两个文件,50x.html 和 index.html。我们可以使用vim进行编辑。

学到这里,其实可以预想到,我们的nginx服务器已经可以为html提供服务器了。我们可以打开浏览器,访问ip地址试一试。

阿里云的安全组配置

如果你使用的是阿里云,记得到ECS实例一下打开端口。

步骤如下:

  1. 进入阿里云控制台,并找到ECS实例。
  2. 点击实例后边的“更多”
  3. 点击“网络和安全组” ,再点击“安全组配置”
  4. 右上角添加“安全组配置”
  5. 进行80端口的设置,具体设置如图就好。

alt

到这里我们就可以浏览到程序的页面了。本节就到这里,看到如下图片页面,说明你都配置成功了。

alt

第04节:Nginx服务启动、停止、重启

经过前3节的学习,已经安装好了nginx,在维护的时候,我们作的最多的操作就是Nginx的启动、重启和停止。这节课我们就把Nginx的这些最常用操作讲一下。

启动Nginx服务

默认的情况下,Nginx是不会自动启动的,需要我们手动进行启动,当然启动Nginx的方法也不是单一的。

nginx直接启动

在CentOS7.4版本里(低版本是不行的),是可以直接直接使用nginx启动服务的。

nginx

使用systemctl命令启动

还可以使用个Linux的命令进行启动,我一般都是采用这种方法进行使用。因为这种方法无论启动什么服务,都是一样的,只是换一下服务的名字(不用增加额外的记忆点)。

systemctl start nginx.service

输入命令后,没有任何提示,那我们如何知道Nginx服务已经启动了哪?可以使用Linux的组合命令,进行查询服务的运行状况。

ps aux | grep nginx

如果启动成功会出现如下图片中类似的结果。

alt

有这三条记录,说明我们Nginx被正常开启了。

停止Nginx服务的四种方法

停止Nginx 方法有很多种,可以根据需求采用不一样的方法,我们一个一个说明。

  • 立即停止服务
nginx  -s stop

这种方法比较强硬,无论进程是否在工作,都直接停止进程。

  • 从容停止服务
nginx -s quit

这种方法较stop相比就比较温和一些了,需要进程完成当前工作后再停止。

  • killall 方法杀死进程

这种方法也是比较野蛮的,我们直接杀死进程,但是在上面使用没有效果时,我们用这种方法还是比较好的。

killall nginx
  • systemctl 停止
systemctl stop nginx.service

重启Nginx服务

有时候我们需要重启Nginx服务,这时候可以使用下面的命令。

systemctl restart nginx.service

重新载入配置文件

在重新编写或者修改Nginx的配置文件后,都需要作一下重新载入,这时候可以用Nginx给的命令。

nginx -s reload

查看端口号

在默认情况下,Nginx启动后会监听80端口,从而提供HTTP访问,如果80端口已经被占用则会启动失败。我么可以使用netstat -tlnp命令查看端口号的占用情况。

总结:这节课的内容虽然简单,但都是我们在工作中经常使用的,希望小伙伴们多多联系,我把课程分的如此细致,一个主要的原因也是希望可以方便在工作中进行查阅。


第05节:自定义错误页和访问设置

一个好的网站会武装到牙齿,任何错误都有给用户友好的提示。比如当网站遇到页面没有找到的时候,我们要提示页面没有找到,并给用户可返回性。错误的种类有很多,所以真正的好产品会给顾客不同的返回结果。

多错误指向一个页面

在/etc/nginx/conf.d/default.conf 是可以看到下面这句话的。

error_page   500 502 503 504  /50x.html;

error_page指令用于自定义错误页面,500,502,503,504 这些就是HTTP中最常见的错误代码,/50.html 用于表示当发生上述指定的任意一个错误的时候,都是用网站根目录下的/50.html文件进行处理。

单独为错误置顶处理方式

有些时候是要把这些错误页面单独的表现出来,给用户更好的体验。所以就要为每个错误码设置不同的页面。设置方法如下:

error_page 404  /404_error.html;

然后到网站目录下新建一个404_error.html 文件,并写入一些信息。

<html>
<meta charset="UTF-8">
<body>
<h1>404页面没有找到!</h1>
</body>
</html>

然后重启我们的服务,再进行访问,你会发现404页面发生了变化。

把错误码换成一个地址

处理错误的时候,不仅可以只使用本服务器的资源,还可以使用外部的资源。比如我们将配置文件设置成这样。

error_page  404 http://jspang.com;

我们使用了技术胖的博客地址作为404页面没有找到的提示,就形成了,没有找到文件,就直接跳到了技术胖的博客上了。

简单实现访问控制

有时候我们的服务器只允许特定主机访问,比如内部OA系统,或者应用的管理后台系统,更或者是某些应用接口,这时候我们就需要控制一些IP访问,我们可以直接在location里进行配置。

可以直接在default.conf里进行配置。

 location / {
        deny   123.9.51.42;
        allow  45.76.202.231;
    }

配置完成后,重启一下服务器就可以实现限制和允许访问了。这在工作中非常常用,一定要好好记得。

本文链接:http://jspang.com/post/nginx.html

-- EOF --

Comments

加入学习
QQ群1:364140450 (4900/5000满) web/前端(云宇科技)
QQ群2:524520566 (1900/2000人) 技术胖的前端技术2群
广告
打赏特权
打赏获得4项特权
1.免费视频离线高清版下载(共210集);
2.纯金网站15元代金券,可购买收费课程;
3.加入微信群,享有更多互动和人脉资源;
4.和11年程序老兵成为微信好友;