今日はAlfrescoでJavaScriptのデバッグを行う際に便利な機能をまとめてみました。Alfrescoをカスタマイズする際にJavaScriptを触ることも多いかと思いますので、その際に参考にしてみてください。
一言でJavaScriptって言っても
Alfrescoでは、サーバサイド、クライアントサイド（ブラウザですね）の両方でJavaScriptのコードが実行されます。サーバサイドでのJavaScript実行にはRhino（JavaによるJavaScript実装）を利用しています。
また、Alfrescoはリポジトリのコア機能を提供するalfresco、UIレイヤを提供するshareの2アプリケーションから構成されています。
従って、 一言でJavaScriptと言っても、実際にはサーバサイドJavaScript（alfresco, shareの両者で実行）とクライアントサイドJavaScript（shareが提供）の計3ヶ所について、それぞれ個別にデバッグの方法を考えなくてはなりません。
サーバサイドJavaScript（alfrescoアプリケーション）
alfrescoアプリケーションのサーバサイドJavaScriptは主に、Web Scriptsと呼ばれる、簡単にREST APIを作ることのできるフレームワークを利用する際に使われます。
まずはデバッグツールですが、AlfrescoにはRhinoで実行されるJavaScriptをデバッグするための仕組みが用意されています。まず、http://localhost:8080/alfresco/service/api/javascript/debuggerにアクセスし、管理者のログイン情報を入力します。すると以下の画面が表示されるので「Enable」をクリックします。
あとは、通常どおりAlfrescoにアクセスすればOKです。JavaScript Debuggerのダイアログが表示され、あとはJavaScriptが実行されるタイミングで適切に割り込みが入るので、ブレークポイントを設定するなり変数をウォッチするなりすることができます。
次に、ログの出力方法を見てみます。まず、JavaScriptにログ出力を仕込むには、Alfresco JavaScript APIのLogging APIを利用します（詳しくは4.0 JavaScript API - alfrescowikiを参照）。さらに、log4jの設定を変更してログレベルを適切に設定する必要があります。
<alf_dir>/tomcat/webapps/alfresco/WEB-INF/classes/log4j.properties
log4j.logger.org.springframework.extensions.webscripts=debug log4j.logger.org.springframework.extensions.webscripts.ScriptLogger=debugこれで、JavaScript内で仕込んだログがAlfrescoログに出力されるようになります。もちろんログレベル変更後にはAlfrescoサーバの再起動が必要です。
サーバサイドJavaScript（shareアプリケーション）
次にshareアプリケーションのサーバサイドJavaScriptについてですが、基本的にはalfrescoアプリケーションのJavaScriptと同様の方法になります。デバッガを有効にするには、http://localhost:8080/share/service/api/javascript/debugger（URLのalfrescoがshareに変わってることに注意！）にアクセスすればよいだけですし、ログは<alf_dir>/tomcat/webapps/share/WEB-INF/classes/log4j.properties（こちらもファイルパスのalfrescoがshareに変わっていることに注意！）を先ほどと同じように設定するだけでOKです。
クライアントサイドJavaScript（shareアプリケーション）
最後はクライアントサイドのJavaScriptです。これは、UIレイヤを担当するshareアプリケーションがブラウザに実行させるスクリプトということになります。UIカスタマイズの際にいじることがほとんどで、<alf_dir>/tomcat/webapps/share/components/あたりにあるファイルがそれに該当します。
まずデバッグについてですが、ブラウザ上で実行されるJavaScriptのデバッグになるので、ブラウザごとに利用可能なデバッグツールを利用してください。筆者の場合は、FirefoxならFirebugとか、IEならF12で起動する開発者ツールとか、Chromeならctrl+shift+Iで起動するデベロッパーツールとかを主に使っています。
ログ出力に関しても、Alfrescoにはlog4javascriptを利用した仕組みが用意されています。まずは、以下のファイルの当該箇所を以下のように変更し、Alfrescoを再起動します。
<alf_dir>/tomcat/shared/classes/alfresco/web-extension/share-config-custom.xml
<alfresco-config>
<!-- Global config section -->
<config replace="true">
<flags>
<!--
Developer debugging setting to turn on DEBUG mode for client scripts in the browser
-->
<client-debug>true</client-debug>
<!--
LOGGING can always be toggled at runtime when in DEBUG mode (Ctrl, Ctrl, Shift, Shift).
This flag automatically activates logging on page load.
-->
<client-debug-autologging>true</client-debug-autologging>
</flags>
</config>
...
</alfresco-config>
これで、Alfrescoアクセス時にlog4javascriptのダイアログが表示されるようになり、このダイアログ上でログを確認できるようになります。もしくは、client-debug-autologgingをfalseにしておき、必要なタイミングでCtrl, Ctrl, Shift, Shiftと入力することでもこのダイアログを表示させることができます。
ログ出力を新たに埋め込む場合は、Alfresco.loggerという名前のlog4javascriptロガーオブジェクトを利用します。例えば以下のように記述します（詳しくはlog4javascript manualのloggersを参照）。
Alfresco.logger.info("test");
Alfresco.logger.debug("current object: ", object);
No comments:
New comments are not allowed.