유연한 JavaScript 단일 페이지 응용 프로그램을위한 라우팅?

Question

페이지/상태를 가로 질러 움직일 때 유연성과 속도를 원하기 때문에 단일 페이지 웹 앱을 만들지 만 라우팅/URL에 어려움을 겪고 있습니다 ...

전통적인 패러다임에서 나는 로 :

example.com/tools/population-tool/#currentYear=1950 
example.com/tools/income-tool/#country=usa 
example.com/nice-story/ 
example.com/nice-chapter/nice-story/ 

지금은 해당 경로 템플릿 및 컨트롤러를로드 (백본을 사용하여 예를 들어) 라우터와 이것을 대체하고 싶습니다. 라우터와

pages : { 
    tools : { 
    template : "#tools", 
    breadcrumb : ["Home","Tools"] 
    } 
    nice-story : { 
    template : "#nice-story", 
    breadcrumb : ["Home","Stories","Nice Story"] 
    } 
} 

, 지금 부하처럼 올바른 콘텐츠 및 페이지 상태가, 같은 URL을 주어진 것 : 나는 페이지를하는 것에 대한 생각하고

상점에 필요한 페이지 정보는 해당 객체

Hashbang를 사용하지 않을 경우

example.com/#!/tools/population-tool/?currentYear=1950

또는 같은

:

,

example.com/tools/population-tool/?currentYear=1950 당신이 URL 방식은 여전히 ​​유연하면서 의미가 있도록이 라우팅을 구성하고 리디렉션 및 새로운 쿼리 문자열을 허용 할 방법

파라메터?

Answer 1

이 귀하의 질문에 대한 완전한 해답이 아니라 백본에 대한 몇 가지 팁 ...

당신은 비울 수 라우터의 loadPage 같은() 메소드를 정의하고 메인 페이지 용기를 교체 할 수 있습니다 앱의 각 '페이지'에 해당하는보기가 표시됩니다. 각 라우트 동작은이를 호출하여 올바른 뷰를로드 할 수 있습니다.

의사 쿼리 문자열을 사용하는 경우 백본 경로에 명시 적으로 일치자를 추가해야합니다. 예 :

'/tools/population-tool/?*params' 

이렇게하면 전체 매개 변수 문자열을 첫 번째 매개 변수로 사용하여 경로 작업을 호출합니다. 당신은 그 구문을 분석해야합니다 ...