uni-app打包h5并部署到nginx,路由模式history
目录
uni-app打包h5并部署到nginx，路由模式history
uni-app打包有些坑，当时运行的基础路径填写了
./
，导致在二级页面刷新之后，页面直接空白。就只能换一个路径了，nginx也要跟着改，下面是具体步骤。
manifest.json配置web
运行路径写
/h5/
，或者写你们网站的目录，比如我这里写了
h5
，到时候访问的地址就是
127.0.0.1/h5
，对，带了一个h5
nginx配置
需要在nginx里面配置一个
/h5
配置，然后我这里还配置了一个
location /
的，让他重定向到
/h5
，这样用户输入
127.0.0.1
的时候会重定向
127.0.0.1/h5
，这个可以按需添加。
server {
listen 80;
server_name localhost;
# 重定向根路径 / 到 /h5
location / {
return 301 /h5;
}
# 访问/h5的配置
location /h5 {
root html/webH5;
index index.html index.htm;
try_files $uri $uri/ /h5/index.html;
}
# 访问后台接口的配置
location /web/server/ {
proxy_set_header Host $http_host;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header REMOTE-HOST $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_pass http://localhost:8080/web/server/;
}
error_page 500 502 503 504 /50x.html;
location = /50x.html {
root html;
}
}打包成网站
把打包之后的文件，丢到nginx里面的
\html\webH5\h5
目录下面，如果你的文件不是放到这个地方的，那就改一下nginx的
root html/webH5;
配置，改成你自己的目录
打包之后请求后台地址想用相对地址的话，可以参考