아이폰에서 ckeditor 로딩이 되지 않는 이유를 알 수 있을까요?
| CMS/프레임워크 | Rhymix 1.9 |
|---|---|
| 개발 언어 | PHP 7.4 |
| 문제 페이지 주소 | 비공개 (작성 후 5일 경과) |
최근에 모바일에서 자꾸 잡오류가 많이 뜨네요.
안드로이드 폰에서는 ckeditor가 정상적으로 출력 되는데
아이폰에선 로딩이 안되네요;;
개발자도구 보면
Uncaught TypeError: Cannot read property 'replace' of null
at HTMLDocument.<anonymous> (index.php?mid=change&act=dispBoardWrite:277)
at fire (jquery-2.2.4.js?20200723173339:3187)
at Object.fireWith [as resolveWith] (jquery-2.2.4.js?20200723173339:3317)
at Function.ready (jquery-2.2.4.js?20200723173339:3536)
at HTMLDocument.completed (jquery-2.2.4.js?20200723173339:3552)
이런 오류가 뜨고 index.php?mid=change&act=dispBoardWrite:277 찾아 가보면
$('head').append('<st' + 'yle>' + additional_styles + css_content.replace(/\.xe_content\.editable/g, '.cke_wysiwyg_div') + '</st' + 'yle>');
위 부분이 문제가 되네요..
해태맛동산
Lv. 3
댓글 29
modules/editor/skins/ckeditor/editor.html 29번째 줄 전후
{@ $css_content = null }
이 부분을
{@ $css_content = "" }
이렇게 바꿔주세요.
저희는 에디터는 뜨는 글쓰기 창에서 취소버튼을 누르면 입력 공간인 것 처럼 커서가 버튼 위에 깜빡이고 하는 증상이 있는데 혹시 뭐가 문제일까요.....
해당 화면에서 메뉴 버튼을 눌러 메뉴가 나오면 메뉴 중 하나를 터치해도 역시 메뉴 위에서 커서가 깜빡이네요...
비밀,공개,댓글 허용 체크를 누르기도 힘드네요..
댓글도 새창에서 댓글쓰기 CK에디터인데 댓글 쓰는 곳에서는 이상이 없네요.
사이트 2개가 현재 같은 증상이네요. 아이폰으로 테스트를 안해봤는데 지금 해보니 그렇네요.
태그가 제대로 안 닫혀서 버튼 부분까지 에디터의 일부로 잘못 인식하거나... 커서가 깜빡이는 것이 아니라 그 부분의 글자가 잠깐 선택되었다가 취소되는 것이거나... 아니면 라르게덴님이 최근 작업해 주신 iOS 패치의 부작용일 수도 있습니다. (자세히 보지는 않았습니다만, ios_enterkey 플러그인에서 IME 상태를 강제로 변경하기 위해 window.getSelection()을 조작하는 방식을 사용한다면 엉뚱한 곳의 글자가 순간적으로 선택될 가능성이 없지 않습니다.)
에디터자동완성 모듈은 계속 서비스를 해서 의존했던거라 서비스를 없애긴 곤란한 상황이라 지속 서비스를 해야 하긴 한데요.
혹시 제가 예전에 웹지기님 글에 댓글 달았던 내용이 있는데 기억하시나요?
https://xetown.com/topics/1426945#comment_1427187
방금 이야기 하신 현상이 웹지기 님이 겪은 현상과 같습니다.
혹시 두 사이트 모두 엔터키 플러그인을 사용해제하셨는지요?
이게 문제가 복잡한게 엔터키 플러그인을 쓰면 엔터키가 약간 이상하게 먹히고 또 엔터키 플러그인을 끄면 에디터 영역을 넘어 삭제가 되는 현상이 발생합니다.
부분에 enterkey를 추가해보세요.
라이믹스 쪽에서 해결이 어려운 문제 아닐까합니다.
enterkey 키를 추가해서는 안되네요. 파일에서 제거하는 부분을 잠시 지워봐야겠습니다.
제가 말씀 드린 증상이랑 약간 다르거 같구요. 백스페이스가 문제가 아니고 저희는 아예 화면에 보이는 버튼들을 누르면 거기에 커서가....
에디터 영역을 벗어나서 편집이 가능한 상황입니다.
저는 백스페이스를 눌러서 쭉 지워졌지만 커서가 다른데에 있던 상황입니다.
그 때 상황을 찍어놨었는데 비교 한번 해보시기 바랍니다.
https://photos.google.com/share/AF1QipNsrV1E4RG5MHG2dV-tXL-SV7lHEiImrgQMs4BFpaw_qWP4m2YqGtl5atqsT7xQfA/photo/AF1QipOqfZWzrju2RZ-0Z6k_3IV_l4gUmlebiSw6TP19?key=em5HRVNOX1ozbWVoRHY2LWVMcjJ5NGFVeHprWHpn
저도 에디터 자동완성 모듈과 enterkey 플러그인 제거 시에 이런 부분에 문제가 발생하더군요.
추가 플러그인 로드 부분에 ios_enterkey 로 해보세요.
백스페이스 누르니 정말 엉뚱한 것들이 사라지네요. 해당 증상이 같네요.
근데 추가 플러인 로드에 ios_enterkey 를 할 필요가 있나요? 이건 이미 ios 에서는 불러오게 되어있고 ios에서는 enterkey 플러그인을 제거하게 되어있는데요.
ios_enterkey,enterkey 두가지 추가해 봐도 증상은 동일하네요.
저희랑 코어가 다른가요?
https://github.com/rhymix/rhymix/commit/ec2e3e59cc4e4133e58e0ea088018a56f1c99d60
이거 적용되신 코어 쓰시는건가요?
저도 예전에 구름이 님께 이 문제를 여쭤본적이 있고 그 내용을 찾아보니 그 때 질문 내용이 웹지기님의 문제와 같네요.
=================
안녕하세요.
어제 오늘 질문은 갑자기 많이 드려 죄송합니다.
automention 모듈 사용중에 PC에서는 문제가 없습니다.
하지만 모바일에서 에디터를 불러올 때 콘솔창에서 아래와 같은 에러가 발생하며 에디터 영역 뿐 아니라 사이트 전역에 커서가 위치하면서 글쓰가 쓰여지는 현상이 발생하였습니다.
- 이하 생략 -
==========================
쓸데없는 부분이 편집되는 것 보다 차라리 엔터키에만 문제있는게 나은것 같습니다.
최악보다는 차악이 나으니깐요. ㅠㅠ
라이믹스 마스터 브랜치에서는 modules/editor/skins/ckeditor/editor.html 파일에
settings.ckeconfig.extraPlugins = (settings.ckeconfig.extraPlugins ? (settings.ckeconfig.extraPlugins + ',') : '') + 'divarea,ios_enterkey';
이렇게 ios_enterkey 가 기본으로 들어가있어서 그냥 그대로 쓰는 중입니다.
제가 디벨롭 브랜치로는 설치를 안해서 그 이후에는 확실한지 잘 모르겠으나
에디터 자동완성 모듈과 ios_enterkey의 이슈인것 같습니다. ㅠㅠ
저는 지금 엔터문제 해결된 ios플러그인 적용해서 증상이 다른거 같네요.
하지만 동일한 문제가 일어난다니.. 흠.. 어렵네요 ㅠㅠ
자동완성 모듈의 m.skin 의 document.html 의 46 ~ 52번 라인 즘 ios 에서 불러오는 js 를 제거해서 에디터가 사용 가능한 상태로 회복시킬 수 있습니다.
어차피 지금 에디터자동완성모듈에서 최신 패치에 대응하지 않으면 멘션 기능 같은 타이핑 기능이 동작하고 있지 않으니 고쳐질 때 까지 파일을 불러오지 않는게 최선 인듯 합니다.
<load target="css/jquery.atwho.min.css" />
<!--@if($Android)-->
<load target="js/jquery.atwho.and.js" />
<!--@else-->
<load target="js/jquery.atwho.ios.js" /> // 제거
<load target="js/am_at.js" /> // 제거
<!--@end-->
그 때 구름이님 답변이긴 합니다.
========
해당 콘솔의 오류는 이모티콘 플러그인이 로딩되면서 발생되는 오류입니다.
modules/autometion/m.skins/default/document.html 파일을 열어 보시면..
아래와 같이 48~52 라인이 있습니다.
빨간색 부분을 삭제해주세요.
<!--@if($Android)-->
<load target="js/jquery.atwho.and.js" />
<!--@else-->
<load target="js/jquery.atwho.ios.js" />
<load target="js/am_at.js" />
<!--@end-->
=============
웹지기 님이 해결하신 방법과 동일한 방법입니다만.. 그래도 문제가 발생하기도 하고 언젠가는 해결이 되겠지라는 생각에 그냥 원복시켜놓은 상태입니다.
그리고 위 내용에 추가로 아래 내용도 댓글로 달아주셨습니다.
============
테스트를 해보니 사이트 환경에따라 멘션 호출시 출력되는 멘션 목록이 에디터 아래쪽으로 출력되어 보이지 않는 현상이 발생될수 있습니다.
만약 그렇다면.. 아래와 같이 멘션 목록의 높이 조정이 가능하겠습니다.
<!--@if($Android)-->
<load target="js/jquery.atwho.and.js" />
<!--@else-->
{@ $mconfig->mm_mb_top = "-100"; }
<!--@end-->
-100 부분을 알맞게 조정해주세요.
감사합니다.
==============
해당 질문 글은 원래는 공개 질문으로 구름이님 사이트에서 질문을 하였으나 구름이 님이 이 문제는 아직 뚜렷한 해결책이 없어서 비공개로 전환을 하셨습니다. 방금 구름이님 사이트에서 웹지기님의 질문글을 보았으나 비슷한 답변을 받을 것으로 예상합니다.
일단 위 높이값 조절해도 목록이 나타나지 않으니 차라리 그냥 해당 옵션값은 넣지 않고 아예 기능 자체를 안쓰는 것으로 임시로 유지 해야겠네요.
답변 감사합니다.
하고싶은 말이 뭔지 알 것같습니다.
여튼 빠른 시일내에 잘 해결이 되었으면 좋겠네요. 좋은 밤 보내세요.
에디터자동완성모듈의 ios엔터키 플러그인과 코어것과 충돌인거 같아 일단 구름이님께 문의를 남겨 놓아야 겠네요.
결국은 울며 겨자먹기로 엉뚱한 부분이 삭제되느니 약간 불편한 엔터키 오류를 달고 있는게 낫다고 판단하였습니다.
항상 감사합니다!