직지 3.1.30버전으로 만든 이북이 Edge에서 페이지 이동시 종료 알럿이 뜨는 현상

BaeKeun commented 1 year ago

Edge 브라우저에서 해당 url을 접속 http://www.sncci.net/new/ebook/2022_0910/index.html 페이지 이동 버튼을 누르면 사이트에서 나갈건지 묻는 알럿창이 뜹니다.

이전 버전인 3.1.15 버전으로 제작했던 이북은 해당 현상이 없습니다. http://www.sncci.net/new/ebook/2022_0708/index.html

직지 버전의 문제인가 싶어 3.1.15버전 인스톨 파일을 설치해서 로그인 하려고 하면 리소스를 허용안한다는 에러창이 뜹니다.

vulcan9 commented 1 year ago

사용자 인증 문제

인스톨러 기준으로 Jik-ji Editor 3.1.15-demo 이전 버전은 라이선스 체크 방식이 현재와 다릅니다. 이전 버전은 서버에서 체크되지 않습니다. Jik-ji Editor 3.1.37-demo 이후 버전부터 정상 동작 합니다.

vulcan9 commented 1 year ago

페이지 이동시 뜨는 Prompt 창 문제

페이지 랜더러 스크립트에 문제와 관련된 다음 코드가 삽입됨 (2022.10.06 이후)

jik-ji API 에서 unload 이벤트가 발생하지 않는 현상 보정하기 위해 beforeunload 이벤트 추가됨

$(window).one('beforeunload', unload);

function unload(event){
    ...
    event.preventDefault();
    event.returnValue = '';

    $document.triggerHandler('unload');
}

prompt 창을 띄우지 않을 의도로 preventDefault 등의 코드를 작성한 것으로 보이나 beforeunload 이벤트에서는 기본 동작을 막으면(preventDefault 되면) prompt가 발생함
prompt 창을 띄우지 않으려면 기본 동작을 막으면 안됨

동작하지 않는 코드

또한 위 코드는 다음 몇가지 잘못된 점으로 (다행히도) 동작하지 않는 코드임

브라우저 호환성

beforeunload 이벤트에서는 preventDefault 동작 안함

브라우저 호환성을 고려한 기본 동작을 막는 코드 (prompt 띄우는 코드) https://developer.mozilla.org/ko/docs/Web/API/Window/beforeunload_event

event.preventDefault();
return (event.returnValue = '');
// 핸들러에서 '' 값을 리턴해줘야함

jquery 이벤트 객체 사용

위 표에서 보면 beforeunload 이벤트에서 preventDefault 동작 안하더라도 event.returnValue = '' 코드는 동작하므로 prompt 창이 떠야할텐데 위 코드는 그렇게 동작하질 않았다. 이유는 jquery 이벤트 객체를 직접 사용했기 때문이다

$(window).one('beforeunload', unload);
function unload(event){
    ...
    // 이 코드도 동작하지 않는다. 
    event.returnValue = '';
    // 동작하려면 다음과 같이 작성해야함
    // event.originalEvent.returnValue = '';
    ...
}

// 또는 jquery 사용안함
window.addEventListener('beforeunload', unload);
function unload(event){
    ...
    event.returnValue = '';
    ...
}

어쨌든 `beforeunload` 이벤트를 막는 코드는 동작하지 않았다

chromium 업데이트

Chromium 112.0.5615.137 부터 preventDefault 메서드가 동작하도록 업데이트 됨 (대략 2023.04~2023.05 사이) Issue 866818: preventDefault ignored in beforeunload

따라서 동작하지 않던 위 코드가 동작을 하게되고 최신 브라우저(크롬, 엣지)에서 prompt 창이 뜨기 시작함

크롬 브라우저 M114 버전에서는 다시 기능을 롤백한것 같음. prompt 창 안뜸
Edge 브라우저에서는 prompt 창 뜸
nwJS 0.77.0 버전에서 prompt 창 뜸 (chromium 114.0.5735.91)

chromium 업데이트로 `beforeunload` 이벤트를 막는 코드가 동작하기 시작했다

버그 수정

Jik-ji_Editor_3.2.19 버전(이상)에서 처리(구현) 되었습니다.

beforeunload 이벤트에서 기본동작을 막는 코드 삭제함

vulcan9 commented 1 year ago

Prompt 창 문제가 발생하는 epub 출판물

beforeunload 이벤트 코드가 추가된 버전 ~ 패치 이전 버전으로 출판된 epub 파일

Jik-ji_Editor_3.1.30 (배포 : 2022.10.12) 이후 버전 부터
Jik-ji_Editor_3.2.20 버전 (배포 : 2023.07.14) 이전(버그 수정 버전) 버전 까지

두 버전 사이 버전으로 출판된 epub 파일은 prompt 창이 뜰 가능성이 있음

문제되는 epub 지원

패치 버전으로 재출판

Jik-ji_Editor_3.2.20 이후 버전으로 epub을 재출판 함

뷰어에서 페이지의 이벤트 제거

출판된 epub 파일을 모두 재출판 하는것은 매우 어렵기 때문에 뷰어에서 이 문제를 지원해 줄 수도 있음 다음은 뷰어에서 페이지에 등록된 beforeunload 이벤트를 무력화 시키는 의사 코드임

// 문제되는 버전 찾기
var version = $('#PageLeft').contentWindow.$data.project.get().version();
// version 출력 : 'Jik-Ji Editor 3.1.30 (버전명)'

// version 이 3.1.30~3.2.19 사이이면
// 페이지의 모든 beforeunload 이벤트 핸들러 제거됨
var leftWin = $('#PageLeft').contentWindow;
leftWin.$(leftWin).off('beforeunload');

// 아래 코드는 페이지의 이벤트 코드보다 나중에 실행 되므로 효과 없음
// $('#PageLeft').contentWindow.addEventListener('beforeunload', function (e){});
// $('#PageLeft').contentWindow.onbeforeunload = function(){};

위 코드의 잠재적인 문제점은 페이지의 모든 beforeunload 이벤트가 제거된다는 점임

vulcan9 commented 10 months ago

(2023.12.19) 추가

OPS/_framework/js/render/render.app.min.js 파일을 다음 파일로 패치해서 사용해보세요. 출판물 버전과 호환이 된다면 (console 창에 에러가 나지 않는다면) 문제가 해결될 수도 있습니다.

render.app.min.zip

vulcan9 / jikji.editor