Html 为什么'；SammyJS处理包含与普通哈希相同的斜杠的哈希？_Html_Url_Browser_Single Page Application_Sammy.js

Html 为什么'；SammyJS处理包含与普通哈希相同的斜杠的哈希？

html url browser

Html 为什么'；SammyJS处理包含与普通哈希相同的斜杠的哈希？,html,url,browser,single-page-application,sammy.js,Html,Url,Browser,Single Page Application,Sammy.js,受中示例的启发，我尝试在单页应用程序中连接一些简单的行为，使用URL哈希跟踪调用的API端点。我试图以这样的页面历史结束：在任何情况下，URL片段实际上都是原始URL，用于进行呈现当前页面的API调用问题是，当位置哈希包含正斜杠字符时，我无法让Sammy的路由处理正常工作，我不知道为什么。根据“允许字符斜杠（“/”）和问号（“？”）来表示片段标识符中的数据”，所以我觉得我应该能够在URL片段中使用未转换的斜杠和问号字符这是一个完整的复制案例，涵盖了几个不同的场景。定义了两个S

受中示例的启发，我尝试在单页应用程序中连接一些简单的行为，使用URL哈希跟踪调用的API端点。我试图以这样的页面历史结束：

在任何情况下，URL片段实际上都是原始URL，用于进行呈现当前页面的API调用

问题是，当位置哈希包含正斜杠字符时，我无法让Sammy的路由处理正常工作，我不知道为什么。根据“允许字符斜杠（“/”）和问号（“？”）来表示片段标识符中的数据”，所以我觉得我应该能够在URL片段中使用未转换的斜杠和问号字符

这是一个完整的复制案例，涵盖了几个不同的场景。定义了两个Sammy路由-如果我对语法的理解正确，一个应该捕获包含哈希的任何内容，另一个应该只匹配空路由。但事实并非如此

    <!DOCTYPE html>
<html>
<head>
    <title>SammyJS routing demo</title>
    <script type="text/javascript" src="Scripts/jquery-3.1.1.min.js"></script>
    <script type="text/javascript" src="Scripts/sammy-0.7.5.min.js"></script>
</head>
<body>
    <ul>
        <li><a href="#foo">#foo</a> - prints 'foo'</li>
        <li><a href="#/bar">#/bar</a> - prints 'NOPE'</li>
        <li><a href="#!/baz">#!/baz</a> - prints 'NOPE'</li>
        <li><a href="#foo/bar">#foo/bar</a> - prints 'NOPE'</li>
        <li><a href="#foo/bar#bop">#foo/bar#bop</a> - prints 'bop'</li>
        <li><a href="#why?not">#why?not</a> - prints 'why'</li>
        <li><a href="#why?not#zoidberg">#why?not#zoidberg</a> - prints 'why?not#zoidberg'</li>
        <li><a href="#why?not#zoidberg/">#why?not#zoidberg/</a> - prints 'NOPE'</li>
    </ul>
    <script type="text/javascript">
        Sammy(function () {
            this.get('#:url', function () { console.log(this.params.url); });
            this.get('', function () { console.log('NOPE'); });
        }).run();
    </script>
</body>
</html>


SammyJS路由演示

-打印“foo”
-打印“不”
-打印“不”
-打印“不”
-打印“bop”
-打印“为什么”
-打印“为什么？不是#佐德伯格”
-打印“不”

Sammy（函数（）{
get（'#：url'，函数（）{console.log（this.params.url）；}）；
get（“”，函数（）{console.log（'NOPE'）；}）；
}).run（）；

你知道我需要做什么才能让Sammy一致地处理这些片段吗？

因此，Sammy.js如上所述：“如果你想匹配包含“/”的字符串，它就不起作用。如果你想匹配，你可以使用Regexp和“splat”，这就是为什么这个例子失败的原因

但是，如果将第一个

this.get

替换为

this.get（'#（.*），函数（）{console.log（this.params['splat']）；}）然后它工作得很好（好吧，“#为什么？不”忽略了“不”，但这可能在查询字符串中更进一步，“#为什么？不#zoidberg”不是很高兴，但我想说你应该坚持URL中的单个#）
演示了此示例的一个固定实例。
因此，如上所述，Sammy.js表示“如果要匹配包含“/”的字符串，则此方法无效。如果需要，则可以使用Regexp和“splat”，因此此示例失败
但是，如果将第一个this.get
替换为this.get（'#（.*），函数（）{console.log（this.params['splat']）；}）然后它工作得很好（好吧，“#为什么？不”忽略了“不”，但这可能在查询字符串中更进一步，“#为什么？不#zoidberg”不是很高兴，但我想说你应该坚持URL中的单个#）
演示此操作的固定实例。
问题在于URL中的Sammy参数不能包含斜杠字符。如果有，您就不能有像“#/path/：var1/other/：var2”这样的URL。相反，只要匹配路径，您就会希望使用正则表达式，如下例所示（有关更多信息，请参阅）：
上面将输出以下每个路径的URL：





不幸的是，使用此选项将无法获取“？”字符后面的项目。这些被分别解析为“this.params”。因此，以下URL将“this.params.page”设置为适当的值：




不幸的是，您无法在URL中包含多个哈希，Sammy只查看URL中从哈希的最后一个实例开始的部分，从而解释了为什么“#为什么？不#zoidberg”起作用。
问题是URL中的Sammy参数不能包含斜杠字符。如果有，您就不能有像“#/path/：var1/other/：var2”这样的URL。相反，只要匹配路径，您就会希望使用正则表达式，如下例所示（有关更多信息，请参阅）：
上面将输出以下每个路径的URL：





不幸的是，使用此选项将无法获取“？”字符后面的项目。这些被分别解析为“this.params”。因此，以下URL将“this.params.page”设置为适当的值：




不幸的是，您无法在URL中包含多个哈希，Sammy只查看URL中从哈希的最后一个实例开始的部分，从而解释了“为什么？不”#zoidberg“起作用的原因
this.get(/\#(.*)/, function() {
    console.log(this.params['splat']);
});