프로그래밍언어/JavaScript 2017.07.04 11:55

director.js 새로고침 시 이슈

클라이언트-사이드 및 서버-사이드 URL 라우터인 director.js 를 사용하던 중, 브라우져에서 새로고침을 했을 경우 해시 라우트 정보가 반영되지 않던 이슈가 있었습니다.

<head> 태그에도 넣어보고 readyState 의 interactive, complate 에도 처리해보았지만 반영이 되질 않아, 검색해보니 해당 이슈는 많이 알려진 이슈였었습니다.

해결법은 다음과 같습니다.:


function initApp(e) {
    if (e.target.readyState === 'interactive') {
        var router = Router().init();
        router.on('/page/:name', pageLoader);
    }
    if (e.target.readyState === 'complate') {
    }
    // 아래 코드를 넣어서 새로 고침 시 기존에 등록되어 있던 해시 라우트가 처리되도록 해야합니다.
    window.dispatchEvent(new HashChangeEvent("hashchange"));
}

document.addEventListener('readystatechange', initApp, false);

참고

태그들 ,