デバッグ ASP.NET Web ページ (Razor) サイトの概要

[アーティクル]
07/13/2023

この記事では、ASP.NET Web ページ (Razor) Web サイトでページをデバッグするさまざまな方法について説明します。デバッグは、コードページのエラーを見つけて修正するプロセスです。

学習内容:

ページの分析とデバッグに役立つ情報を表示する方法。

Visual Studio でデバッグツールを使用する方法。

この記事で紹介する ASP.NET 機能を次に示します。

ServerInfoヘルパー。

ObjectInfo ヘルパー。

ソフトウェアバージョン

ASP.NET Web ページ (Razor) 3

Visual Studio 2013

このチュートリアルは、ASP.NET Web ページ 2 でも動作します。 WebMatrix 3 を使用できますが、統合デバッガーはサポートされていません。

コード内のエラーと問題のトラブルシューティングの重要な側面は、最初に回避することです。これを行うには、エラーの原因となる可能性が高いコードのセクションをブロックに配置 try/catch します。詳細については、「 Razor 構文を使用した ASP.NET Web プログラミングの概要」のエラー処理に関するセクションを参照してください。

ヘルパーは ServerInfo 、ページをホストする Web サーバー環境に関する情報の概要を示す診断ツールです。また、ブラウザーがページを要求したときに送信される HTTP 要求情報も表示されます。ヘルパーには ServerInfo 、現在のユーザー ID、要求を行ったブラウザーの種類などが表示されます。この種の情報は、一般的な問題のトラブルシューティングに役立ちます。

ServerInfo.cshtml という名前の新しい Web ページを作成します。
ページの最後で、終了 </body> タグの直前に、を追加 @ServerInfo.GetHtml()します。
```
<!DOCTYPE html>
<html>
    <head>
        <title></title>
    </head>
    <body>
   @ServerInfo.GetHtml()
    </body>
</html>
```
コードは、ページ内の ServerInfo 任意の場所に追加できます。ただし、最後に追加すると、出力が他のページコンテンツとは分離され、読みやすくなります。

Note

大事な Web ページを運用サーバーに移動する前に、Web ページから診断コードを削除する必要があります。これは、ページへのコードの追加を ServerInfo 含むヘルパーと、この記事の他の診断手法に適用されます。この種の情報は悪意のあるユーザーに役立つ可能性があるため、Web サイトの閲覧者がサーバー名、ユーザー名、サーバー上のパス、および同様の詳細に関する情報を表示しないようにします。
ページを保存し、ブラウザーで実行します。

ヘルパーは ServerInfo 、次の 4 つの情報テーブルをページに表示します。
- サーバー構成。このセクションでは、コンピューター名、実行している ASP.NET のバージョン、ドメイン名、サーバー時間など、ホスティング Web サーバーに関する情報を提供します。
- ASP.NET サーバー変数。このセクションでは、多数の HTTP プロトコルの詳細 (HTTP 変数と呼ばれます) と、各 Web ページ要求の一部である値について詳しく説明します。
- HTTP ランタイム情報。このセクションでは、Web ページが実行されている Microsoft .NET Frameworkのバージョン、パス、キャッシュに関する詳細などを説明します。 (Razor 構文を使用した ASP.NET Web プログラミングの概要で学習したように、Razor 構文を使用する ASP.NET Web ページは、Microsoft の ASP.NET Web サーバーテクノロジに基づいて構築されています。これは、それ自体が .NET Framework と呼ばれる広範なソフトウェア開発ライブラリに基づいて構築されています)。
- 環境変数。このセクションでは、Web サーバー上のすべてのローカル環境変数とその値の一覧を提供します。
  
  すべてのサーバーと要求情報の完全な説明は、この記事の範囲を超えていますが、ヘルパーから多くの診断情報が返される ServerInfo ことがわかります。返される ServerInfo 値の詳細については、Microsoft TechNet Web サイトの認識された環境変数と、MSDN Web サイトの IIS サーバー変数に関するページを参照してください。

ページ値を表示するための出力式の埋め込み

コードで何が起こっているかを確認するもう 1 つの方法は、出力式をページに埋め込むことです。ご存知のように、や @(subTotal * 12) などを@myVariableページに追加することで、変数の値を直接出力できます。デバッグのために、これらの出力式をコード内の戦略的なポイントに配置できます。これにより、ページの実行時にキー変数の値または計算結果を確認できます。デバッグが完了したら、式を削除したり、コメントアウトしたりできます。この手順では、埋め込み式を使用してページをデバッグする一般的な方法を示します。

OutputExpression.cshtml という名前の新しい WebMatrix ページを作成します。

ページの内容を次のように置き換えます。

<!DOCTYPE html>
<html>
    <head>
        <title></title>
    </head>
    <body>   

    @{
        var weekday = DateTime.Now.DayOfWeek;
        // As a test, add 1 day to the current weekday.
        if(weekday.ToString() != "Saturday") {
            // If weekday is not Saturday, simply add one day.
            weekday = weekday + 1; 
        }
        else {
            // If weekday is Saturday, reset the day to 0, or Sunday.
            weekday = 0; 
        }
        // Convert weekday to a string value for the switch statement.
        var weekdayText = weekday.ToString(); 

        var greeting = "";
        
        switch(weekdayText) 
        { 
            case "Monday":
                greeting = "Ok, it's a marvelous Monday."; 
                break; 
            case "Tuesday":
                greeting = "It's a tremendous Tuesday.";
                break; 
            case "Wednesday":
                greeting = "Wild Wednesday is here!";
                break; 
            case "Thursday":
                greeting = "All right, it's thrifty Thursday.";
                break;
            case "Friday":
                greeting = "It's finally Friday!";
                break;
            case "Saturday":
                greeting = "Another slow Saturday is here.";
                break;
            case "Sunday":
                greeting = "The best day of all: serene Sunday.";
                break;
            default:
                break; 
        }
    }
    
    <h2>@greeting</h2>

    </body>
</html>

この例では、ステートメントをswitch使用して変数のweekday値をチェックし、曜日に応じて異なる出力メッセージを表示します。この例では、最初の if コードブロック内のブロックは、現在の曜日の値に 1 日を追加することで曜日を任意に変更します。これは、説明のために導入されたエラーです。

ページを保存し、ブラウザーで実行します。

ページには、間違った曜日のメッセージが表示されます。実際の曜日に関係なく、1 日後のメッセージが表示されます。この場合、メッセージがオフになっている理由はわかっていますが (コードが意図的に正しくない日の値を設定するため)、実際にはコードのどこで問題が発生しているのかを知ることは困難なことがよくあります。デバッグするには、などの weekdayキーオブジェクトと変数の値に何が起こっているかを調べる必要があります。

コード内のコメントで示される 2 つの場所に示すようにを @weekday 挿入して、出力式を追加します。これらの出力式では、コード実行のその時点の変数の値が表示されます。

var weekday = DateTime.Now.DayOfWeek;
// DEBUG: Display the initial value of weekday. 
@weekday

// As a test, add 1 day to the current weekday.
if(weekday.ToString() != "Saturday") {
    // If weekday is not Saturday, simply add one day.
    weekday = weekday + 1; 
}
else {
    // If weekday is Saturday, reset the day to 0, or Sunday.
    weekday = 0; 
}

// DEBUG: Display the updated test value of weekday.
@weekday

// Convert weekday to a string value for the switch statement.
var weekdayText = weekday.ToString();

ブラウザーでページを保存して実行します。

ページには、最初に実際の曜日、次に 1 日を追加した結果として更新された曜日、次にステートメントから結果のメッセージが switch 表示されます。 2 つの変数式 (@weekday) からの出力には、出力に HTML <p> タグを追加していないため、日の間にスペースはありません。式はテスト用です。

これで、エラーがどこにあるかを確認できます。コードに変数を weekday 最初に表示すると、正しい日付が表示されます。コード内のブロックの後 if に 2 回目に表示すると、その日は 1 つずつオフになります。したがって、曜日変数の最初と 2 番目の外観の間に何かが発生したことを知っています。これが実際のバグである場合、この種のアプローチは、問題の原因となっているコードの場所を絞り込むのに役立ちます。

ページ内のコードを修正するには、追加した 2 つの出力式を削除し、曜日を変更するコードを削除します。残りの完全なコードブロックは、次の例のようになります。

@{
    var weekday = DateTime.Now.DayOfWeek;
    var weekdayText = weekday.ToString(); 

    var greeting = "";
        
    switch(weekdayText) 
    { 
        case "Monday":
            greeting = "Ok, it's a marvelous Monday."; 
            break; 
        case "Tuesday":
            greeting = "It's a tremendous Tuesday.";
            break; 
        case "Wednesday":
            greeting = "Wild Wednesday is here!";
            break; 
        case "Thursday":
            greeting = "All right, it's thrifty Thursday.";
            break;
        case "Friday":
            greeting = "It's finally Friday!";
            break;
        case "Saturday":
            greeting = "Another slow Saturday is here.";
            break;
        case "Sunday":
            greeting = "The best day of all: serene Sunday.";
            break;
        default:
            break; 
    }
}

ブラウザーでページを実行します。今回は、実際の曜日に対して正しいメッセージが表示されます。

ObjectInfo ヘルパーを使用したオブジェクト値の表示

ヘルパーには ObjectInfo 、渡す各オブジェクトの型と値が表示されます。これを使用すると、コード内の変数とオブジェクトの値を表示できます (前の例で出力式を使用した場合と同様)。また、オブジェクトに関するデータ型情報も表示できます。

先ほど作成した OutputExpression.cshtml という名前のファイルを開きます。

ページ内のすべてのコードを次のコードブロックに置き換えます。

<!DOCTYPE html>
<html>
    <head>
        <title></title>
    </head>
    <body>
    @{
      var weekday = DateTime.Now.DayOfWeek;
      @ObjectInfo.Print(weekday)
      var weekdayText = weekday.ToString(); 
  
      var greeting = "";
  
      switch(weekdayText) 
      { 
          case "Monday":
              greeting = "Ok, it's a marvelous Monday."; 
              break; 
          case "Tuesday":
              greeting = "It's a tremendous Tuesday.";
              break; 
          case "Wednesday":
              greeting = "Wild Wednesday is here!";
              break; 
          case "Thursday":
              greeting = "All right, it's thrifty Thursday.";
              break;
          case "Friday":
              greeting = "It's finally Friday!";
              break;
           case "Saturday":
              greeting = "Another slow Saturday is here.";
              break;
           case "Sunday":
              greeting = "The best day of all: serene Sunday.";
              break;
          default:
              break; 
      }
    }
    @ObjectInfo.Print(greeting)
    <h2>@greeting</h2>

    </body>
</html>

ブラウザーでページを保存して実行します。

この例では、ヘルパーに次の ObjectInfo 2 つの項目が表示されます。
- 型。最初の変数の型はです DayOfWeek。 2 番目の変数の型はです String。
- 値。この場合、既にページに greeting 変数の値が表示されているため、に変数 ObjectInfoを渡すと、値が再び表示されます。
  
  より複雑なオブジェクトの ObjectInfo 場合、ヘルパーは詳細情報を表示できます。基本的には、オブジェクトのすべてのプロパティの型と値を表示できます。

Visual Studio でのデバッグツールの使用

より包括的なデバッグエクスペリエンスを実現するには、 Visual Studio を使用します。 Visual Studio では、検査する行でコードにブレークポイントを設定できます。

ブレークポイントの設定

Web サイトをテストすると、実行中のコードはブレークポイントで停止します。

ブレークポイントに到達する

変数の現在の値を調べ、コードを 1 行ずつステップ実行できます。

値を参照してください

Visual Studio で統合デバッガーを使用して Razor ページ ASP.NET デバッグする方法については、「Visual Studio を使用した ASP.NET Web ページ (Razor) のプログラミング」を参照してください。

デバッグ ASP.NET Web ページ (Razor) サイトの概要

ソフトウェアバージョン

ページ値を表示するための出力式の埋め込み

ObjectInfo ヘルパーを使用したオブジェクト値の表示

Visual Studio でのデバッグツールの使用

その他のリソース

フィードバック

フィードバック

その他のリソース

デバッグ ASP.NET Web ページ (Razor) サイトの概要

ソフトウェア バージョン

ページ値を表示するための出力式の埋め込み

ObjectInfo ヘルパーを使用したオブジェクト値の表示

Visual Studio でのデバッグ ツールの使用

その他のリソース

フィードバック

フィードバック

その他のリソース

ソフトウェアバージョン

Visual Studio でのデバッグツールの使用