Javascript 使用HTML5历史api获取初始状态

我一直在搜索的所有内容都只是一个如何使用

pushState

，

replaceState

，

history.state

，等等的教程。这些概念很简单，但有一件事我想知道人们是如何解决的，那就是如何知道初始状态是什么

假设你的水疗中心在。去那里，你的应用程序主页被加载，点击周围，它会做一个

pushState

，让你看到它。太好了，现在你看到了一个用户列表，多亏了历史api，这不是一个实际的页面加载

但现在，让我们假设一个用户将该状态标记为书签，并在该URL处启动应用程序。好的，那么你的服务器会监听并提供应用程序。我的问题是，您如何知道

get/users

是当前状态，并且需要显示关联的视图？你知道你的应用程序托管在

https://example.com/en-us/myapp/

然后你就可以知道什么了

大概是这样的：

function getState (uri) {
    return uri.match(/^https:\/{2}(?:w{3}\.)?example.com\/en-us\/myapp\/?(.*)/i)[1];
}

var state = getState(location.href);

---

如果

state

为false，则加载初始视图，否则在

state==='get/users'

时处理状态并显示用户列表？

是的，这是非常正确的。但是，您可以尝试使用

location.pathname

获取状态，这样您的正则表达式就不需要包含域名

例如：

function getState (uri){
  var path = uri.split("myapp", 2)[1];    // This will split the pathname after 'myapp'
  console.log(path)                       // Just for debugging purposes

  // Now we can decide what to do with the path (i.e. "/get/users")
  // For example, we can use a switch or a simple if statement

  if (path === '/get/users'){
    return true
  } else {
    return false
  }

}

var state = getState(location.pathname);

这只是路由器的一个简单例子。您现在可以尝试为SPA构建自己的路由器。此外，如果您希望采用不同的方法，还有许多库供您使用。如果你愿意，可以看看这些

此外，如果您使用框架来构建SPA，它们通常内置了自己的路由功能。这些只是许多内置路由器的框架中的一部分。（对不起，我来了