Files
lucky_shop/docs/H5_ROUTER_FIX_README.md
2025-12-31 10:14:59 +08:00

1.1 KiB
Raw Permalink Blame History

H5路由模式修复说明

问题描述

生产环境下,导航到子页面(如 /hwappx/test/pages_tool/form/formdata?id=73&uniacid=2793)后刷新页面,会导致页面空白,显示 <html><head></head><body></body></html>

根本原因

  1. 应用使用了H5的history路由模式
  2. 生产服务器没有配置路由回退机制
  3. 刷新时浏览器直接向服务器请求完整URL路径服务器无法找到对应的资源返回空HTML

解决方案

将H5路由模式从history改为hash模式。Hash模式下所有路由请求都会指向应用根路径避免服务器配置问题。

修改内容

修改 manifest.json 文件中的H5路由配置

"h5": {
    "router": {
        "mode": "hash",  // 从 "history" 改为 "hash"
        "base": "/hwappx/test/"
    }
}

预期效果

  • 子页面刷新后不再空白
  • URL格式变为 http://domain/hwappx/test/#/pages_tool/form/formdata?id=73&uniacid=2793
  • 无需修改服务器配置

构建部署

修改后需要重新构建H5版本并部署到生产环境。可以通过HBuilderX或其他uni-app构建工具进行构建。