使用nginx对特定js请求进行转发,加速js加载过程

在项目中内嵌了一个iframe,iframe加载过程中有个js,经过压缩后大约有10M。这极大地减慢了页面加载的速度,由于这个js是固定的,并不会改变,所以采用静态资源的形式使用nginx加速存取。

1.目标js的url

目标js的url:http://localhost/myapp/myprefix/username/static/lab/xxxxxx.js
这个js我们可以拆分成三个部分:

  • 第一部分:http://localhost/myapp/myprefix 这一部分是固定的,每一次请求都是这个前缀
  • 第二部分:/username 这一中间部分是变量,每一个不同的用户进行请求都不相同
  • 第三部分:/static/lab/xxxxxx.js 这是最后的后缀部分,每个请求也是相同的

由此可见,我们对于这些js的转发关键就是在于怎么将用户名这一变量排除在我们nginx的正则规则之外。

2.nginx的location内转发规则

location中有几个常用的转发关键词,我们分别简单看一下用法:

由于我们这里只需要把js转发出去,所以匹配到对应的url后使用alias是最简便的

3.正则的匹配

	// 使用如下正则即可
	location ~ ^(.+)/(.+)/(.+)/static/lab/(.+)$ {
		alias /data/$4;
	}
	// 将js文件放到/data目录下即可
	// 如果对nginx转发的情况想多了解一下可以查看日志
	// /var/log/nginx/access.log   正常转发的日志
	// /var/log/nginx/error.log    nginx转发出错的日志

正则匹配规则
简单地学一些正则:

  • ^ 代表以什么开头的匹配
  • $ 代表以什么结尾的匹配
  • ~ 代表区分大小写匹配

了解这些对于本需求就足够了,有更复杂的应用场景可以多学一点正则!

  • 0
    点赞
  • 1
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值