1.概述location匹配
参数名称 | 参数说明 |
---|---|
= | 精确匹配 |
~ | 区分大小写匹配 |
!~ | 区分大小写不匹配 |
~* | 不区分大小写匹配 |
!~* | 不区分大小写不匹配 |
^~ | 以什么字符开头的查询 |
@ | 服务跳转 |
* | 匹配任意字符 |
\ | 转义字符 |
$ | 以什么字符结尾 |
2.克隆(Git clone)一个静态页面进行测试
#安装git工具
yum install git -y
#切换到nginx存放html目录下
cd /usr/local/nginx/html/
#克隆静态页面
git clone https://github.com/TheRoadTo/Cartoon-Page.git
#赋予所属用户和所属组的权限
chown -R nginx:nginx /usr/local/nginx/html/Cartoon-Page/
#打开浏览器IP/Cartoon-Page/first.html,查看网页
3.配置nginx的location
vi /usr/local/nginx/conf/nginx.conf
server {
......
location = / {
proxy_pass http://172.25.0.20:80/Cartoon-Page/first.html;
}
location / {
root html;
index index.php index.html index.htm;
}
......
}
#检查nginx配置文件
nginx -t
nginx: the configuration file /usr/local/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /usr/local/nginx/conf/nginx.conf test is successful
#重启nginx服务
nginx -s reload
参数名称 | 参数说明 |
---|---|
location = / | 精确匹配到 /(根目录),相当于http://172.25.0.20:80 / (根目录)匹配以下的目录 |
proxy_pass | 反向代理转发,相当于http://172.25.0.20:80/Cartoon-Page/first.html这个URL链接地址,会以它为访问的首页 |
#查看浏览器,用IP查看,可以匹配到首页,但是一些样式和图片无法匹配
vi /usr/local/nginx/conf/nginx.conf
server {
......
location = / {
proxy_pass http://172.25.0.20:80/Cartoon-Page/first.html;
}
location ~* \.(jpg|png|jpeg|bmp|gif|swf|ico|txt|css|js)$ {
root /usr/local/nginx/html/Cartoon-Page;
}
location / {
root html;
index index.php index.html index.htm;
}
......
}
#检查nginx配置文件
nginx -t
nginx: the configuration file /usr/local/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /usr/local/nginx/conf/nginx.conf test is successful
#重启nginx服务
nginx -s reload
参数名称 | 参数说明 |
---|---|
location ~* .(jpg|png|jpeg|bmp|gif|swf|ico|txt|css|js)$ | 不区分大小写匹配,相当于 http://172.25.0.20:80/Cartoon-Page/ * / 匹配以下后缀名的文件*.(jpg|png|jpeg|bmp|gif|swf|ico|txt|css|js) |
root | 指定文件路径有两种方式root和alias,root的路径是root路径+location路径,alias的路径是alias路径替换location路径 |
#打开浏览器,用IP就可以浏览
#打开其他的链接,但是跳转不了
状态码名称 | 状态码说明 |
---|---|
200 | 访问正常 |
301 | 永久重定向 |
302 | 临时跳转 |
403 | 拒绝访问 |
404 | 找不到文件 |
500 | 服务器内部错误 |
502 | 请求超时,这个在php-fpm最容易出现这种情况,需要优化php-fpm |
504 | 和502类似 |
vi /usr/local/nginx/conf/nginx.conf
server {
......
location = / {
proxy_pass http://172.25.0.20:80/first.html;
}
location ~* \.(jpg|png|jpeg|bmp|gif|swf|ico|txt|css|js)$ {
root /usr/local/nginx/html/Cartoon-Page;
}
location / {
autoindex on;
root /usr/local/nginx/html/Cartoon-Page;
index index.php index.html index.htm;
}
......
}
#检查nginx配置文件
nginx -t
nginx: the configuration file /usr/local/nginx/conf/nginx.conf syntax is ok
nginx: configuration file /usr/local/nginx/conf/nginx.conf test is successful
#重启nginx服务
nginx -s reload
注意: 精确匹配的proxy_pass http://172.25.0.20:80/first.html;要去掉/Cartoon-Page,因为下面的/(根)匹配已经指定目录
参数名称 | 参数说明 |
---|---|
autoindex on | 开启目录浏览功能 |
root /usr/local/nginx/html/Cartoon-Page | 指定/Cartoon-Page以下的Web目录 |
#点击其他链接
#成功打开,可以自动跳转链接
4.查看Web目录结构
#安装树状图列出目录
yum install tree -y
#查看树状图列出目录
tree /usr/local/nginx/html/Cartoon-Page/
/usr/local/nginx/html/Cartoon-Page/
├── css
│ ├── fifth.css
│ ├── first.css
│ ├── fourth.css
│ ├── second.css
│ └── third.css
├── fifth.html
├── first.html
├── fourth.html
├── image
│ ├── 01.jpg
│ ├── 02.jpg
│ ├── 03.jpg
│ ├── 0.jpg
│ ├── bg.png
│ ├── body.jpg
│ ├── content.jpg
│ ├── cotent_list.jpg
│ ├── head1.jpg
│ ├── head.jpg
│ ├── jq.jpg
│ ├── left2.jpg
│ ├── logo.png
│ ├── nav_bg.gif
│ ├── right.jpg
│ ├── search.jpg
│ └── yikan.png
├── README.md
├── second.html
└── third.html
文件名称 | 文件说明 |
---|---|
*.html | 为静态页面的主文件 |
*.css | 为静态页面的样式文件 |
image | image目录为存放图片的目录 |
css | css目录为存放样式文件 |
README.md | 自述文件(即讲解文件) |