nginx静态资源的服务器配置方法


Posted in Servers onJuly 07, 2022

一、nginx 作用

★ 静态HTTP服务器

★ HTTP服务器(动静分离)

★ 反向代理

★ 负载均衡

二、nginx 静态HTTP服务器配置

Nginx本身也是一个静态资源的服务器,当只有静态资源的时候,就可以使用Nginx来做服务器,同时现在也很流行动静分离,就可以通过Nginx来实现。

# nginx 静态资源配置--静态服务器(也是最简单的配置)
server {
	listen 80; # 监听端口号
	server_name localhost; # 主机名
	index index.html index.htm; # 默认页名称
	root html; # 静态资源存放目录
	location / { # 匹配路径
		root html; # 文件根目录
		index index.html index.htm; # 默认页名称
	}
	error_page 500 502 503 504 /50x.html; # 报错编码对应页面
	location = /50x.html {
		root html;
	}
}

● url 和 uri:

网址是url,url=主机:端口+uri

uri 是资源,是location后面的匹配规则,即 location uri

● location uri,当规则匹配上了就到root目录找页面

location / { #匹配路径
		root html; #文件根目录
		index index.html index.htm; #默认页名称
	}

● location 配置方法

location 配置可以有两种配置方法

① 前缀 + uri(字符串/正则表达式)

② @ + name

前缀含义

= :精确匹配(必须全部相等):大小写敏感

~* :忽略大小写

^~ :只需匹配uri部分

@ :内部服务跳转

三、nginx HTTP服务器(动静分离--nginx+tomcat实现动静分离)

静态资源:数据不变,请求不需要后台处理;动态资源:模板,jsp、templates等,数据需要后台处理后渲染到网页,动态网页。

Nginx可以根据一定规则把不变的资源和经常变的资源区分开,对动静资源进行拆分,实现对静态资源的做缓存,从而提高资源响应的速度。这就是网站静态化处理的核心思路。

upstream tomcat{  
	server localhost:8080;  
}   
server {  
	listen       80;  
	server_name  localhost;  
	location / {  
		root   html;  
		index  index.html;  
	}  
	# 所有静态请求都由nginx处理,存放目录为html  
	location  ~* \.(gif|jpg|jpeg|png|bmp|swf|css|js)$ {  
		root   html;  
	}  
	# 所有动态请求都转发给tomcat处理  
	location ~ *jsp$ {  
		proxy_pass  http://tomcat; # 代理转发
	}  
	error_page   500 502 503 504  /50x.html;  
	location = /50x.html {  
		root  html;  
	}  
}

四、 反向代理----使用proxy_pass

server {
               listen       80;
               server_name  blog.yilele.site;
               index   index.html;            
               location / {
                        root /shan/blog/;
                        index index.html;
               }
              location ~* \.(jpg|jpeg|gif|png|swf|rar|zip|css|js|map|svg|woff|ttf|txt)$ {
                          root /shan/blog/;
                          index index.html;
                          add_header Access-Control-Allow-Origin *;
              }
              # 反向代理
              location /api {
					proxy_pass http://ip地址或域名:端口号;
               }  
}

☺ nginx 配置springboot+vue 前后端分离项目

1、思路:nginx 结合自身特性,本身一个静态资源的服务器

(1) 通过nginx实现域名的方式访问网站,以及把对数据的请求通过nginx反向代理转发给后端容器(后端服务),避免了接口暴露的不安全

① 访问网站,首先习惯上访问网站的首页,通常访问路径是/ [location /],然后默认页面是首页;

location / {
     root /shan/blog/;
     index index.html;
 }

② 默认页面,首页需要像css、js、图片等静态资源,才能显示出样式、动态效果等,需要通过匹配规则[location ~*.(jpg|jpeg|gif|png|swf|rar|zip|css|js|map|svg|woff|ttf|txt)$],指定root 到那个目录下获取这些静态资源。

location ~* \.(jpg|jpeg|gif|png|swf|rar|zip|css|js|map|svg|woff|ttf|txt)$ {
    root /shan/blog/;
    index index.html;
    add_header Access-Control-Allow-Origin *;
 }

③ 默认首页,需要有数据

在vue中首页实际上编写了很多个接口在请求数据,这些动态数据是来自 springboot项目(api 服务),需要咱通过定义一个匹配接口路径的规则[location /api],然后进行请求转发到 springboot项目(api 服务)

2、通过dockerCompose+nginx配置实现部署spirngboot+vue前后端分离项目

(1) dockerCompose 主要内容:

version: "3"
services:
  api:
    image: api
    container_name: api
    expose:
      - "8888"
  nginx:
    image: nginx
    container_name: nginx
    ports:
      - 80:80
      - 443:443
    volumes:
      - /mnt/docker/nginx/:/etc/nginx/
      - /mnt/shan/blog:/shan/blog
    links:
      - api
    depends_on:
      - api

(2) nginx 主要配置:

upstream apistream{
        server api:8888;# 通过dockerCompose编排,服务名相当于域名
}

server {
               listen       80;
               server_name  blog.yilele.site;
               index   index.html;          
               location / {
                        root /shan/blog/;
                        index index.html;
               }
              location ~* \.(jpg|jpeg|gif|png|swf|rar|zip|css|js|map|svg|woff|ttf|txt)$ {
                        root /shan/blog/;
                        index index.html;
                        add_header Access-Control-Allow-Origin *;
              }
              location /api {# 请求https://blog.yilele.site/api 会代理转发到 api:8888
					  proxy_pass http://apistream;
              }  
}

到此这篇关于nginx静态资源的服务器配置方法的文章就介绍到这了,更多相关nginx静态资源服务器内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!


Tags in this post...

Servers 相关文章推荐
Nginx同一个域名配置多个项目的实现方法
Mar 31 Servers
nginx对http请求处理的各个阶段详析
Mar 31 Servers
Nginx设置HTTPS的方法步骤 443证书配置方法
Mar 21 Servers
Linux下使用C语言代码搭建一个简单的HTTP服务器
Apr 13 Servers
Windows Server 2016 配置 IIS 的详细步骤
Apr 28 Servers
Vscode中SSH插件如何远程连接Linux
May 02 Servers
tomcat默认最大连接数及相关调整方法
May 06 Servers
Nginx报错104:Connection reset by peer问题的解决及分析
Jul 23 Servers
nginx配置指令之server_name的具体使用
Aug 14 Servers
修改Nginx配置返回指定content-type的方法
Sep 23 Servers
Fluentd搭建日志收集服务
Sep 23 Servers
Nginx配置使用详解
nginx代理实现静态资源访问的示例代码
Jul 07 #Servers
使用 DataAnt 监控 Apache APISIX的原理解析
设置IIS Express并发数
Linux中sftp常用命令整理
Jun 28 #Servers
TaiShan 200服务器安装Ubuntu 18.04的图文教程
Jun 28 #Servers
Linux中各个目录的作用与内容
You might like
PHP的中问验证码
2006/11/25 PHP
php socket方式提交的post详解
2008/07/19 PHP
phpMyAdmin2.11.6安装配置方法
2008/08/24 PHP
php递归列出所有文件和目录的代码
2008/09/10 PHP
Zend framework处理一个http请求的流程分析
2010/02/08 PHP
PHP借助phpmailer发送邮件
2015/05/11 PHP
PHP生成制作验证码的简单实例
2016/06/12 PHP
yii2实现 "上一篇,下一篇" 功能的代码实例
2017/02/04 PHP
原生php实现excel文件读写的方法分析
2018/04/25 PHP
Laravel框架Eloquent ORM修改数据操作示例
2019/12/03 PHP
HTML页面如何象ASP一样接受参数
2007/02/07 Javascript
javascript编程起步(第二课)
2007/02/27 Javascript
JQuery 插件模板 制作jquery插件的朋友可以参考下
2010/03/17 Javascript
javascript面向对象程序设计(一)
2015/01/29 Javascript
JavaScript基础函数整理汇总
2015/01/30 Javascript
javascript实现一个简单的弹出窗
2016/02/22 Javascript
JavaScript中${pageContext.request.contextPath}取值问题及解决方案
2016/12/08 Javascript
js限制input只能输入有效的数字(第一个不能是小数点)
2018/09/28 Javascript
使用vant的地域控件追加全部选项
2020/11/03 Javascript
Python多线程爬虫实战_爬取糗事百科段子的实例
2017/12/15 Python
python之DataFrame实现excel合并单元格
2021/02/22 Python
详解python校验SQL脚本命名规则
2019/03/22 Python
Python(PyS60)实现简单语音整点报时
2019/11/18 Python
python找出列表中大于某个阈值的数据段示例
2019/11/24 Python
解决Alexnet训练模型在每个epoch中准确率和loss都会一升一降问题
2020/06/17 Python
python中yield的用法详解
2021/01/13 Python
python中子类与父类的关系基础知识点
2021/02/02 Python
资深财务管理人员自我评价
2013/09/22 职场文书
4s客服专员岗位职责
2013/12/01 职场文书
上课看小说检讨书
2014/02/22 职场文书
啤酒节策划方案
2014/05/28 职场文书
大学团日活动新闻稿
2014/09/10 职场文书
作弊检讨书
2015/01/27 职场文书
法律进社区活动总结
2015/05/07 职场文书
小学生反邪教心得体会
2016/01/15 职场文书