ASP.NET Webフォーム Ajax利用

Ajaxとは?

Asynchronous JavaScript XML
WEBページの一部を変更したい時に、
ページ全体を更新せずに一部分だけを更新する技術
XMLHttpRequest(ブラウザに組み込まれたJavaScript組み込みクラス)クラスにおける非同期通信によってなされる。
非同期通信を行うとFormLoadイベント等は発生するがページ全体の更新は行われないので、ブラウザの「戻る」ボタン等も有効にならない。

Ajax通信時のロード処理

Ajax通信時もPostBackは発生する(=Page_Loadイベントが発生する)。
Page.IsPostBack = True
ただしクライアント側において全画面の再描画は行われない。

通常
Buttonクリック→サーバー処理→全画面再描画
Ajax通信時
Buttonクリック→サーバー処理→指定部分再描画

※~.aspx
<script>
 function myFunc() {
  window.alert("LoadOK");
 }
</script>
<body onload="myFunc();">
 <asp:ScriptManager ID="manager" runat="server"></asp:ScriptManager>
 <asp:UpdatePanel ID="myUpdate" runat="server">
  <ContentTemplate>
   <asp:TextBox ID="myText" runat="server"></asp:TextBox><br />
  </ContentTemplate>   
  <Triggers>
   <asp:AsyncPostBackTrigger ControlID="myButton" EventName="Click" />
  </Triggers>
 </asp:UpdatePanel>
 <asp:Button ID="myButton" runat="server" Text="Button" onclick="myButton_Click" />
</body>

※~.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
 if (!Page.IsPostBack)
 {
  this.myText.Text = "NoPostBack";
 }
 else
 {
  this.myText.Text = "PostBack";
 }
}
protected void myButton_Click(object sender, EventArgs e)
{
 this.myText.Text = "Ajax";
}

【初回ロード時】
サーバー:
Page_Loadイベント

Page.IsPostBack = False なので、this.myText.Text = "NoPostBack";

クライアント:
画面描画

onloadイベント

fncInitSpread()実行

【ボタンクリック時】
サーバー:
Page_Loadイベント

Page.IsPostBack = True なので、this.myText.Text = "PostBack";

クライアント:
UpdatePanel内のみ描画

※onloadイベントは発生しない

AJAX Extensionsコントロール

ASP.NETでは「ASP.NET AJAX Extensionsコントロール」を配置する事でAjaxを利用できる。
ASP.NET AJAX Extensionsコントロールには、
・UpdatePanel
等があり、
UpdatePanel上のデータを非同期でページ全体のポストバックを発生させずに更新できる。
非同期ポストバックと呼ばれる画面一部のポストバックは発生する

ScriptManagerコントロール

UpdatePanel等のAjax Extensionsコントロールを使用する際、
先頭に配置する事で配下のコントロールの非同期通信を可能にする。

UpdatePanelコントロール

※~.aspx
<form id="myForm" runat="server">
 ※スクリプトマネージャー:AJAXを有効にする
 <asp:ScriptManager ID="myScriptManager" runat="server"></asp:ScriptManager>
 
 ※Updateパネル:パネル内のコントロールについて非同期通信を行う
 <asp:UpdatePanel ID="myUpdatePanel" runat="server" >
  <ContentTemplate>
   <asp:Label ID="myLabel" runat="server" Text=""></asp:Label>
  </ContentTemplate>
  
  ※↓のイベントをトリガーとして↑パネル内のみ非同期通信を行う
  <Triggers>
   <asp:AsyncPostBackTrigger ControlID="myButton" EventName="Click" />
  </Triggers>
  
 </asp:UpdatePanel>
 ※↓ボタン押下イベントハンドラをaspx.csファイルに記述
 <asp:Button ID="myButton" runat="server"
   Text="非同期更新" OnClick="myButton_Click" />
</form>

※~.aspx.cs
public partial class MyForm : System.Web.UI.Page
{

 protected void myButton_Click(object sender, EventArgs e)
 {
  // 非同期通信処理
  this.myLabel.Text = this.myTextBox.Text;
  
  ※複数のUpdateパネルを使用している場合に、
  規定のトリガー以外で非同期通信を実行する場合

  hisUpdatePanel.Update();
 }
}

UpdateProgressコントロール

※~.aspx
<form id="myForm" runat="server">
 <asp:ScriptManager ID="myScriptManager" runat="server"></asp:ScriptManager>
 
 <asp:UpdatePanel ID="myUpdatePanel" runat="server">
  <ContentTemplate>
   <asp:Label ID="myLabel" runat="server"
    Text="処理前"></asp:Label><br />
   <asp:Button ID="myButton" runat="server"
    Text="非同期更新" OnClick="myButton_Click" /><br />
  </ContentTemplate>
 </asp:UpdatePanel>
 
 // ↑の非同期処理中のみ表示される
 <asp:UpdateProgress ID="myUpdateProgress" runat="server"
   AssociatedUpdatePanelID="myUpdatePanel">
  <ProgressTemplate>
   <asp:Image ID="myLoading" runat="server"
    // myUpdatePanelが通信中のみ表示される。
    ImageUrl="(gif画像パス)" />
    しばらくお待ちください。
  </ProgressTemplate>
 </asp:UpdateProgress>
</form>

※~.aspx.cs
public partial class MyForm : System.Web.UI.Page
{

 protected void myButton_Click(object sender, EventArgs e)
 {
  // 非同期通信処理
  ~
  this.myLabel.Text = "完了";
 }
}

非同期通信後のスクリプト埋め込み

Updateパネル内の非同期通信処理発生時にサーバーサイドからクライアントサイドへスクリプトを埋め込み/実行させる場合
(非同期通信中は通常のポストバックが発生しない為、Page.~の埋め込みは使用できない)
※UpdatePanel内に配置したコントロール(ボタン等)のイベント内に書く事
ScriptManager.RegisterClientScriptBlock(
 ページ,
 スクリプトを埋め込むコントロールの型,
 キー,
 スクリプト文,
 <script>タグを追加するか否か?);
ScriptManager.RegisterClientScriptBlock(
 this,
 this.GetType(),
 "myKey",
 "fnMyfunc();",
 true);
→<script>fnMyFunc();</script>
ScriptManager.RegisterClientScriptBlock(
 this,
 this.GetType(),
 "myKey",
 "<script>fnMyFunc();</script>",
 false);
→<script>fnMyFunc();</script>

参考:通常ポストバック時のスクリプト埋め込み

画面の表示前にスクリプトを実行する
Page.RegisterClientScriptBlock(型, キー, スクリプト文)
Page.RegisterClientScriptBlock(this.GetType(), "client", "<script> alert('前') <" + "/script>");
画面の表示後にスクリプトを実行する
Page.RegisterStartupScript(型, キー, スクリプト文)
Page.RegisterStartupScript(this.GetType(), "startup", "<script> alert('後') <" + "/script>");

AJAX Control Toolkit

ToolkitScriptManagerコントロール

ScriptManagerコントロールとほぼ同等の機能を持つ
ToolkitScriptManager.CombineScriptsプロパティ=True により、
Ajaxに関わる重複するJavaScriptファイルをダウンロードせずに済ませられる。

UpdatePanelAnimationExtenderコントロール

<ajaxToolkit:UpdatePanelAnimationExtender
 ID="~"
 runat="server"
 
 Ajax通信が実行されるコントロールを指定。
 TargetControlID="~">
 
 対象コントロールの通信終了後に、指定のアニメーションを実行する。
 <Animations>
  更新完了時のアニメーションを定義
  <OnUpdated>
   <Sequence>
    ラベルの背景色を#008800(緑)から#FFFFFF(白)に変更
    <Color AnimationTarget="lblAsync"
     PropertyKey="backgroundColor"
     StartValue="#008800" EndValue="#FFFFFF" />
    
    JavaScript関数を実行
    <ScriptAction Script="myJsFunc();" />
   </Sequence>
  </OnUpdated>
 </Animations>
</ajaxToolkit:UpdatePanelAnimationExtender>

Microsoft AJAX Library

クライアントサイド技術
・Sys.WebForms.PageRequestManagerクラス
UpdatePanelコントロールによって発生した非同期通信(部分更新)を管理
サーバーサイドのUpdatePanelコントロールの機能を拡張する技術
JavaScriptから利用する。
・Sys.Applicationクラス
ページ全体に関わる部分を管理

<script type="text/javascript">
 function pageLoad()
 {
  // PageRequestManagerインスタンスの作成(newではない)
  var mng = Sys.WebForms.PageRequestManager.getInstance();
  
  // 非同期通信の開始と同時に実行される。
  mng.add_initializeRequest(
   function (sender, args) {
    $get('lblStatus').innerHTML =
      args.get_postBackElement().id
        + 'から非同期ポストバックが実行されました。';
   }
  );
  
  // 非同期通信の終了と同時に実行される。
  mng.add_endRequest(
   function (sender, args) {
    $get('lblStatus').innerHTML = '';
   }
  );
 }
</script>

ASP.NET Webフォーム 変数の取り扱い方法

※~.aspx.cs
public partial class MyForm : System.Web.UI.Page
{

 // モジュール変数
 protected const string CONST_myValue = @"サーバー変数1";
 protected string mMyStr = @"サーバー変数2";

 protected void Page_Load(object sender, EventArgs e)
 {
  // セッション変数
  Page.Session["value"] = "セッション変数";
  ※「ASP.NET Webフォーム 組み込みオブジェクト」参照
 }
}

※~.aspx
<%@ Page
 Language="C#"
 AutoEventWireup="true"
 CodeBehind="~.aspx.cs"
 Inherits="~.~" %>
 ※「ASP.NET Webフォーム Pageディレクティブ」参照

※ASPXファイル上でC#/VBの資源を扱う場合は<%~%>で囲む
<%
 // ローカル変数
 string myValue = "ローカル変数"; 
%>
<%=myValue %>
→ ローカル変数
<%=CONST_myValue %>
→ サーバー変数1
<%=Session["value"] %>
→ セッション変数

埋め込み
<asp:Button ID="MyButton"
 runat="server" Text="<%=myValue %>">
<script type="text/javascript">
 var str = "<%=this.mMyStr%>";
 → サーバー変数2
</script>

ASP.NET Webフォーム Traceオブジェクト

ASP.NET Webフォーム Traceオブジェクト

概要

デバッグ用。
発生イベントや処理時間、変数を取得・表示する機能。

トレース内容

・要求の詳細
リクエスト情報。
要求時間、文字エンコーディング、HTTPステータス等。
・トレース情報
各メソッドの処理順序、処理時間
・コントロールのツリー
ページ上のコントロールを階層式に表示
・クライアントが送信したHTTPヘッダに含まれているクッキーの値とサイズ
・HTTPヘッダの情報
・フォーム変数情報
・セッション変数
・サーバ変数
・アプリケーション変数
・クエリ情報
asp_net_trace

設定方法

Pageディレクティブから
<%@ Page
 略
 Trace="true" %>

Web.configから
<configuration>
 <system.web>
  略
  <trace enabled="true" traceMode="SortByTime"/>
 </system.web>
</configuration>

メソッド

protected void Page_Load(object sender, EventArgs e)
{
 Trace.Write(message: this.HyperLink1.Text);
 ※黒文字でトレース情報を出力
 
 Trace.Warn(message: this.HyperLink1.Text);
 ※赤文字でトレース情報を出力
 
}

ASP.NET Webフォーム Pageディレクティブ

Pageディレクティプ

概要

ページ固有の処理方法を決める記述
aspxファイルの先頭に記述する。
(「.aspx」ファイルでのみ使用可能)
<%@ Page
 Language="C#"
 AutoEventWireup="true"
 CodeBehind="index.aspx.cs"
 Inherits="DataColumnTest.index" %>

Language属性

aspxファイル中に指定した言語でプログラムを記述できる。
<%@ Page Language="C#" %>

CodeBehind属性

aspxファイルと別のコードページを指定する
CodeBehind="index.aspx.cs"
※index.aspx.cs
public partial class index : System.Web.UI.Page
{
 protected void Page_Load(object sender, EventArgs e)
 {
  ~
 }
}

Inherits属性

コードビハインドを利用するとき、Pageクラスの派生クラスを指定する
Inherits="DataColumnTest.index"
※index.aspx.cs
namespace DataColumnTest
{
 public partial class index : System.Web.UI.Page
 {
  protected void Page_Load(object sender, EventArgs e)
  {~}

 }
}

AutoEventWireup属性

AutoEventWireup="false"
でPage_Loadメソッド、Page_Initメソッドが呼び出されなくなる

EnableViewState属性

ビュー・ステートを維持するかどうか指定する。falseを指定すると、ビュー・ステートが維持されなくなる。
EnableViewState="false"

ContentType属性

生成されるページのMIMEタイプを指定する
コードページで書く事も可能。
(「ASP.NET Webフォーム Responseオブジェクト/コンテンツタイプ」参照)
ContentType="text/html"

Trace属性

ASP.NET Webフォーム Traceオブジェクト/設定方法」参照

ASP.NET Webフォーム Responseオブジェクト

ASP.NET Webフォーム Responseオブジェクト

概要

Pageクラスメンバーの1つ。
サーバーからクライアント(ブラウザ)へ返すデータを設定する。
レスポンス情報は、
(1)HTTPステータス
 サーバー側での処理結果
(2)レスポンスヘッダー
 サーバーやコンテンツに関わる情報
(3)レスポンス本体
 コンテンツ本体(htmlテキスト)
から成り、それぞれを設定するプロパティが用意されている。

HTTPステータス

protected void Page_Load(object sender, EventArgs e)
{
  Page.Response.StatusCode = (int)HttpStatusCode.OK;
}
ステータスコード列挙体
HTTPプロトコル/HTTPステータスコード」参照
成功(200)
HttpStatusCode.OK
リソースが変更されていない(304)
HttpStatusCode.NotModified
HTTP認証を要求(401)
HttpStatusCode.Unauthorized
アクセスを拒否(403)
HttpStatusCode.Forbidden
リソースが見つからない(404)
HttpStatusCode.NotFound
HTTPメソッドが不許可(405)
HttpStatusCode.MethodNotAllowed
サーバーエラー(500)
HttpStatusCode.InternalServerError
応答に必要な機能が未実装(501)
HttpStatusCode.NotImplemented

レスポンスヘッダー

コンテンツタイプ

ブラウザに表示させるファイル種類をMIME(MIMU=Web版拡張子)で指定する。
デフォルトはtext/html
Page.Response.ContentType = "image/jpeg";
Page.Response.BinaryWrite("~.jpg");
※htmlではないのでそれぞれのファイル種類に応じた表示用メソッドが必要
HTTPプロトコル/コンテンツタイプ」参照

Responseオブジェクトメソッド

Redirect

指定ページへ遷移させる。
Page.Response.Redirect(url: "Next.aspx");
Page.Server.Transfer(path: "Next.aspx");
では動作サーバー内のページのみページ遷移可能。しかも速度速い。
しかしコーディングミスやリソース変更時の挙動でダメージが大きいので非推奨

BinaryWrite

バイナリーファイル(htmlではない)ファイルを表示。
Page.Response.ContentType = "MIME");
Page.Response.BinaryWrite("ファイル名.拡張子");

Write

レガシーASPでの使用頻度は高かったが現在では非推奨。
リテラル等のWebフォームを利用すべき。
Page.Response.Write(s:"aaa");

クッキー操作

ローカルに保存されるテキスト情報
ブラウザを終了してもPCを再起動しても次のページに遷移しても削除されるまでは残る。
HTTPプロトコル/クッキー」参照

Response.AppendCookie

※index.aspx
<body>
  <form id="myForm" runat="server">
    <asp:TextBox ID="myText" runat="server"></asp:TextBox><br />
    <asp:Button ID="btnSave" runat="server" Text="保存" OnClick="btnSave_Click" />
  </form>
</body>

※index.aspx.cs
public partial class index : System.Web.UI.Page
{
  protected void Page_Load(object sender, EventArgs e)
  {
    if (!Page.IsPostBack)
    {
      if (Request.Cookies["email"] != null)
      {
        //クッキーの内容をテキストボックスに表示
        this.myText.Text = Request.Cookies["email"].Value;
      }
    }
  }

  
  protected void btnSave_Click(object sender, EventArgs e)
  {
    //クッキー作成
    //(テキストボックスの内容をクッキーに保存)
    HttpCookie myCookie = new HttpCookie(name: "email", value: this.myText.Text);
    //クッキー有効期限を7日間に設定
    myCookie.Expires = DateTime.Now.AddDays(value: 7);
    //SSL通信のみを許可する
    myCookie.Secure = true;
    //HTTPプロトコル経由でのみアクセスできる
    //(古いブラウザでは非対応)
    myCookie.HttpOnly = true;
    //クッキーが有効になるドメイン/フォルダを設定
    myCookie.Domain = "https://office-yone.com/";
    //クッキーをクライアントに送信
    Response.AppendCookie(cookie: myCookie);
  }
}

ASP.NET Webフォーム Requestオブジェクト

概要

Pageクラスメンバーの1つ。
クライアント(ブラウザ)からサーバーへアクセスする際のリクエスト情報を取得する。
リクエスト情報は
・HTTPメソッド
・リクエストヘッダー
・リクエスト本体(クエリ情報)
から成り、Requestオブジェクトにはそれぞれの情報を取得する為の各種プロパティが用意されている。

ポストデータの取得

Request.Formプロパティ
※~.aspx
<body>
  <form id="myForm" runat="server" method="post">
    <asp:TextBox ID="myText" runat="server"></asp:TextBox>
    <asp:Button ID="myButton" runat="server" Text="Button" OnClick="myButton_Click" />
  </form>
</body>
※~.aspx.cs
public partial class index : System.Web.UI.Page
{
  protected void myButton_Click(object sender, EventArgs e)
  {
    string textValue = Page.Request.Form[name:"myText"];
     string textValue = this.myText.Text; と同義(こちらの方が良い)
  }
}

クエリ情報の取得

Request.QueryStringプロパティ
※~.aspx
<body>
  <form id="myForm" runat="server" method="post">
    <asp:HyperLink
      ID="myLink"
      runat="server"
      NavigateUrl="~/index.aspx?prm1=10&prm2=test">
      リンク
    </asp:HyperLink>
  </form>
</body>
※~.aspx.cs
public partial class index : System.Web.UI.Page
{
  protected void Page_Load(object sender, EventArgs e)
  {
    string prm1 = Page.Request.QueryString[name: "prm1"];
    ⇒ prm1 : 10
    string prm2 = Page.Request.QueryString[name: "prm2"];
    ⇒ prm2 : test
  }
}

リクエストヘッダー情報の取得

public partial class index : System.Web.UI.Page
{
  protected void Page_Load(object sender, EventArgs e)
  {
    言語設定取得
    string language = Page.Request.UserLanguages[0].ToString();
    ⇒ language : ja等(ブラウザ設定に依る)
    
    (言語設定の利用方法は「ASP.NET 多言語対応」参照)
    

    HTTPメソッド取得
    string method = Page.Request.HttpMethod.ToString();
    ⇒ method : get等
    リンク元ページURL取得(遷移時)
    string url = Page.Request.UrlReferrer.ToString();
  }
}

リクエストURLの取得

仮想/物理パスやクエリ情報の有無によってプロパティが異なる。
アプリケーションパス
「ファイル名を指定して実行」にファイル名だけを入力して実行できる様なアプリケーション専用のパス
追加パス
パス形式パラメーター(例ではplus)
仮想パス
インタネット上に公開しているURL
物理パス
Webサーバー上のファイルパス

※index.aspx
<body>
 <form id="form1" runat="server">
  <asp:HyperLink
   ID="HyperLink1"
   runat="server"
   NavigateUrl="~/next.aspx/plus?prm1=100&prm2=test"
   Text="リンク"
   Target="_blank"></asp:HyperLink>
 </form>
</body>
※next.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
  Response.Write("ApplicationPath : " + Page.Request.ApplicationPath);
  Response.Write("PhysicalApplicationPath : " + Page.Request.PhysicalApplicationPath);
  Response.Write("CurrentExecutionFilePath : " + Page.Request.CurrentExecutionFilePath);
  Response.Write("FilePath : " + Page.Request.FilePath);
  Response.Write("Path : " + Page.Request.Path);
  Response.Write("PhysicalPath : " + Page.Request.PhysicalPath);
  Response.Write("RawUrl : " + Page.Request.RawUrl);
  Response.Write("Url : " + Page.Request.Url.ToString());
  Response.Write("PathInfo : " + Page.Request.PathInfo);
  
}
※結果(next.aspx)
ApplicationPath : /
PhysicalApplicationPath : C:\Test\
CurrentExecutionFilePath : /next.aspx
FilePath : /next.aspx
Path : /next.aspx/plus
PhysicalPath : C:\Test\next.aspx
RawUrl : /next.aspx/plus?prm1=100&prm2=test
Url : http:localhost:63707/next.aspx/plus?prm1=100&prm2=test
PathInfo : /plus

プロパティ 種類 物理/仮想 クエリ情報 追加パス
ApplicationPath アプリケーションパス 仮想 × ×
PhysicalApplicationPath アプリケーションパス 物理 × ×
CurrentExecutionFilePath ファイルパス 仮想 × ×
FilePath ファイルパス 仮想 × ×
Path ファイルパス 仮想 ×
PhysicalPath ファイルパス 物理 × ×
RawUrl ファイルパス 仮想
Url ファイルパス 仮想(フルURL)
PathInfo 追加パス 仮想 ×

クッキーの取得

ローカルに保存されるテキスト情報
ブラウザを終了してもPCを再起動しても次のページに遷移しても削除されるまでは残る。

※index.aspx
<body>
  <form id="myForm" runat="server">
    <asp:TextBox ID="myText" runat="server"></asp:TextBox><br />
    <asp:Button ID="btnSave" runat="server" Text="保存" OnClick="btnSave_Click" />
  </form>
</body>
※index.aspx.cs
public partial class index : System.Web.UI.Page
{
  protected void Page_Load(object sender, EventArgs e)
  {
    if (!Page.IsPostBack)
    {
      if (Request.Cookies["email"] != null)
      {
        クッキーの内容をテキストボックスに表示
        this.myText.Text = Request.Cookies["email"].Value;
      }
    }
  }
  
  protected void btnSave_Click(object sender, EventArgs e)
  {

    クッキー作成
    (テキストボックスの内容をクッキーに保存)
    HttpCookie myCookie = new HttpCookie(name: "email", value: this.myText.Text);
    
    クッキー有効期限を7日間に設定
    myCookie.Expires = DateTime.Now.AddDays(value: 7);
    
    SSL通信のみを許可する
    myCookie.Secure = true;
    
    HTTPプロトコル経由でのみアクセスできる
    (古いブラウザでは非対応)

    myCookie.HttpOnly = true;
    
    クッキーが有効になるドメイン/フォルダを設定
    myCookie.Domain = "http:office-yone.com/";
    
    クッキーをクライアントに送信
    Response.AppendCookie(cookie: myCookie);
  }
}

ASP.NET Webフォーム 組み込みオブジェクト

組み込みオブジェクト

概要

ASP.NET WebフォームはPageクラスを継承している為、全てのページでPageクラスのプロパティを使用可能。
ASP.NET Webフォームでは、Pageクラスプロパティの戻り値を組み込みオブジェクトと呼ぶ。

Application

※サーバー側に保持される変数。
サーバーのメモリがクリアされるまでは誰がアクセスしても同じ値を維持する。
戻り値:HttpApplicationState
アプリケーション共通情報取得プロパティ
protected void Page_Load(object sender, EventArgs e)
{

  //他のセッションからApplication変数を変更できない様にロックする
  //(サーバーにアクセスしている別ユーザーも変更できてしまう為)
  Page.Application.Lock();
  
  Page.Application["test"] = "test";
  
  //ロックを解除
  Page.Application.UnLock();
  
  Page.Response.Write(s: Page.Application["test"].ToString());
  //⇒index.aspxには「test」と表示される
}

Session

※サーバー側に保持される変数。
セッションが切れる(ブラウザを閉じる)と初期化される。
セッションが切れなければページを遷移してもその値はサーバーに残る。
戻り値:HttpSessionState
※index.aspx.cs
public partial class index : System.Web.UI.Page
{
  protected void Page_Load(object sender, EventArgs e)
  {
    Page.Session["test"] = "aaaa";
  }
}
※next.aspx.cs
public partial class next : System.Web.UI.Page
{
  protected void Page_Load(object sender, EventArgs e)
  {
    Page.Response.Write(s: Page.Session["test"].ToString());
  }
}
⇒index.aspxを表示した後、何もしなくてもnext.aspxを表示すると、
aaaa
と表示される。
//セッション変数削除
Page.Session.Remove(name: "test");
//全てのセッション変数削除
Page.Session.RemoveAll();
//セッションを削除
Page.Session.Abandon();
構成ファイルでの共通設定の方法は「ASP.NET 構成ファイル(Web.config/Machine.config)/<sessionState>要素:セッション情報設定」参照

Request

戻り値:HttpRequest
クライアントからのリクエスト情報取得プロパティ
ASP.NET Webフォーム Requestオブジェクト

Response

戻り値:HttpResponse
クライアントへのレスポンス操作
ASP.NET Webフォーム Responseオブジェクト

Cache

戻り値:Cache
キャッシュ管理
ASP.NET Webフォーム キャッシュ

Server

戻り値:HttpServerUtility
サーバー情報取得プロパティ

Trace

戻り値:TraceContext
トレース操作
ASP.NET Webフォーム Traceオブジェクト

User

戻り値:IPrincipal
ログインユーザー情報取得プロパティ

ViewState

※ページロードにより初期化されない変数(保存場所:クライアント側)
戻り値:StateBag

自動割り当て

ラベル等View(見た目)のState(状態)を管理する為に自動的に割り当てられるコントロール
またサーバー側にテキスト変更イベントを定義した場合には、テキストボックスの値も割り当てられる。
(ポストバック時に、テキスト変更イベントで変更前後の値をチェックする為)。
↓の様な隠しコントロールが自動的に作成され値が保持される。
<input
 type="hidden"
 name="__VIEWSTATE"
 id="__VIEWSTATE"
 value="XXXXXXXXXXXX~(以下略)" />
データベースの値を表示する様なコントロールの場合
パラメーターに変更がなければGridを書き換える必要はないので、以下を設定することが望ましい。
デフォルト:Inherit(親コントロールの設定を継承)
<asp:GridView
  ID="myGrid"
  runat="server"
  ~
  ViewStateMode="Disabled">
</asp:GridView>
ページ全体で設定する場合
デフォルト:Enabled(有効)
<%@ Page
  ViewStateMode="Disabled"
  Language="~"
  AutoEventWireup="~"
  CodeBehind="~"
  Inherits="~" %>

明示的な使用法

クラスはページロードによって再インスタンス化される為に値が初期化される。
ViewState変数はページロードされても値が保持される。
public partial class index : System.Web.UI.Page
{
  protected void Page_Load(object sender, EventArgs e)
  {
    //初期化
    if (!Page.IsPostBack)
    { ViewState["count"] = 0; }
  }

  protected void myButton_Click(object sender, EventArgs e)
  {
    //ViewState["count"]には前回ボタンクリック時の値が入っているので更に加算される。
    ViewState["count"] = (int)ViewState["count"] + 1;
  }
}

<form id="myForm" runat="server">
  <%=ViewState["count"] %>
  ⇒ 0,1,2,3,4・・・
  <br />
  <asp:Button ID="myButton" runat="server" Text="Button" OnClick="myButton_Click" />
</form>

※全ビューステートの破棄
ViewState.Clear();

ASP.NET Webフォーム キャッシュ

ASP.NET Webフォーム キャッシュ

概要

一度ブラウザで表示したサイトをメモリに保持しておく事。
再度表示する際のレスポンスが良くなる。
問題点
同一URLであれば、クエリ情報、画面上のコントロールの状態の変更によってパラメーターが異なっても1つのキャッシュとして保存される。
よってユーザーの入力が必要な動的なサイトではレスポンスが良くならない。

ASP.NETの改善点
・リクエストパラメーター
・ヘッダー情報
・ブラウザ種類
等に応じてキャッシュを分ける。
動的なサイトでもレスポンスが良い。

上記改善の手法として、どの種類のデータを保持するか?によって
・出力キャッシュ(ページキャッシュ)
・フラグメントキャッシュ
・データキャッシュ
の種類がある。

出力キャッシュ(ページキャッシュ)

同一URLのページ全体をキャッシュ。
一度表示したページのレスポンスが良くなる。

VaryByParamパラメーター

POSTデータ等のキーによってキャッシュを分ける場合
※~.aspx
<%@ Page
  Title="Home Page"
  Language="C#"
  AutoEventWireup="true"
  CodeBehind="Default.aspx.cs"
  Inherits="WebFormTest._Default" %>
<%@ OutputCache
  Duration="120"
  VaryByParam="*" %>

※~.aspx.cs
protected void Page_Load(object sender, EventArgs e)
{
  Response.Write(s: DateTime.Now.ToString());
}
⇒ページキャッシュされているので前回表示時より120秒以内であれば、
現在時刻でなく前回表示時の時刻が表示されたページが表示される。

Durationパラメーター
キャッシュを保持する時間(秒)

VaryByParamパラメーターの設定値

VaryByParam="id"
キーを複数指定する場合
VaryByParam="list;id"
全てのキーを指定
VaryByParam="*"
キーによる振り分けが不要
VaryByParam="none"

VaryByHeaderパラメーター

HTTPヘッダー情報によってキャッシュを分ける際に使用。

<%@ OutputCache
  VaryByParam="none"
  VaryByHeader="Accept-language"
  Duration="120" %>
※↑ 例はヘッダー情報の「言語」によってキャッシュを分ける設定例。
(「ASP.NET 多言語対応」参照)

フラグメントキャッシュ

ページ内の一部分のみをキャッシュ。
ASP.NETユーザーコントロールでの設定が必要。

データキャッシュ

データベースやXML等、ページを生成する元データをキャッシュ。

ASP.NET Webフォーム サーバーコントロール

Literalコントロール

Text属性
<asp:Literal ID="myLiteral" runat="server" Text="Text属性"></asp:Literal>

Labalコントロールとの違い
コンパイル後はText属性のみになる。
(CSS等で装飾できない)

Labelコントロール

Text属性
<asp:Label ID="myLabel" runat="server" Text="Text属性"></asp:Label>

Literalコントロールとの違い
・コンパイル後、Text属性で出力される。
(CSS等で装飾可能)

TextBoxコントロール

asp.net_textbox

<asp:TextBox ID="TextBox1" TextMode="SingleLine" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox2" TextMode="MultiLine" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox3" TextMode="Password" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox4" TextMode="Date" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox5" TextMode="DateTimeLocal" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox6" TextMode="Month" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox7" TextMode="Number" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox9" TextMode="Range" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox10" TextMode="Search" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox11" TextMode="Phone" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox12" TextMode="Email" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox13" TextMode="Time" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox14" TextMode="Url" runat="server"></asp:TextBox>
<asp:TextBox ID="TextBox15" TextMode="Color" runat="server"></asp:TextBox>

※.Net Framework4.5以上で動作

RadioButtonコントロール

RadioButtonList

<asp:RadioButtonList
  ID="RadioButtonList1" runat="server"
  RepeatDirection="Vertical">
  <asp:ListItem Selected="True">A型</asp:ListItem>
  <asp:ListItem>B型</asp:ListItem>
  <asp:ListItem>O型</asp:ListItem>
  <asp:ListItem>AB型</asp:ListItem>
</asp:RadioButtonList>

<asp:RadioButtonList
  ID="RadioButtonList2" runat="server"
  RepeatDirection="Horizontal">
  ~
</asp:RadioButtonList>

<asp:RadioButtonList
  ID="RadioButtonList3" runat="server"
  RepeatColumns="2">
  ~
</asp:RadioButtonList>

<asp:RadioButtonList
  ID="RadioButtonList4" runat="server"
  RepeatDirection="Horizontal"
  TextAlign="Left">
  ~
</asp:RadioButtonList>

<asp:RadioButtonList
  ID="RadioButtonList5" runat="server"
  RepeatLayout="Table"
  CellSpacing="20"
  RepeatColumns="2">
  ~
</asp:RadioButtonList>

HyperLinkコントロール

HyperLink
<asp:HyperLink ID="HyperLink1" runat="server"
  NavigateUrl="https://office-yone.com/ProProgramer/index.html"
  Target="_blank"
  Text="HyperLink">
</asp:HyperLink>

LinkButtonコントロール

LinkButton
<asp:LinkButton
  ID="LinkButton1" runat="server"
  PostBackUrl="https://office-yone.com/">
  LinkButton
  </asp:LinkButton>

<asp:LinkButton
  ID="LinkButton2" runat="server"
  OnClientClick="fnJump()">JavaScript実行</asp:LinkButton>
<script type="text/javascript">
  function fnJump() {
    window.alert('Hello World');
  }
</script>
HyperLinkとの違い
・OnClientClickイベントを設定できる
・ソース画面でイベント処理できる

Buttonコントロール

~.aspx
<asp:Button
  runat="server" id="astButton" text="aspText"
  OnClick="astButton_click"
  OnClientClick="clientClick()"
/>
<script type="text/javascript">
  function clientClick() {
    window.alert('Hello World');
  }
</script>
~.aspx.cs
protected void aspButton_click(object sender, EventArgs e) {
 Console.WriteLine(sender.ToString());
}
※OnClientClick → OnClickの順で処理される

<asp:Button
  runat="server" id="astButton" text="aspText"
  OnClick="astButton_click"
  OnClientClick="return clientClick()"
/>
<script type="text/javascript">
  function clientClick() {
    ~
    return true/false;
  }
</script>
clientClick()の処理結果がfalseの場合はastButton_clickが処理されない

非同期通信コントロール

ポストバックを発生させずにサーバ側処理を行う為のコントロール
・AJAX Extensionsコントロール
 ScriptManagerコントロール
 UpdatePanelコントロール
 UpdateProgressコントロール
・AJAX Control Toolkit
 ToolkitScriptManagerコントロール
 UpdatePanelAnimationExtenderコントロール
ASP.NET Webフォーム Ajax利用」参照
ポストバックとは?
ポストバックを発生させない方法」参照
ポストバックを発生させる方法」参照

JavaScript用ID設定

<asp:Content
 ID="Content1"
 ContentPlaceHolderID="ContentPlaceHolder1"
 Runat="Server">
  <asp:TextBox
   ID="aspText1"
   runat="server" /><br/>
  <asp:TextBox
   ID="aspText2"
   runat="server"
   ClientIdMode="Static" /><br/>
</asp:Content>

<input
 name="~"
 type="text"
 IDが自動的に変更される
 id="ContentPlaceHolder1_aspText1" /><br/>
<input
 name="~"
 type="text"
 設定したIDが維持される
 id="aspText2" /><br/>