クライアント スクリプトのデバッグ
最新のブラウザーのほとんどには、ネットワーク トラフィックの収集、ページのコンテンツの分析、クライアント スクリプトのデバッグをサポートするデバッグの拡張機能があります。 デバッグ操作の実行には、次のツールセットを使用すると便利です。
Microsoft Edge (F12 開発者ツールを使用)。 詳細については、F12 開発者ツールの使用に関するガイドを参照してください。
Google Chrome (F12 開発者ツールを使用)
Mozilla Firefox (Firebug を使用)
Apple Safari (Web Inspector を使用)
スクリプト リソースの表示
モデル駆動型アプリ フォーム ページを読み込むと、すべてのクライアント スクリプト ライブラリが、個々のスクリプト リソースとして Web ページと共に読み込まれます。 モデル駆動型アプリを実行するために必要なスクリプト リソースのボリュームを考慮すると、デバッグ対象のファイルを特定が困難になることがあります。 Microsoft Edge などのデバッグ ツールを使用する場合は、ファイル名をメモして、ツールの検索機能を使用してスクリプト ファイルを見つけることをお勧めします。
コンソールへのメッセージの書き出し
JavaScript の問題をデバッグするときに window.alert メソッドを使用したり、debugger 文を使用して実行を停止したりすることは、現在でもアプリケーションのコードのトラブルシューティングでよく行われています。 しかし、現在では最新のすべてのブラウザーでデバッグ ツールに簡単にアクセスできるため、デバッグ中に他のユーザーがそのアプリケーションを使用する可能性がある場合にはベスト プラクティスではありません。 また、それらのデバッグの呼び出しは、誤ってコードに残され、本番環境のアプリケーションのユーザーに問題が生じる場合があります。
代わりに、メッセージをコンソールに書き込むことを検討してください。 次の簡単な関数をライブラリに追加すると、コンソールが開かれているときに表示するメッセージを送ることができます。
function writeToConsole(message)
{
if (typeof console != 'undefined') {
console.log(message);
}
}
alert メソッドと異なり、この関数を使用するコードを削除し忘れると、アプリケーションを使用しているユーザーにメッセージが表示されません。 また、本番環境でユーザーを妨げることなくアプリケーションの動作のトラブルシューティングを行う場合にも役立ちます。
Fiddler Auto-Responder を使用した Web リソースのコンテンツの置き換え
開発中の Web リソースを絶えず編集することは、困難で時間がかかる場合があります。 編集の際に、ソリューション内のファイルを再公開し、以前のバージョンのリソースのブラウザー キャッシュをクリアする必要があります。 また、複数の開発者で環境を共有している場合、他の開発者が混乱する可能性があります。
効率を高めるには、毎回コンテンツをアップロードして再公開するのではなく、Telerik Fiddler の Auto-Responder などのツールを使用して、Web リソースのコンテンツをローカル ファイルのコンテンツで置き換えることを検討してください。 ライブ編集もサポートするその他のサードパーティ製ツールの使用を検討できます。 Fiddler Auto-Responder のインストール方法と構成方法の詳細については、「Fiddler Auto-Responder 使用したスクリプト Web リソース開発」を参照してください。