将旧锚链接重定向到新锚链接

Question

我正在大修别人为我的组织构建的网站。它最初是用“不太好”的锚链接设置的，其中包括空格。我已经用效果更好的新锚替换了这些锚。

示例： 其中一个旧锚看起来像这样/course/#To Have，幸运的是浏览器会转换为/course/#To%20Have。我把那个锚改成了：/course/#to-have。

我现在想确保任何可能已在社交媒体上共享或可能从其他网站链接到的锚点仍然有效；我打算通过 .htaccess 文件中的重定向来执行此操作，例如这个：

Redirect 301 /course/#To%20Have /course/#to-have

经过一些研究，我发现这是不可能的，因为 URL 中有 #。而且我也没有看到一个锚被重定向到另一个锚的例子。

这可能吗？

Answer 1

正如我在评论中提到的，.htaccess 无法做到这一点。

原因是：散列部分（称为 片段）实际上并未发送到服务器，因此 Apache 无法获取它。服务器只能在此之前获取所有内容，这在this article 的语法部分中进行了描述。

作为替代方案，我建议您在滚动到其位置之前使用 JavaScript 转换片段。你可以通过拉入[window.]location.hash的值来实现（方括号中的部分是可选的，因为location在全局范围内也可用）如果它存在，如下所示：

if (window.location.hash) {

    // Function to 'slugify' the fragment
    // @see https://gist.github.com/mathewbyrne/1280286#gistcomment-1606270

    var slugify = function(input) {
        return input.toString().toLowerCase().trim()
            .replace(/\s+/g, '-')           // Replace spaces with -
            .replace(/&/g, '-and-')         // Replace & with 'and'
            .replace(/[^\w\-]+/g, '')       // Remove all non-word chars
            .replace(/\-\-+/g, '-');        // Replace multiple - with single -
    }

    // Now get the hash and 'slugify' it

    var hash = slugify(window.location.hash.split('#')[1]);

    // Go to the new hash by setting it

    window.location.hash = '#' + hash;

}