美文网首页
从零开始摸爬滚打搭建自己的网站（一）

从零开始摸爬滚打搭建自己的网站（一）

作者: 言蹊灬 | 来源:发表于2019-12-12 15:46 被阅读0次

这是一个只会前端的后台小白日常杂记，工作闲时的自学经历，如有错误欢迎指正：
目标是3个Demo（Angular，Vue，React），用到的技术应该有：
后台：Nginx，Node，Express，PM2；（对后台没啥了解，用到再补充吧）
前端：Vue，VueX及一些相关技术；
万事开头难 首先第一件事是买台云服务器 因为以前用现有的服务器搭建了一个博客，怕弄乱了，这次趁着百度云优惠就又买了一台。
废话不多说，现在就开始吧。
前置要求：1H1G服务器一台（跑个小网站绰绰有余） 域名一个 满世界的特惠域名 随便买了一个练手

第一步：阅读大神写的nginx文档 http://www.nginx.cn/install 由于一时没找到官方写的nginx文档，没办法先用民间的吧，看评论都是说好的，作为小白没办法就硬着头皮上吧。（以下步骤多为参考该网站，侵删）。

第二步：看完了大神的文档 我们就开始操作吧！
首先在终端连接我们的服务器 ssh root@xxx.xxx.xx.xx@后面的是我们的服务器外网地址。
连接成功后开始安装nginx

# 安装依赖
yum -y install gcc zlib zlib-devel pcre-devel openssl openssl-devel
# 下载nginx安装包
wget http://nginx.org/download/nginx-1.12.2.tar.gz
# 解压缩
tar -zxvf linux-nginx-1.12.2.tar.gz
cd nginx-1.12.2/
# 执行配置
./configure
# 编译安装(默认安装在/usr/local/nginx)
make
make install

防火墙配置
nginx默认监听80端口，如果未关闭防火墙需要配置iptables规则开放80端口(以centos6为例)。
编辑配置文件：vim /etc/sysconfig/iptables
在文件中间添加iptables规则
-A INPUT -m state --state NEW -m tcp -p tcp --dport 80 -j ACCEPT
重启防火墙：service iptables restart
或者关闭iptables规则：iptables -F && iptables -t nat -F

Nginx验证
nginx主配置文件：/usr/local/nginx/conf/nginx.conf
nginx日志文件：/usr/local/nginx/logs/access.log
启动Nginx：sudo /usr/local/nginx/sbin/nginx

Nginx常用命令
测试配置文件：${Nginx}/sbin/nginx -t
启动命令：${Nginx}/sbin/nginx
停止命令：${Nginx}/sbin/nginx -s stop/quit
重启命令：${Nginx}/sbin/nginx -s reload
查看进程命令：ps -ef | grep nginx
平滑重启：kill -HUP [Nginx主进程号(即ps命令查到的PID)]

也可建立软连接
ln -s /usr/local/nginx/sbin/nginx /usr/local/sbin/
nginx -t

访问网址/直接访问IP地址

好了，现在我们的nginx安装好了！
这时想到公司的不同网站都是在同一个主域名下，通过子域名进行区分，该如何配置呢？
经过度娘的百般折磨后 我找到了配置的方法。
首先我们来到nginx的配置目录下

image.png
我们可以看到目录下有这些文件
用vi编辑器打开配置文件 vi nginx.conf 以下是添加注释后的文件 
# 运行用户
#user  nobody; 
#启动进程,通常设置成和cpu的数量相等
worker_processes  1;

#全局错误日志及PID文件
#error_log  logs/error.log;
#error_log  logs/error.log  notice;
#error_log  logs/error.log  info;

#pid        logs/nginx.pid;

#工作模式及连接数上限
events {
    #单个后台worker process进程的最大并发链接数
    worker_connections  1024;
    # 根据大神的说法
    # 并发总数是 worker_processes 和 worker_connections 的乘积
    # 即 max_clients = worker_processes * worker_connections
    # 在设置了反向代理的情况下，max_clients = worker_processes * worker_connections / 4  为什么
    # 为什么上面反向代理要除以4，应该说是一个经验值
    # 根据以上条件，正常情况下的Nginx Server可以应付的最大连接数为：4 * 8000 = 32000
    # worker_connections 值的设置跟物理内存大小有关
    # 因为并发受IO约束，max_clients的值须小于系统可以打开的最大文件数
    # 而系统可以打开的最大文件数和内存大小成正比，一般1GB内存的机器上可以打开的文件数大约是10万左右
    # 我们来看看360M内存的VPS可以打开的文件句柄数是多少：
    # $ cat /proc/sys/fs/file-max
    # 输出 34336
    # 32000 < 34336，即并发连接总数小于系统可以打开的文件句柄总数，这样就在操作系统可以承受的范围之内
    # 所以，worker_connections 的值需根据 worker_processes 进程数目和系统可以打开的最大文件总数进行适当地进行设置
    # 使得并发总数小于操作系统可以打开的最大文件数目
    # 其实质也就是根据主机的物理CPU和内存进行配置
    # 当然，理论上的并发总数可能会和实际有所偏差，因为主机还有其他的工作进程需要消耗系统资源。
    # ulimit -SHn 65535
}


http {
    #设定mime类型,类型由mime.type文件定义
    include       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  logs/access.log  main;

    #sendfile 指令指定 nginx 是否调用 sendfile 函数（zero copy 方式）来输出文件，
    #对于普通应用，必须设为 on,
    #如果用来进行下载等应用磁盘IO重负载应用，可设置为 off，
    #以平衡磁盘与网络I/O处理速度，降低系统的uptime.
    sendfile        on;
    #tcp_nopush     on;

    #连接超时时间
    #keepalive_timeout  0;
    keepalive_timeout  65;

    #开启gzip压缩
    gzip  on;
    # gzip_disable "MSIE [1-6].";

    #设定虚拟主机配置
    server {
        #侦听80端口
        listen       80;
        #定义使用 www.dev.xxxxxxxx.cn访问
        server_name  www.dev.xxxxxxxx.cn;
        
        #默认请求
        location / {
            #根路径配置
            root  html;
            #定义首页索引文件的名称
            index  dev.html  dev.htm;
        }
        # 定义错误提示页面
        error_page 500 502 503 504 /50x.html;
        location /50x.html{
            root html;

        }
}
    server {
        listen       80;
        server_name  www.test.xxxxxxx.cn;
        #charset koi8-r;

        #access_log  logs/host.access.log  main;

        root  /www;

        location /test {
           index index.html index.htm;
        }
        location  / {
            index  index.html index.htm;
         }

        #error_page  404              /404.html;

        # redirect server error pages to the static page /50x.html
         location /page {
            root   html;
            index  index.html index.htm;
        }#
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   html;
        }

}

要想实现同一网址指向不同页面 有3种方案
方案1：监听不同的端口

 server {
        #侦听80端口
        listen       80;
        #定义使用 www.dev.xxxxxxxx.cn访问
        server_name  www.dev.xxxxxxxx.cn;
        
        #默认请求
        location / {
            #根路径配置
            root  html;
            #定义首页索引文件的名称
            index  dev.html  dev.htm;
        }
        # 定义错误提示页面
        error_page 500 502 503 504 /50x.html;
        location /50x.html{
            root html;

        }
}
 server {
        #侦听80端口
        listen       8888;
        #定义使用 www.dev.xxxxxxxx.cn访问
        server_name  www.dev.xxxxxxxx.cn;
        
        #默认请求
        location / {
            #根路径配置
            root  html;
            #定义首页索引文件的名称
            index  dev.html  dev.htm;
        }
        # 定义错误提示页面
        error_page 500 502 503 504 /50x.html;
        location /50x.html{
            root html;

        }
}

方案2：使用不同的子域名

 server {
        #侦听80端口
        listen       80;
        #定义使用 www.dev.xxxxxxxx.cn访问
        server_name  www.dev.xxxxxxxx.cn;
        
        #默认请求
        location / {
            #根路径配置
            root  html;
            #定义首页索引文件的名称
            index  dev.html  dev.htm;
        }
        # 定义错误提示页面
        error_page 500 502 503 504 /50x.html;
        location /50x.html{
            root html;

        }
}
 server {
        #侦听80端口
        listen       80;
        #定义使用 www.dev.xxxxxxxx.cn访问
        server_name  www.test.xxxxxxxx.cn;
        
        #默认请求
        location / {
            #根路径配置
            root  html;
            #定义首页索引文件的名称
            index  dev.html  dev.htm;
        }
        # 定义错误提示页面
        error_page 500 502 503 504 /50x.html;
        location /50x.html{
            root html;

        }
}

方法3 配置location 见配置文件详解

location这就有点复杂了

nginx location指令详解

Nginx的HTTP配置主要包括三个区块，结构如下：
http { //这个是协议级别
　　include mime.types;
　　default_type application/octet-stream;
　　keepalive_timeout 65;
　　gzip on;
　　　　server { //这个是服务器级别
　　　　　　listen 80;
　　　　　　server_name localhost;
　　　　　　　　location / { //这个是请求级别
　　　　　　　　　　root html;
　　　　　　　　　　index index.html index.htm;
　　　　　　　　}
　　　　　　}
}

location区段

通过指定模式来与客户端请求的URI相匹配，基本语法如下：location [=||*|^~|@] pattern{……}

1、没有修饰符 表示：必须以指定模式开始，如：

server {
　　server_name baidu.com;
　　location /abc {
　　　　……
　　}
}

那么，如下是对的：
http://baidu.com/abc
http://baidu.com/abc?p1
http://baidu.com/abc/
http://baidu.com/abcde

2、=表示：必须与指定的模式精确匹配

server {
server_name sish
　　location = /abc {
　　　　……
　　}
}
那么，如下是对的：
http://baidu.com/abc
http://baidu.com/abc?p1
如下是错的：
http://baidu.com/abc/
http://baidu.com/abcde

3、~ 表示：指定的正则表达式要区分大小写

server {
server_name baidu.com;
　　location ~ ^/abc$ {
　　　　……
　　}
}
那么，如下是对的：
http://baidu.com/abc
http://baidu.com/abc?p1=11&p2=22
如下是错的：
http://baidu.com/ABC
http://baidu.com/abc/
http://baidu.com/abcde

4、~* 表示：指定的正则表达式不区分大小写

server {
server_name baidu.com;
location ~* ^/abc$ {
　　　　……
　　}
}
那么，如下是对的：
http://baidu.com/abc
http://baidu..com/ABC
http://baidu..com/abc?p1=11&p2=22
如下是错的：
http://baidu..com/abc/
http://baidu..com/abcde

5、^~ 类似于无修饰符的行为，也是以指定模式开始，不同的是，如果模式匹配，
那么就停止搜索其他模式了。
6、@ ：定义命名location区段，这些区段客户段不能访问，只可以由内部产生的请
求来访问，如try_files或error_page等

查找顺序和优先级

1：带有“=“的精确匹配优先

2：没有修饰符的精确匹配

3：正则表达式按照他们在配置文件中定义的顺序

4：带有“^~”修饰符的，开头匹配

5：带有“~” 或“~*” 修饰符的，如果正则表达式与URI匹配

6：没有修饰符的，如果指定字符串与URI开头匹配

Location区段匹配示例

location = / {
　　# 只匹配 / 的查询.
　　[ configuration A ]
}
location / {
　　# 匹配任何以 / 开始的查询，但是正则表达式与一些较长的字符串将被首先匹配。
　　[ configuration B ]
}
location ^~ /images/ {
　　# 匹配任何以 /images/ 开始的查询并且停止搜索，不检查正则表达式。
　　[ configuration C ]
}
location ~* \.(gif|jpg|jpeg)$ {
　　# 匹配任何以gif, jpg, or jpeg结尾的文件，但是所有 /images/ 目录的请求将在Configuration C中处
　　理。
　　[ configuration D ]
} 各
请求的处理如下例：
■/ → configuration A
■/documents/document.html → configuration B
■/images/1.gif → configuration C
■/documents/1.jpg → configuration D

root 、alias指令区别

location /img/ {
    alias /var/www/image/;
}
#若按照上述配置的话，则访问/img/目录里面的文件时，ningx会自动去/var/www/image/目录找文件

location /img/ {
    root /var/www/image;
}
#若按照这种配置的话，则访问/img/目录下的文件时，nginx会去/var/www/image/img/目录下找文件。

\color{red}{alias是一个目录别名的定义，root则是最上层目录的定义。}
\color{red}{还有一个重要的区别是alias后面必须要用“/”结束，否则会找不到文件的。。。而root则可有可无~~}

proxy_pass

proxy_pass——反向代理配置，用于代理请求，适用于前后端负载分离或多台机器、服务器负载分离的场景，在匹配到location配置的URL路径后，转发请求到proxy_pass配置额URL，是否会附加location配置路径与proxy_pass配置的路径后是否有"/"有关，有"/"则不附加，如：

location   /test/  {
        proxy_pass    http://127.0.0.1:8080/;
}

请求/test/1.jpg，将会被nginx转发请求到http://127.0.0.1:8080/1.jpg（未附加/test/路径）

--以上部分内容转载自 http://www.nginx.cn/install

相关文章

网友评论

      本文标题：从零开始摸爬滚打搭建自己的网站（一）

      本文链接：https://www.haomeiwen.com/subject/ovaogctx.html

      延伸阅读

      深度阅读

      • 您也可以注册成为美文阅读网的作者，发表您的原创作品、分享您的心情！

      栏目导航

      热点阅读

      关于我们|服务条款|联系我们|从零开始摸爬滚打搭建自己的网站（一）|投稿指南|网站地图|RSS订阅|排版工具|手机版

      提供经典美文摘抄,优美散文欣赏,现代诗歌精选,短篇小说,心情随笔,表白情书范文,故事会在线阅读欣赏

      Copyright © 2014-2023 Haomeiwen.com All Rights Reserved. 好美文阅读网 版权所有

      备案信息：桂公网安备 45052102000051号 · 桂ICP备13007215号-3

      本站所收录作品、热点评论等信息部分来源互联网，目的只是为了系统归纳学习和传递资讯

      所有作品版权归原创作者所有，与本站立场无关，如不慎侵犯了你的权益，请联系我们告知，我们将做删除处理！