我有一个现有的应用程序构建Angular8 及其代码由一个网站和 2 个移动应用程序共享Android and IOS，在帮助下捆绑Cordova。
它工作正常，但苹果公司宣布他们很快将不再支持使用UIWebView:
自 2020 年 4 月起，App Store 将不再接受使用 UIWebView 的新应用程序，自 2020 年 12 月起，将不再接受使用 UIWebView 的应用程序更新。
所以我被迫将其迁移到WkWebView。我知道有几个线程Cordova存储库和其他地方，讨论可能的迁移计划（请参阅here例如）。
我也读过this其他问题，但它很旧（Angular 的不同版本）并且没有提供任何具体的解决方案。
所以我决定去cordova-插件-wkwebview-engine插件这似乎是我的情况下最简单的解决方案。
一切都很顺利，直到我在 IOS 模拟器中启动我的应用程序并发现路由不再工作。
我设法通过路由将问题减少到尽可能小的 Angular 应用程序，您可以看到它正在工作here.
我将重现该问题所需的所有步骤都放在此中存储库.
以下步骤需要有node, npm and cordova全局安装：
1.克隆存储库：git clone https://github.com/sasensi/cordova-ios-angular.git
2.移动到存储库目录：cd cordova-ios-angular
3.安装依赖项：npm i
4.创建cordova项目：cordova create cordova com.demo.app DemoApp
5. 构建 Angular 应用程序：npm run build
6.移动到cordova目录：cd cordova
7.添加WkWebView插件：cordova plugin add cordova-plugin-wkwebview-engine
8.添加<preference name="WKWebViewOnly" value="true"/> in ./config.xml
9.添加cordova IOS平台：cordova platform add ios
10.打开platforms/ios/DemoApp.xcodeproj在 XCode (10.1) 中
11. 运行IPhone X模拟器
12.看到路由不起作用：导航部分下方没有呈现任何内容（而应该有当前页面内容）
正如存储库中提到的，使用时一切都按预期工作UIWebView（跳过步骤7. and 8.)
我希望有人已经遇到过同样的问题，并且可以帮助我使我现有的 Angular 应用程序在这个新环境中工作。
经过更深入的挖掘，这个问题与以下事实有关：WkWebView，文件被加载file://协议并且该协议不兼容Angular 位置策略.
我找到了解决方法here，其中包括使用哈希位置策略相反并设置<base>元素href属性值到document.location.
为此，您必须替换常见的<base>元素由<script>document.write('<base href="' + document.location + '" />');</script>它在运行时创建它。
本文内容由网友自发贡献，版权归原作者所有，本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容，请联系:hwhale#tublm.com(使用前将#替换为@)
