URL 中的符号替换：当输入中已经存在替换时该怎么办？

Question

如果您能想出更好的标题，请随时编辑。

我正在尝试创建一个简单的 JavaScript 系统，该系统根据 URL 的#fragment 标识符（又名哈希）显示某个漫画。

当在此哈希中使用空格或类似的特殊字符时，它们将通过 URL 编码转换为 %20 或类似的序列。

这看起来不太好。因此，当您想通过 URL 中的标题来引用某个漫画、博客文章等时，我相信将所有空格和其他 URL 不安全字符替换为不同的 URL 安全符号是很常见的。事实上，StackOverflow 也是这样做的。

但是，当我要替换的符号也存在于输入字符串中时，我该怎么办？

例如，当我将所有空格 ( ) 替换为连字符 (-) 时，我该如何处理已经存在的连字符？

Answer 1

这是一个普遍的问题，解决方案称为Character Escaping。基本方法如下：

1. 选择一个称为“转义字符”的字符。在 C/C++/Java/etc 中，它是反斜杠 (\)。在 URL 中，它是百分号 (%)。您可以随心所欲。
2. 转义后，您可以定义备用字符集和规则。例如，在 C/C++/Java/etc 中，\n 表示换行，而 \0 是空字符。在 URL 中，% 后跟两个十六进制字符。
3. CRITICAL：确保转义序列包含指定转义字符本身的方法。在 C/C++/Java 中，\\ 表示 \。在 URL 编码中，它是 %25。

对于您的问题，我可以建议您选择 -、# 或 @（但任何合法的未转换 URL 编码字符都可以）。假设您使用 -，那么以下将起作用：

1. --是-
2. -= 可以是空格

（请记住，您是根据上面的元规则制定规则的。随便吧。）

Answer 2

另一种解决方案是以类似于 Stack Overflow 的方式实现它。在 URL 中包含both 内部标识符和“用户友好”标识符。例如，这是此问题的“标准”链接：

http://stackoverflow.com/questions/14543452/symbol-substitution-in-urls-what-to-do-when-replacement-already-exists-in-input

但下面的链接也同样有效：

http://stackoverflow.com/questions/14543452/this-part-of-the-address-is-just-to-look-nice

您可以执行类似的操作，为每个漫画和用户友好的名称添加某种标识符（可能是序号），例如：example.com/comics/#42-the-forty-second-comic-title .

这个系统有很多好处：

• 它很容易实现 - 只需解析第一个破折号 (-) 之前的片段部分并使用它来构建特定漫画的 URL
• 它允许您为漫画提供permanent link，因为即使您碰巧更改了漫画的标题，内部标识符部分也不会改变
• 它允许您轻松重命名漫画，而无需担心更新 URL、图像路径等，因为漫画名称并不是系统正常工作所必需的
• 仅使用客户端 JavaScript 即可轻松实现 Next 和 Previous 按钮（因为您知道 '#23-some-title' 之前的漫画将是 '#23'

Answer 3

您还可以使用 Wikipedia 使用的模式从帖子标题中生成一个 id，与普通的哈希标签相比，它的优势在于它还传达了有关帖子的信息。编写一个transducer 应该相当简单，它接受类似于Some article 的输入并输出Some_Article，但您必须确保生成唯一的ID。例如，对于关键字Machine，维基百科会在http://en.wikipedia.org/wiki/Machine_(disambiguation) 处提供一个消歧页面。