Question

使用canDeactivate防护措施，我试图阻止浏览器后退。因此，现在将网站网址加载到浏览器的新标签中已成功将我带到初始页面上。现在，在页面上没有任何用户交互的情况下，按浏览器的“后退”按钮可将我带回到新的标签页/空白页状态，而无需进入保护代码。但是，如果在单击后退按钮之前单击任意位置/在应用程序中滚动，则可以很好地触发防护。如何在没有初始页面上用户交互的情况下运行防护，或者通过代码触发用户交互？

在着陆组件中，我尝试创建一个隐藏元素，并尝试将重点放在无法解决的Init上。

我正在延迟加载app-routing.module.ts中的模块

const routes: Routes = [
{
   path: '',
   children: [
   { path: '', redirectTo: '', pathMatch: 'full' },
   { path: 'dashboards',
      loadChildren: './dashboards/dashboards.module#DashboardsModule',
      canLoad: [GoBackGuard],
      canDeactivate: [GoBackGuard]
   }]}];

也尝试使用JavaScript代码来防止浏览器向后导航，但也没有帮助。

<script>
$(window).load(function(e){
   window.history.pushState(null, "", window.location.href);
window.onpopstate = function() {
   window.history.pushState(null, "", window.location.href);
}
});
</script>

Answer 1

将以下内容添加到您的app.component.ts构造函数中：

history.pushState(null, null, document.URL);
window.addEventListener('popstate', function () {
  history.pushState(null, null, document.URL);
});

这将阻止浏览器后退按钮。如果您单击返回，则不会带您回到新标签或上一个标签。

Angular 4初始页面加载可能会停用路由防护功能

1 个答案: