앵귤러 라우팅 해시 패턴과 HTML5 패턴

작은 쓰레기 같은 놈들 · 게시됨 2020. 5. 28. 오후 4:35:03

라우팅에 대한 두 가지 전략

PathLocationStrategy - 기본 정책으로, "HTML 5 pushState" 스타일을 지원합니다.
HashLocationStrategy - "해시 URL" 스타일을 지원합니다.

어떤 전략이 더 나은가요?

전략을 정하고 프로젝트 초기에 실행해야 합니다. 앱이 프로덕션에 들어가면 이미 URL 참조가 많아 변경하기 쉽지 않습니다.

거의 모든 Angular 프로젝트는 기본 HTML 5 스타일을 사용합니다. 생성되는 URL은 사용자가 이해하기 쉬워지며, 앞으로 서버 측 렌더링 공간도 남겨둡니다.

서버 측에서 특정 페이지를 렌더링하는 것은 앱이 처음 로드될 때 반응성을 크게 향상시킬 수 있는 기술입니다. 원래 10초 이상 걸리는 앱들이 서버 측에서 미리 렌더링되어 사용자의 기기에서 1초 이내에 렌더링될 수 있습니다.

이 옵션은 앱의 URL이 중간에 해시(#)가 없는 표준 웹 URL처럼 보일 때만 작동합니다.

해시 라우팅을 꼭 써야 할 강한 이유가 없다면, 기본 HTML 5 라우팅 스타일을 고수하는 게 좋습니다。

angular-cli는 기본적으로 HTML5 히스토리 모드를 사용합니다.

URL 유사 http://localhost:4200/task-list,

URL이 더 편안하고 아름답게 보입니다. 라우팅 페이지에서 새로고침하면 404가 표시됩니다

또한 해시 패턴이라는 패턴도 있습니다.

URL 유사 http://localhost:4200/#/task-list,

경로 페이지로 이동해서 새로고침해도 여전히 현재 경로에 머무릅니다.

해시 라우팅 모드 방식을 활성화하세요

app.module.ts 소개 및 제공

로그인이 보이네요.

[각] 앵귤러 라우팅 해시 패턴과 HTML5 패턴

관련 게시물

본 섹션