344. (javaScript) [간단 소스] 자바스크립트 window.onpageshow 사용해 BFCache 사용 여부 확인 및 web reload 리로드 처리

---

[개발 환경 설정]

​

개발 툴 : Edit++

개발 언어 : JavaScript

 

---

[소스 코드]

 

    <!-- ===================================================================================================== -->
    <!-- [자바스크립트 코드 지정] -->
    <!-- ===================================================================================================== -->
    <script>


        // =======================================================================
        // [자바스크립트 라이프 사이클 및 상태 변경 감지 부분]
        // =======================================================================

        // [dom 생성 및 이벤트 상시 대기 실시]
        document.addEventListener("DOMContentLoaded", ready);
        function ready(){
            console.log("");
            console.log("=========================================");
            console.log("[window ready] : [start]");
            console.log("=========================================");
            console.log(""); 
        }





        // [html 최초 로드 및 이벤트 상시 대기 실시]
        window.onload = function() {
            console.log("");
            console.log("=========================================");
            console.log("[TestFile] : [window onload] : [start]");
            console.log("=========================================");
            console.log(""); 
        };





        // [페이지 show 이벤트]
        window.onpageshow = function (event) {
            if (event.persisted || (window.performance && window.performance.navigation.type == 2)) { 
                console.log("");
                console.log("=========================================");
                console.log("[TestFile] : [window onpageshow] : [BFCahe 로 부터 웹 페이지 복원 됨]");
                console.log("=========================================");
                console.log("");

                // [페이지 리로드 수행] >> [웹페이지 갱신]
                location.reload();
            } 
            else { 
                console.log("");
                console.log("=========================================");
                console.log("[TestFile] : [window onpageshow] : [새롭게 열린 웹 페이지]");
                console.log("=========================================");
                console.log("");
            }
        };


    </script>

---