2.5.0.beta5가 retort 플러그인을 깨뜨립니다

[Boost]

2.5.0.beta4에서 2.5.0.beta5로 업데이트를 마쳤는데, 이제 테마에 있는 두 개의 스크립트가 더 이상 실행되지 않는 것 같으며, 브라우저 콘솔에서 다음과 같은 오류가 표시됩니다:

Content Security Policy: Sivuston asetukset estivät resurssin lataamisen osoitteesta inline ("script-src"). injectGlobalHook.js:1:1760
Content Security Policy: Sivuston asetukset estivät resurssin lataamisen osoitteesta inline ("script-src"). pagewrap.bundle.js:1:1151

수정: 같은 테마를 사용하지 않는 다른 사이트에서도 이러한 오류가 발생하는 것 같으므로, 이것이 문제의 원인은 아닌 것 같습니다. 그래서 테마 API가 변경된 것이 아닌가 싶습니다. 하지만 이 토픽은 업데이트되지 않았거든요: Using the JS API

결론적으로 새로운 Discourse 업데이트가 CSP(Content Security Policy)를 더 엄격하게 만든 것 같습니다.
이 문제를 어떻게 해결할 수 있을까요? 릴리스 노트에서 CSP나 테마 변경 사항에 대한 내용을 찾지 못했습니다.

실행하려는 제 스크립트는 다음과 같습니다:

<script type="text/discourse-plugin" version="0.0.1">
api.onPageChange(() => {
	checkMainPageLoadFeeds();
});

function checkMainPageLoadFeeds() {
    // Only load on main page
    // Apparently this doesn't work perfectly due to the way discourse works, 
    // but at least this doesn't cause any issues either...
    if(/https?:\/\/[^\/]+\/(categories)?$/.test(window.location.href) ){
        // These files are created by a bot running on the same server as this forum
        if($("#development-info").text() == ""){
            $("#development-info").load("/thrive-feed-bot/devforum-and-github");
            $("#announcement-contents").load("/thrive-feed-bot/community-announcements");
        }
    }
    
    $("#development-heading").off("click").on("click", expandTheFeeds);
    $("#announcement-heading").off("click").on("click", expandTheFeeds);
}

function expandTheFeeds(){
    
    let target = $("#development-feed").height() == 200 ? 450 : 200;
    $('#development-feed').animate({ height: target + "px" });
    $('#development-info').animate({ height: (target - 95) + "px" });
    $('#announcement-feed').animate({ height: target + "px" });
    $('#announcement-contents').animate({ height: (target - 95) + "px" });
}

$( document ).ready(function(){
    checkMainPageLoadFeeds();
})
</script>

그리고 두 번째 스크립트는 다음과 같습니다:

<script type="text/discourse-plugin" version="0.0.1">
api.onAppEvent('modal:body-shown', (data) => {
    
    if(data.title){
    
        if(data.title.match(/.*create.*account.*/)){
        
            $(".create-account.fixed-modal .modal-footer").prepend(getEmailSpamCheckMessage(true));
        }
    } else {
        
        // Might be forgot password
        let element = $(".fixed-modal .forgot-password-modal")
        if(element){
            element.append(getEmailSpamCheckMessage(false));
        }
    }
	
});

function getEmailSpamCheckMessage(register){
    return $.parseHTML("<p class='EmailNoteMessage'>If you don't receive an email " + 
                (register ? "confirmation " : "") + "check your spam folder.<br>" +
                "You can also visit our <a href='https://discordapp.com/invite/FZxDQ4H'>discord</a> " +
                "if you have trouble " + (register ? "registering" : "receiving emails from us") + ".</p>");
}
</script>

이 스크립트들은 이전에 메타(meta)에 게시한 것으로确信하지만, 이제 그 게시글을 찾을 수 없습니다.

[j.jaffeux (Joffrey Jaffeux)]

CSP에 대해 알고 싶은 모든 것은 여기 있습니다:

Mitigate XSS Attacks with Content Security Policy

This guide explains how to use Content Security Policy (CSP) to mitigate Cross-Site Scripting (XSS) attacks in Discourse. It covers CSP basics, configuration, and best practices. Required user level: Administrator Summary Content Security Policy (CSP) is a crucial security feature in Discourse that helps protect against Cross-Site Scripting (XSS) and other injection attacks. This guide covers the basics of CSP, how it’s implemented in Discourse, and how to c…

[Boost]

제 문제는 CSP와 관련이 없다고 생각합니다. 기본 테마를 사용하는 사이트(https://forum.revolutionarygamesstudio.com/)에서도 동일한 2개의 오류가 발생하기 때문입니다. 즉, 제 스크립트가 로드되려 시도조차 되지 않는 것으로 보입니다. 커스텀 테마를 사용하는 사이트에서는 페이지 상단 근처의 박스가 자바스크립트를 통해 채워지도록 되어 있는데, 해당 박스들이 비어 있는 상태입니다: https://community.revolutionarygamesstudio.com/
관리자 설정에서 CSP를 끄는 것도 시도해 보았지만, 스크립트 문제는 해결되지 않았고, 대신 2개의 오류가 사라졌습니다(그 결과 retort에서 발생하는 오류 1개만 남게 됨).

수정: 어떤 부분이 변경되어 <script type="text/discourse-plugin" version="0.0.1"> 태그가 더 이상 전혀 로드되지 않게 된 것 같습니다.

수정 2: CSP가 활성화되어 있고 화이트리스트에 아무것도 추가하지 않은 상태에서도, 이 코드는 작동합니다:

<script>
console.log('this loaded just fine');
</script> 

하지만 이 코드는 작동하지 않습니다:

<script type="text/discourse-plugin" version="0.0.1">
console.log('this loaded just fine');
</script> 

[j.jaffeux (Joffrey Jaffeux)]

https://community.revolutionarygamesstudio.com/에서 retort 관련 js 오류가 발생하고 있습니다.

_retort-75a57ba39180becb082af07c57df6a5dd4e16efe0dbd24ec6c4e5d903e138efb.js:188 Uncaught TypeError: Cannot read property 'retort_disabled_categories' of undefined
    at _retort-75a57ba39180becb082af07c57df6a5dd4e16efe0dbd24ec6c4e5d903e138efb.js:188
    at t.module.exports.u.<computed> (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74640)
    at t.module.exports.u.<computed> (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74470)
    at require (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74637)
    at f (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74596)
    at _ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74561
    at t.module.exports.u.<computed> (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74639)
    at t.module.exports.u.<computed> (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74470)
    at require (_ember_jquery-1ed3f3559e6f967733b4088aa729ff7039dff2c09c5a5f787a214b016f58aabc.js:74637)
    at t._prepareInitializer (_application-66bcc4126a5a02dd0d99aed67150087a79a427788cc00feaf5e17bf042b73d75.js:6849)

다른 사이트에 대해서는 소스 코드에서 checkMainPageLoadFeeds를 찾을 수 없어 이것이 로드되는지 확실하지 않습니다.

하지만 https://community.revolutionarygamesstudio.com/에서는 찾을 수 있습니다:

따라서 이 플러그인으로 js 오류를 수정해 보시기 바랍니다.

[Boost]

@j.jaffeux

다른 사이트에 관해서는 소스 코드에서 checkMainPageLoadFeeds를 찾을 수 없어서 이것이 로드되는지 확실하지 않습니다.

저도 같은 현상을 보고 있습니다. 이전 게시글의 업데이트를 참고해 주십시오. "text/discourse-plugin" 스크립트 타입은 실행되지 않는 반면, 일반 스크립트 태그는 실행되는 것으로 보입니다.

@j.jaffeux

https://community.revolutionarygamesstudio.com/에서 retort와 관련해서 js 오류가 있습니다.

그것을 인지했습니다. 저는 최신 버전의 retort를 사용하고 있습니다:

@j.jaffeux

그러므로 이 플러그인으로 js 오류를 수정해 보세요.

그러면 해당 플러그인에 오류가 있으면 테마에서 정의된 플러그인의 실행이 중단됩니까?

[j.jaffeux (Joffrey Jaffeux)]

@Boost

제가 보고 있는 내용입니다. 이전 게시글의 업데이트를 확인해 주세요. "text/discourse-plugin" 스크립트 유형은 실행되지 않는 것 같지만, 일반 스크립트 태그는 실행됩니다.

방금 메타에서 테스트해 보았는데, 이는 올바르게 호출됩니다:

<script type="text/discourse-plugin" version="0.1">
</script>

@Boost

그 부분을 인지하고 있으며, 최신 버전의 retort를 사용하고 있습니다:

이것은 공식 플러그인이 아니며, 관련 정보가 많지 않아 죄송합니다.

@Boost

즉, 해당 플러그인에 오류가 있으면 테마에서 정의된 플러그인의 실행이 중단됩니까?

가능합니다. 비활성화하거나 아예 제거해 보고 문제가 해결되는지 확인해 보세요.

[Boost]

플러그인 목록에서 retort를 제거하고 다시 빌드하니 문제가 '해결’되었습니다. 도움을 주셔서 감사합니다. 하나의 플러그인이 실패하면 다른 플러그인도 함께 실패할 수 있다는 점을 고려하지 못했습니다. 앞으로는 문제를 보고하기 전에 이 점을 먼저 확인해 보겠습니다.

retort의 새로운 버전이 나올 때까지 기다리는 동안 이 답변을 해결책으로 표시하겠습니다.

최신 discourse와 관련된 문제가 이미 보고된 것 같습니다:

Discourse Retort

@gdpelican New issue found with retort plugin, please look into this… https://github.com/gdpelican/retort/issues/65

[mcdanlj (Michael K Johnson)]

retort에 대한 수정 사항이 이 문제를 해결했음을 확인합니다.