0

複数のコンポーネントを含む AEM ページがあります。これらのコンポーネントには、すべてのクライアント側ロジックを囲む関数を含む .js ファイルがあります。次に、コンポーネントの HTML 内でその関数を呼び出します。

<script>
    window.bootstrap_component(function() {
        init_component_name();
    });
</script>

前に述べたように、init_component_name は、必要なすべてのロジックを含む関数の名前です。

function init_component_name() {
    //DO STUFF
}

ラッパーの bootstrap_component 関数は、すべてのページの共有 head.html で次のように定義されています。

<script>
    window.bootstrap_component = function (handler) {
        if (typeof handler === 'function') {
            if (document.readyState === "complete" || document.readyState === "loaded" || document.readyState === "interactive") {
                handler();
            } else {
                document.addEventListener("DOMContentLoaded", function() {
                    handler();
                });
            }
        }
    }
</script>

これは問題なく動作し、実際の問題はありませんが、最近、エラーの監視とレポートに Bugsnag を使用し始めました。ほぼすべてのコンポーネントについて、ページで ReferenceError というレポートを取得しています。

これが発生していると私が考える理由は、init_component_name() 関数が script タグ内で宣言されていないためです。このため、function(init_component_name) がウィンドウ オブジェクトにアタッチされており、正常に実行されており、コンソール エラーは表示されません。

私が正しければ、これらのスクリプト タグをこのように変更することはできますか?

<script>
    window.bootstrap_component(function() {
        window.init_component_name();
    })
</script>

私の同僚は、init_component_name 関数に 1 ミリ秒程度のタイムアウトを追加したいと考えていますが、それは私を間違った方法でこすります。もっと賢明なアプローチはありますか?

4

1 に答える 1