Nginx 文件配置

Nginx 文件配置

  1. 安装nginx

  2. 熟悉nginx操作命令

  3. 编辑nginx.conf

vim /usr/local/etc/nginx/nginx.conf
  1. 修改其中的内容
server {
	// 启动后的端口
	listen       8080;
	// 启动后访问的地址
	server_name  localhost;

	// location可并列设置多个
	// 启动后浏览器输入localhost:8080 默认会访问html文件夹中的index.html文件
	location / {
		// root地址可以更改为本地项目地址
		root   html;
		index  index.html index.htm;
	}
	// 访问项目test1转发地址 下面设置的地址是本地启的服务地址
	// 输入localhost:8080/test1/index.html 等于访问http://127.0.0.1:5500/test1/index.html
	location /test1/ {
		proxy_pass  http://127.0.0.1:5500;
	}
	// 访问项目test2转发地址
	location /test2/ {
		proxy_pass  http://127.0.0.1:5533;
	}
	
	// 404页面同样配置在html文件夹中
	error_page  404              /404.html;
	location = /404.html {
		root   html;
	}
   // 其他错误页设置
	error_page   500 502 503 504  /50x.html;
		location = /50x.html {
			root   html;
		}
	}

	// 配置代理,由于项目是在本地起动的,而我们的request需要请求其他ip地址。
	// 如果你的request链接为localhost:8880/api/login?name=12345,最终会代理到 http://192.168.0.0:80/api/login?name=12345
	location /api {
		proxy_pass  http://192.168.0.0:80;
	}

	// 一般前端不管用vue,还是react等框架,默认都是单页面的,如果项目是多页面的,则需要用到下面的配置。
	// 此时你的浏览器的url不是localhost:8880/#/login,而是 localhost:8880/a.html/#/login
	// 所以需要将路径中a.html指向具体的html文件夹中的文件,因为默认是index.html
	location /a.html {
		alias  html;
		index  a.html;
	}
	location /a.html {
		alias  html;
		index  a.html;
	}
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值