0
KnockoutJS SPA tutorial의 예제에서 영감을 얻어 Sammy.js을 사용하여 단일 페이지 응용 프로그램에서 간단한 동작을 연결하고 URL 해시를 사용하여 호출되는 API 끝점을 추적합니다. 나는이처럼 보이는 페이지의 역사와 끝까지하려고 해요 : 모든 경우에SammyJS가 일반 해시와 동일한 슬래시를 포함하는 해시를 처리하지 않는 이유는 무엇입니까?
- http://www.my.app/my_app#/resources
- http://www.my.app/my_app#/resource/some/link
- http://www.my.app/my_app#/resource/some/other/link
- http://www.my.app/my_app#/resource/some/other/link?page=2
- http://www.my.app/my_app#/resource/some/other/link?page=3
의 URL 조각은 실제로 API 호출을하는 데 사용 된 원시 URL입니다. 현재 페이지를 렌더링 한
문제는 위치 해시에 슬래시 문자가 포함되어 있으면 Sammy의 경로 처리가 제대로 작동하지 않을 수 있으며 이유가 무엇인지 알 수 없습니다. RFC3986에 따르면 "문자 슬래시 ("/ ")와 물음표 ("? ")는 조각 식별자 내의 데이터를 나타낼 수 있으므로"이스케이프 처리되지 않은 슬래시와 물음표를 사용할 수 있어야합니다. 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>
새미가 이러한 조각을 일관성있게 처리하려면 어떤 아이디어가 필요합니까?