Nginx 常用的基础配置(web前端相关方面)
文章出处:https://juejin.cn/post/7196859948554715195
基础配置
user root;
worker_processes 1;
events {
worker_connections 10240;
}
http {
log_format '$remote_addr - $remote_user [$time_local] ' '"$request" $status $body_bytes_sent ' '"$http_referer" "$http_user_agent"';
include mime.types;
default_type application/octet-stream;
sendfile on;
#autoindex on;
#autoindex_exact_size off;
autoindex_localtime on;
keepalive_timeout 65;
gzip on;
gzip_disable "msie6";
gzip_min_length 100;
gzip_buffers 4 16k;
gzip_comp_level 1;
gzip_types text/plain application/x-javascript text/css application/xml text/javascript application/x-httpd-php image/jpeg image/gif image/png;
gzip_types "*";
gzip_vary off;
server_tokens off;
client_max_body_size 200m;
server {
listen 80 default_server;
server_name _;
return 403 /www/403/index.html;
}
include ../serve/*.conf;
}
隐藏 Nginx 版本信息
http {
server_tokens off;
}
禁止ip直接访问80端口
server {
listen 80 default;
server_name _;
return 500;
}
启动 web 服务 (vue 项目为例)
server {
# 项目启动端口
listen 80;
# 域名(localhost)
server_name _;
# 禁止 iframe 嵌套
add_header X-Frame-Options SAMEORIGIN;
# 访问地址 根路径配置
location / {
# 项目目录
root html;
# 默认读取文件
index index.html;
# 配置 history 模式的刷新空白
try_files $uri $uri/ /index.html;
}
# 后缀匹配,解决静态资源找不到问题
location ~* \.(gif|jpg|jpeg|png|css|js|ico)$ {
root html/static/;
}
# 图片防盗链
location ~/static/.*\.(jpg|jpeg|png|gif|webp)$ {
root html;
valid_referers *.deeruby.com;
if ($invalid_referer) {
return 403;
}
}
# 访问限制
location /static {
root html;
# allow 允许
allow 39.xxx.xxx.xxx;
# deny 拒绝
deny all;
}
}
PC端和移动端使用不同的项目文件映射
server {
......
location / {
root /home/static/pc;
if ($http_user_agent ~* '(mobile|android|iphone|ipad|phone)') {
root /home/static/mobile;
}
index index.html;
}
}
一个web服务,配置多个项目 (location 匹配路由区别)
server {
listen 80;
server_name _;
# 主应用
location / {
root html/main;
index index.html;
try_files $uri $uri/ /index.html;
}
# 子应用一
location ^~ /store/ {
proxy_pass http://localhost:8001;
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
# 子应用二
location ^~ /school/ {
proxy_pass http://localhost:8002;
proxy_redirect off;
proxy_set_header Host $host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
# 静态资源读取不到问题处理
rewrite ^/api/profile/(.*)$ /(替换成正确路径的文件的上一层目录)/$1 last;
}
# 子应用一服务
server {
listen 8001;
server_name _;
location / {
root html/store;
index index.html;
try_files $uri $uri/ /index.html;
}
location ^~ /store/ {
alias html/store/;
index index.html index.htm;
try_files $uri /store/index.html;
}
# 接口代理
location /api {
proxy_pass http://localhost:8089;
}
}
# 子应用二服务
server {
listen 8002;
server_name _;
location / {
root html/school;
index index.html;
try_files $uri $uri/ /index.html;
}
location ^~ /school/ {
alias html/school/;
index index.html index.htm;
try_files $uri /school/index.html;
}
# 接口代理
location /api {
proxy_pass http://localhost:10010;
}
}
配置负载均衡
upstream my_upstream {
server http://localhost:9001;
server http://localhost:9002;
server http://localhost:9003;
}
server {
listen 9000;
server_name test.com;
location / {
proxy_pass my_upstream;
proxy_set_header Host $proxy_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}
}
SSL 配置 HTTPS
server {
listen 80;
server_name www.xxx.com;
# 将 http 重定向转移到 https
return 301 https://$server_name$request_uri;
}
server {
listen 443 ssl;
server_name www.xxx.com;
ssl_certificate /etc/nginx/ssl/www.xxx.com.pem;
ssl_certificate_key /etc/nginx/ssl/www.xxx.com.key;
ssl_session_timeout 10m;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2;
ssl_prefer_server_ciphers on;
location / {
root /project/xxx;
index index.html index.htm index.md;
try_files $uri $uri/ /index.html;
}
}
链接:https://juejin.cn/post/7196859948554715195
来源:稀土掘金
Nginx 常用的基础配置(web前端相关方面)的更多相关文章
- HTML5零基础学习Web前端需要知道哪些?
HTML零基础学习Web前端网页制作,首先是要掌握一些常用标签的使用和他们的各个属性,常用的标签我总结了一下有以下这些: html:页面的根元素. head:页面的头部标签,是所有头部元素的容器. b ...
- Web前端相关资源
Web前端相关 GRUNT: js task runner Sea.js: js模块化 knockout.js:MVVM开发前台,绑定技术 Angular.js: 使用超动感HTML & JS ...
- 零基础转行web前端,如何高效的去学习web前端
web前端开发要学的知识内容涉及的会很宽泛,虽然说主要是HTML.CSS和JavaScript这些基础知识点,但学前端开发除了要学这些基础知识外,学员还要在这之上进行延伸和深入的去学,而且互联网时代不 ...
- nginx常用功能和配置
nginx常用功能和配置 1.nginx常用功能和配置 1.1 限流 1.2 压力测试工具--Ab 1.2.1安装 1.2.2 测试 1.2.3 返回值 1.3 limit_conn_zone 1.4 ...
- 零基础学习Web前端开发
目录 技术背景 开发环境 学习过程 参考资料 结束语 技术背景 什么是前端开发? 前端开发是创建Web页面或App等将界面呈现给用户的过程.通过使用 HTML,CSS,JavaScript,以及它们衍 ...
- 零基础学WEB前端-CSS
CSS指层叠样式表(Cascading Style Sheets),CSS 是标准的布局语言,用来控制元素的尺寸.颜色.排版.CSS 由 W3C 发明,用来取代基于表格的布局.框架以及其他非标准的表现 ...
- 零基础转行web前端,要学习多久?需要掌握些什么?
web前端开发技术人才越来越吃香,而且web前端领域划分越来越细,对技术的需求越来越高,想学习web前端的人也是越来越多.那么,如何学习web前端知识?从哪开始?转型成为web前端工程师需要学些什么? ...
- Nginx简介与基础配置
何为Nginx? Nginx ("engine x") 是一个高性能的HTTP和反向代理服务器,也是一个IMAP/POP3/SMTP服务器.最初是为了解决C10k的问题,由Igor ...
- web前端相关的书籍
一.Javascript方面的书籍: 1 JavaScript权威指南(第6版):号称javascript圣经,前端必备:前端程序员学习核心JavaScript语言和由Web浏览器定义的JavaScr ...
- centos7安装nginx并配置web前端环境。
1.安装nginx -sudo yum install nginx 2.启动nginx - systemctl start nginx 3.修改nginx路径配置,/etc/nginx/nginx.c ...
随机推荐
- AT-abc347(C,D)
AtCoder Beginner Contest 347 C - Ideal Holidays 这场做得最头疼的题 分析 容易想到先用$(d_i+a+b-1)%(a+b)+1$把$d_i$映射到$[1 ...
- #线段树,离散#nssl 1476 联
分析 由于下标过大,考虑离散,不仅仅是区间左右端点 假设只有一个区间从1到\(x\),那么修改后答案应该是\(x+1\) 所以说还要记录右端点+1的位置,你以为这就能A了吗 为了避免标记被覆盖,无论是 ...
- OpenHarmony 官网文档有哪些上新?上篇:应用开发文档上新
随着 OpenAtom OpenHarmony(以下简称"OpenHarmony")系统能力持续升级,已具备支撑复杂带屏标准设备和应用开发的基础能力.相较于旧版本,OpenHarm ...
- 常用的Numpy通用函数列表
官网来源:Universal functions (ufunc) - NumPy v1.21 Manual 数学运算(Math operations) 表达式 定义 add(x1, x2, /[, o ...
- 学习笔记——Python基础
字符串索引 str = '我是一名学生' print(str[0]) #输出"我" print(str[-6]) #输出"我" 字符串切片:把数据对象的一部分拿 ...
- 【FAQ】获取Push Token失败,如何进行排查?
一. 获取Push Token的方式 获取Push Token有两种方式:一种是调用getToken方法向Push服务端请求Token,当getToken方法返回为空时,Token可通过onNewTo ...
- 携手HMS Core统一扫码服务, 兴业证券优理宝App提升用户扫码体验
兴业证券优理宝App联合华为HMS Core,集成HMS Core统一扫码服务,在提升扫码成功率的同时,还支持C端用户用手机端APP扫描手表端二维码,实现行情在手机与手表间跨终端流转,行情信息,抬腕可 ...
- Qt数据结构-QString二:QString的arg能不能像Python的format一样使用
常规QString拼接字符串我们是这样写的 QString s = QString("My name is %1, age %2").arg("zhangsan" ...
- (数据科学学习手札159)使用ruff对Python代码进行自动美化
本文示例代码已上传至我的Github仓库https://github.com/CNFeffery/DataScienceStudyNotes 1 简介 大家好我是费老师,在日常编写Python代码的过 ...
- 基于Canvas实现的简历编辑器
基于Canvas实现的简历编辑器 大概一个月前,我发现社区老是给我推荐Canvas相关的内容,比如很多 小游戏.流程图编辑器.图片编辑器 等等各种各样的项目,不知道是不是因为我某一天点击了相关内容触发 ...