本地部署一个vue的demo项目,用npm运行web服务的访问端口是8888
问题
直接在浏览器访问http://localhost:8888/,打开速度很快,在1s左右。
部署nginx,并做如下配置,用于前端web和后台服务保持在同一域名下。
server {
listen 9090;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
#前端地址
proxy_pass http://localhost:8888/;
}
location /sys{
#后台服务地址
proxy_pass http://localhost:8088/sys/;
}
}
浏览器访问http://localhost:9090/可以正常跳转到前端端口8888的地址页面,但加载时间很久超过30s。
查看控制台后发现是加载js文件非常慢,但其实每个js文件都很小,排除了文件大小和带宽问题。
解决
将proxy_pass后的地址 localhost替换为127.0.0.1,修改后配置如下
server {
listen 9090;
server_name localhost;
#charset koi8-r;
#access_log logs/host.access.log main;
location / {
#前端地址
proxy_pass http://127.0.0.1:8888/;
}
location /powersys {
#后台服务地址
proxy_pass http://127.0.0.1:8088/powersys/;
}
}
重启nginx服务后,再次访问http://localhost:9090/,用时1s左右,访问正常了。