限制浏览器返回事件:

window.history.pushState(null, "", window.location.href);
window.onpopstate = function () {
    window.history.pushState(null, "", window.location.href);
};

它基本上是分配窗口的“onbeforeunload”事件以及正在进行的文档“mouseenter”/“mouseleave”事件，因此警报只在单击超出文档范围时触发(然后可以是浏览器的后退或前进按钮)

美元(文档)。On ('mouseenter'，函数(e) { 窗口。Onbeforeunload = null; ｝ ); 美元(文档)。On ('mouseleave'，函数(e) { 窗口。onbeforeunload = function(){返回"你的工作将会丢失";}; ｝ );

如何阻止反向功能:

历史。pushState(null, null, location.href); 窗口。Onpopstate = function () { history.go (1); };

如果你使用的是angular，只需在div或容器div中使用*ngIf=loggedout即可。

在组件中设置变量。如果为真，显示其他路由器将重定向到主页。根据你在路由器文件上的配置。

这工作的登录和注销使用用户名为例。至于其他账户相关页面或内部页面，这将是有点难以防止。您可能需要禁用整个浏览器的nav选项卡。

我觉得jordanhollinger.com上的这篇文章是最好的选择。与Razor的答案相似，但更清楚一些。下面的代码;全部归功于Jordan Hollinger:

页面:

<a href="/page-of-no-return.htm#no-back>You can't go back from the next page</a>

no return的JavaScript页面:

// It works without the History API, but will clutter up the history
var history_api = typeof history.pushState !== 'undefined'

// The previous page asks that it not be returned to
if ( location.hash == '#no-back' ) {
  // Push "#no-back" onto the history, making it the most recent "page"
  if ( history_api ) history.pushState(null, '', '#stay')
  else location.hash = '#stay'

  // When the back button is pressed, it will harmlessly change the url
  // hash from "#stay" to "#no-back", which triggers this function
  window.onhashchange = function() {
    // User tried to go back; warn user, rinse and repeat
    if ( location.hash == '#no-back' ) {
      alert("You shall not pass!")
      if ( history_api ) history.pushState(null, '', '#stay')
      else location.hash = '#stay'
    }
  }
}

我遇到了这个问题，需要一个在各种浏览器上正确工作的解决方案，包括Mobile Safari(在发布时是iOS 9)。没有一个解决方案是完全正确的。我提供以下建议(在Internet Explorer 11、Firefox、Chrome和Safari上进行了测试):

history.pushState(null, document.title, location.href);
window.addEventListener('popstate', function (event)
{
  history.pushState(null, document.title, location.href);
});

注意事项:

history.forward() (my old solution) does not work on Mobile Safari --- it seems to do nothing (i.e., the user can still go back). history.pushState() does work on all of them. the third argument to history.pushState() is a url. Solutions which pass a string like 'no-back-button' or 'pagename' seem to work OK, until you then try a Refresh/Reload on the page, at which point a "Page not found" error is generated when the browser tries to locate a page with that as its URL. (The browser is also likely to include that string in the address bar when on the page, which is ugly.) location.href should be used for the URL. the second argument to history.pushState() is a title. Looking around the web most places say it is "not used", and all the solutions here pass null for that. However, in Mobile Safari at least, that puts the page's URL into the history dropdown the user can access. But when it adds an entry for a page visit normally, it puts in its title, which is preferable. So passing document.title for that results in the same behaviour.