AJAX関連

JavaScript

ASP.NET関連

※以下はASP.NET 2.0に ASP.NET AJAX Extensionをインストールして開発する場合の話

関連Webサイト

Tutorial

  • ASP.NET AJAX Control Toolkitを利用するには?
    • Control ToolkitはASP.NET AJAX本体には含まれていない。Control Toolkitで提供される各コントロールを利用するには、ASP.NET AJAX本体のインストールに加えて、Control Toolkitの動作に必要なファイルをアプリケーションに配置する必要がある。

動作モデル

  • クライアント中心モデル
    • クライアント中心モデルでは、JavaScriptで記述すると煩雑になるコードを簡潔に記述するためのJavaScriptライブラリ群であるMicrosoft AJAX Libraryを活用
  • サーバ中心モデル
    • サーバ中心モデルは、JavaScriptコードを一切記述しないでAjaxアプリケーションを実現するための仕組み
    • JavaScriptコードは、ASP.NET AJAXのコントロールが生成するため、開発者はJavaScriptについて特に意識することなく開発することが可能
    • サーバ中心モデルのアプローチは、2つの方式にに大きく分かれる
      • ASP.NET 2.0 AJAX Extensionsを活用する方式
      • AJAX Control Toolkitを活用する方式

System.Web.Extensionsが見つからないというエラーについて

  • サーバに発行したAJAXアプリが以下のようなエラーを出す場合
    構成にエラーがあります。
    説明: この要求を処理するために必要な構成ファイルの処理中にエラーが発生しました。
    以下のエラーの詳細を確認し、構成ファイルに変更を加えてください。
    
    パーサー エラー メッセージ: ファイルまたはアセンブリ 'System.Web.Extensions, 
    Version=1.0.61025.0, Culture=neutral, PublicKeyToken=31bf3856ad364e35'、
    またはその依存関係の 1 つが読み込めませんでした。指定されたファイルが
    見つかりません。
  • これはサーバにASP.NET AJAX Extension をインストールしていないときに起きる。
  • つまりサーバマシンに同Extensionのインストールが必要ってこと
  • 参考URL:http://forums.microsoft.com/MSDN-JA/ShowPost.aspx?PageIndex=1&SiteID=7&PageID=1&PostID=1797196
    ASP.NET AJAX Extensions は、ASPAJAXExtSetup.msi をセットアップすることで、
    GAC([C:\WINDOWS\assembly])へ System.Web.Extensions.dll というアセンブリが
    インストールされますので、通常は Web アプリケーションの Bin フォルダへ
    コピーする必要はありません。
    もし、この System.Web.Extensions.dll を Bin フォルダへコピーしたら
    アプリケーションが正常に動作したと言うことであれば、ASPAJAXExtSetup.msi の
    セットアップが正常におこなわれていない可能性があります。
    一方、AJAX Control Toolkit は、AjaxControlToolkit.dll と各言語ごとの 
    AjaxControlToolkit.resources.dll というアセンブリで構成されます。
    このアセンブリは GAC にはインストールされませんので、
    Web アプリケーションの Bin フォルダになければなりません。

最初ただのASP.NETだったWebサービスに後からAJAX対応を追加したい場合

  • ASP.NET AJAXを使ってJavaScriptからWebサービスを呼び出すにはWebサービス側もASP.NET AJAXに対応させる必要があります
  • Web.configに以下のタグ記述を追加する必要がある模様
  • 別のサイトを一つAJAXありで作ってそこのWeb.configからコピーするとよい
    • configuration/configSections(configurationタグ内の最初のタグでなくてはならない)
    • configuration/system.web/pages
    • configuration/system.web/compilation/assemblies
    • configuration/system.web/httpHandlers
    • configuration/system.web/httpModules
    • configuration/system.web.extensions
    • configuration/system.webServer
  • System.Web.Extensions.dllの参照を追加する必要がある
  • サービスのソースに以下のusingが必要
    using System.Web.Script.Services; 
  • サービスクラスに[ScriptService]属性を付ける必要がある
  • サーバにASP.NET AJAX自体のインストールが必須なのは言うまでもない
  • うまく追加できたかどうかは、サービスのURLの.asmxの後に /jsをつけて表示させてみる。プロキシのJavaScriptが表示されたらOKと見てよい
  • HelloWorldなWebサービスを作ってプロキシを表示させた例
    var Service=function() {
      Service.initializeBase(this);
      this._timeout = 0;
      this._userContext = null;
      this._succeeded = null;
      this._failed = null;
    }
    Service.prototype=
    {
      HelloWorld:function(succeededCallback, failedCallback, userContext) 
      {
          return this._invoke(
           Service.get_path(), 'HelloWorld',false,{},
           succeededCallback,failedCallback,userContext ); 
      }
    }
    Service.registerClass('Service',Sys.Net.WebServiceProxy);
    Service._staticInstance = new Service();
    Service.set_path = function(value) { Service._staticInstance._path = value; }
    Service.get_path = function() { return Service._staticInstance._path; }
    Service.set_timeout = function(value) { Service._staticInstance._timeout = value; }
    Service.get_timeout = function() { return Service._staticInstance._timeout; }
    Service.set_defaultUserContext = function(value) { Service._staticInstance._userContext = value; }
    Service.get_defaultUserContext = function() { return Service._staticInstance._userContext; }
    Service.set_defaultSucceededCallback = function(value) { Service._staticInstance._succeeded = value; }
    Service.get_defaultSucceededCallback = function() { return Service._staticInstance._succeeded; }
    Service.set_defaultFailedCallback = function(value) { Service._staticInstance._failed = value; }
    Service.get_defaultFailedCallback = function() { return Service._staticInstance._failed; }
    Service.set_path("/AjaxTst/Service.asmx");
    Service.HelloWorld= function(onSuccess,onFailed,userContext) 
    {
       Service._staticInstance.HelloWorld(onSuccess,onFailed,userContext); 
    }

ASP.NET AJAXからWebサービスを呼び出す

ひっかかりやすい注意点。FAQ的なこと

  • 呼び出す側のASP.NETのサイトと呼び出されるWebサービスは同じサーバー内にある必要があります。
  • 呼び出す側のASP.NETのサイトと呼び出されるWebサービスが同じディレクトリ内に無い場合、ScriptManagerに指定するURLは絶対パスである必要があります。たとえ同じサーバー内にあっても相対パス指定はできないので注意。(ヘルプにはできるかのように書いてありますが、ダメな模様)
  • 呼び出す側も呼び出される側もASP.NET AJAXに対応させる必要があります。Web.configがちゃんと両方とも書きかわっているか確認して下さい
  • ASP.NET AJAXの拡張とWSE3.0の拡張は共存できるようです(同時に同じWebサービスで使える)両者ともWeb.configに設定が追加されますが、それらがマージされたような感じになります。
  • サービス側を修正しないで呼ぶ方法も実はあるらしいのだが、未確認(2008.8.20)

プロキシクラス

  • プロキシクラスはサーバ(呼出側ではなく、サービス側)によって生成される
  • プロキシからの呼出は XMLHTTPオブジェクトを通じて非同期で行われる
  • プロキシは Sys.Net.WebServiceProxyクラス(ASP.NET AJAXで用意されているJavaScriptのクラス)から派生する

サービス側でやること

  • System.Web.Extensions への参照を追加する
  • using System.Web.Script.Services;
  • Webサービス側のクラスに ScriptService属性をつける
  • Web.ConfigにScriptHandlerFactory HTTPハンドラを登録(AJAXテンプレからプロジェクトを作った場合は既に登録されている)
  • シリアル化のフォーマット指定(任意)
    • 規定ではJSON
    • メソッドにScriptMethod属性で指定する
      [ScriptMethod(ResponseFormat.xml)] //XMLを指定

クライアント側ASP.NETサイトでやること

  • 呼び出すページに ScriptManagerを配置
  • ServerReference子要素のpath属性にasmxのURLを指定。ただし、ここに指定できるのは呼び出す側と同じサイトにあるWebサービスのみ
  • ServerReference.Inline = trueのとき、プロキシクラスはページ内のインラインスクリプトとして生成される
  • ServerReference.Inline = trueのときは、違うディレクトリにあるWebサービスを呼ぶことはできない
  • ServerReferenceの設定はScriptManagerコントロールのプロパティから「Services」をクリックすると設定できる
    • ASP.NETのプログラムでも設定できる
      ScriptManager1.Services[0].Path = "http://xxx/hoge.asmx";
  • 呼出の結果はJavaScriptで成功コールバック、失敗コールバックを用意して処理する
  • Web.configに一連の設定があること。特に最初AJAX用に作ってなかったページを後から対応させるときは注意

Path cannot be emptyという例外メッセージについて

  • ScriptManagerが'Path cannot be empty'という例外を出す場合は、ScriptManagerのServiceReference タグの Path属性に値が正しくセットされているかチェック。これが空の文字("")だとこのエラーが出る。

トップ   編集 凍結 差分 バックアップ 添付 複製 名前変更 リロード   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS
Last-modified: 2009-04-12 (日) 07:33:02 (4346d)