从app中点嵌入app的h5页面 在h5中跳转h5内部页面 返回上一级时 直接退h5页面到app首页 是什么原因导致 如何解决该问题

Question

从app中点嵌入app的h5页面 在h5中跳转h5内部页面 返回上一级时 直接退h5页面到app首页 是什么原因导致 如何解决该问题

Answer 1

以下回复参考：皆我百晓生、券券喵儿等免费微信小程序作答:

当从一个APP中点击嵌入一个H5页面，并且在H5页面中跳转至其他内部页面时，如果在返回上一级页面时直接退回到APP的首页，可能涉及以下几个原因：

1. WebView的导航机制问题：在某些WebView组件中，当你从嵌套的H5页面尝试返回时，可能会触发全局的返回事件，导致直接返回到APP的首页。这可能是由于WebView组件的默认行为导致的。
2. 代码实现问题：在前端代码的实现上可能存在不当，比如在路由切换时没有正确处理返回栈或使用了不当的路由方式。例如，如果直接在跳转时使用了绝对路径而不是相对路径，可能会导致直接返回到首页。
3. 移动设备系统的跳转规则：不同设备对网页内部的导航规则可能存在差异。在标准浏览器上使用的历史API和某些移动设备的Web视图处理方式可能会有所不同。因此可能会因为操作系统或浏览器对页面的返回逻辑处理方式不同而产生上述行为。

针对这个问题，你可以尝试以下几种解决方法：

1. 检查并修改路由实现方式：确保你在H5页面中使用了正确的路由实现方式，尤其是当你从一个内部页面跳转到另一个内部页面时。可以考虑使用相对路径而不是绝对路径来避免直接返回到首页。同时检查你的路由配置是否设置了错误的返回行为。
2. 自定义返回逻辑：如果问题仍然存在，你可能需要在你的前端代码中自定义返回逻辑。当点击返回按钮时，可以使用代码逻辑来判断应该返回到哪一个页面。可以使用前端的状态管理库如Vuex等来保存当前的页面栈状态，然后自定义返回逻辑来实现正确导航。
3. 更新或使用不同的WebView组件：如果你在开发原生APP并且使用的是自定义的WebView组件嵌入H5页面，可以尝试更新或更换WebView组件来查看是否解决了问题。某些WebView组件可能提供了更细粒度的控制来管理页面导航。
4. 测试不同的移动设备：由于移动设备系统的跳转规则可能存在差异，建议在不同的设备和浏览器上进行测试，以确定是否是特定设备或浏览器的问题。同时考虑在不同的系统版本上测试以获取更全面的结果。

如果以上方法仍然无法解决问题，可能需要进一步调查具体的代码实现和环境配置来找到根本原因并解决该问题。