legacy-knowledge-base
公開されました Jul. 2, 2025

DXPで非同期ポートレットを開発するには?

投稿者

Alfonso Crisci

knowledge-article-header-disclaimer-how-to

knowledge-article-header-disclaimer

legacy-article

learn-legacy-article-disclaimer-text

問題

  • DXPで非同期ポートレットを開発するには?

Environment

  • Liferay DXP 7.0+

解決策

  • このシンプルでダミーな縮小シナリオでは、MVCポートレットの view.jsp に次のコードがあります:

    <script>
    Liferay.on(
    'pocEvent',
    function() {
    console.log("pocEvent listened!");
    $.ajax({
    url: "https://www.mocky.io/v2/5185415ba171ea3a00704eed",
    method: "GET",
    error: function() {
    console.log("error fetching the data");
    },
    success: function(data) {
    console.log(data);
    }
    });
    }
    );
    </script>
  • あなたのテーマ(またはポートレット自体のJSファイルのような他の互換性のあるリソース)は、 main.js ファイルにこのコードを持っています:
     Liferay.on(
    'allPortletsReady',

    /*
    This function gets loaded when everything, including the portlets, is on
    the page.
    */

    function() {The theme injects this in the
    console.log('all portlet is ready');
    Liferay.fire('pocEvent');
    }
    );
  • ポートレットが置かれているページに移動すると、ブラウザのコンソールに { hello: "world" } json オブジェクトが表示され、 all portlet is ready // pocEvent listened! debug lines
  • 注意点として、ポートレットのJavaクラスで "com.liferay.portlet.render-weight=0" を設定しないようにしてください。 これにより、ポートレットは順次動作するようになり、Ajaxとは逆の概念となる。 DTDによると、:

    <render-weight> render-weightのデフォルト値は1です。 1より小さい値を設定すると、ポートレットは並列に描画されます。 1以上の値を設定した場合、ポートレットはシリアルにレンダリングされます。 レンダーウェイトが大きいポートレットは優先度が高く、レンダーウェイトが小さいポートレットよりも先にレンダリングされます。
    ajaxableの値がfalseに設定されている場合、render-weightが1より小さい値に設定されると、常に1が設定される。 これは、ajaxableがfalseに設定されている場合、ajaxableがrender-weightを上書きできることを意味する。

    <ajaxable> ajaxableのデフォルト値はtrueです。 falseに設定すると、このポートレットはAjaxで表示されることはありません。

  • 前述のポートレットとテーマは、便宜上ここに添付しておきます。

did-this-article-resolve-your-issue

legacy-knowledge-base