历史 API 和域级 URL答案

【问题标题】：History API and domain-level urls历史 API 和域级 URL
【发布时间】：2013-05-21 00:27:41
【问题描述】：

我在 MyDomain.com 上有两个页面。从 MyDomain.com/ 和 MyDomain.com/Foo/Bar 可见的索引视图。每个视图都有一个 ajax 调用，每个视图都使用 HTML5 History API 推送状态。

产生问题的步骤有：

从 MyDomain.com/ 开始（按预期工作。）
单击指向 MyDomain.com/Foo/Bar/ 的 ajax 链接（按预期工作。）
单击指向 MyDomain.com/ 的 ajax 链接（按预期工作。）
点击 ajax 链接到 MyDomain.com/Foo/Bar/

现在 URL 显示为 MyDomain.com/Foo/Foo/Bar/

我不想要 Foo Foo Bar。

我目前的解决方法是在 URL 的前面添加“../../../”，但这并不优雅，也不是万无一失的。另一种选择是计算目录级别的正则表达式。

有没有更好的方法来使用 History API 获取绝对 URL？

function push(updateElementID, controller, action, url)
{
    if (typeof url == "undefined")
    {
        url = "/" + controller + "/" + action;
    }
    var state = {
        id: updateElementID,
        controller: controller,
        action: action
    }

    history.pushState(state, null, url);
}

【问题讨论】：

标签： javascript html html5-history

【解决方案1】：

您可能希望确保清除 DOM 中 href 元素的基本元素...至少在以下情况下，它适用于我：在您的共享布局页面 (_layout.cshtml) 上，重置绝对通过在 head 标记中放置以下内容，在 DOM 中获取 URL：

<base id="htmldom" href="http://localhost:59805/"/>

当然要替换您的端口号并在启动时将根 URL 替换为实际域名。

通过这样做，您正在设置或重置 href 属性并为所有其他相对 URL 指定基本 URL。

现在这样做会影响页面中保留在后退和前进按钮之间的任何用户输入数据吗？我猜应该没问题，因为上面只重置了 href 属性，并且 DOM 中的任何其他信息都应该存在。

【讨论】：