HTML Ashx Development_jquery のいくつかの問題の解決策

質問 1: switch...case の代わりにデリゲート辞書を使用してください。

この問題は、リクエストを処理するときに発見されました。多くのリクエストを処理するために自分のプロジェクトに多くのハンドラを構築することは誰もが望んでいないため、複数のリクエストを 1 つのハンドラ (ajax) で処理することを考えました。ここでは、アクションを判断するために if...else を使用する人はいません。私は switch at も使用しました。最初はそう思っていましたが、徐々に、各ケースはコード ブロックのようなものではなく、その中の変数に独立したスコープを提供できないことがわかりました。ドラゴンボールの孫悟空の言葉を借りれば、「本当に緊張する」。

ネットで検索すると、多くの人がこの問題に遭遇していることがわかりました。解決策の 1 つは、各プロセスをハンドラー内のメソッドに分離することです。これは明確で簡潔ですが、ProcessRequest メソッドでは、リフレクションを使用して対応するメソッドを呼び出す必要があります。この解決策にはあまり満足できなかったので、デリゲーションと辞書を考え出し、リフレクション呼び出しメソッドを辞書内のデリゲートのインデックス付けに変えました。

まず、ハンドラーでプライベート静的デリゲート辞書を宣言します。

static Dictionary>
次に、ハンドラー (一般的なハンドラー クラス) を使用します。静的コンストラクター、そしてさらに重要なのは、静的コンストラクターに処理メソッドを追加することです:

コードをコピーします コードは次のとおりです:

static Handler()
{
hs = new Dictionary>();
hs.Add("add", delegate()
{
int id = int.Parse(req("id"));
string title = req("title")
return "add" > hs.Add("update", delegate()
int id = int.Parse(req("id")); string title = req("title");
return "update"; コード


コードは次のとおりです。


context.Response.ContentType = "text/plain";
HttpRequest req = context.Request

string action; = req["action"].ToLower();
string result = hs[action]();

これにより、スイッチが回避されます。 ...ケースの変数スコープの問題とリフレクション効率の問題。上記で使用した req() メソッドに関して、私のアイデアは、次のような静的メソッドを使用してパブリックなものを提供することです。 コピー コード

コードは次のとおりです:


static string req(string key)
{
return HttpContext.Current.Request[key];

}
static string jss(object) obj )
{

JavaScriptSerializer JSS = new JavaScriptSerializer(); return JSS.Serialize(obj);
問題 2: 権限の問題。

ユーザーがログインしていないとき、またはログインの有効期限が切れているときに、データにアクセスされ続けることは絶対に望ましくありません。ここではログインユーザーがSession["user"]に格納されていると仮定します。もちろんハンドラー内でSession["user"]を判断するのは非常に簡単ですが、問題はそのユーザーをどのように作成するかです。 Session["user"] が null ですか? 指定されたページ (ここではログイン ページ login.html であると仮定します) にジャンプします。はは、この際、context.Response.Redirect ("login.html") を使って解決することは考えられますか?私の最初の反応はこれですが、分析後、ajax は login.html ページをリクエストすることで実行され、結果は次のようになります。はい、しかし、私はまだそうではありませんでした。諦めずにテストしてみると、ajaxリクエストの結果としてlogin.htmlのソースコードが返されました。

実際、Session["user"] が null の場合に特定の値を返すという非常に単純なメソッドがあることは誰もが理解しています。ここでは「ログイン解除」を想定し、各 ajax リクエストの後に判断します。戻り値は「ログイン解除」です。

この方法は非常に簡単で信頼性がありますが、不器用で面倒で、あまり実現可能ではありません。そこで改めて jquery.ajaxSuccess() を考えて統合処理に使いたいと考えたとき、jquery は最初に特定のリクエストのコールバック関数を呼び出してからグローバル コールバックを呼び出すのではないかと少し不安になりました。機能について?この質問でテストを行ったところ、結果は期待どおりでした。最初に特定のリクエストのコールバックが実行され、次にグローバル コールバックが実行されました。仕方なくjqueryのソースコードを確認してみました～。非圧縮の jquery-1.4.2.js で success() メソッドを見つけました。順序を変更すると、次のようになります。

コードをコピー コードは次のとおりです。

function success() {
if ( s.global ) {
trigger( "ajaxSuccess", [xhr, s] );
}
// ローカルコールバックが指定されている場合は、それを起動してデータを渡します
if ( s.success && xhr.responseText!="unlogin" ) {
s .success.call( callbackContext, data, status, xhr );
}
}

ジャンプ可能なコードはどこに書けばいいのでしょうか？各ページ？いいえ、いいえ、これは私たちのプログラム作成スタイルではありません。よく考えてみると、それを jquery ファイル (下部) に書き込むのが実行可能な方法です。 code

コードは次のとおりです: $(document).ajaxSuccess(function(event,xhr,settings){ if(xhr.responseText= ="unlogin"){ window.top.location.href="/login.html";

}

})


すべての ajax が使えるわけではないことは明らかです。ページ上のリクエスト (login.html ページなど) はユーザーのログインを必要とするため、ログインする必要のないページは判断時に除外する必要があります:

コードをコピーします

コードは次のとおりです: if (HttpContext.Current.Request.UrlReferrer.ToString().ToLower().IndexOf("login .html") < 0) { if (HttpContext.Current.Session[ "user"] == null)

{

HttpContext.Current.Response.Write("unlogin") ;
HttpContext.Current.Response.End(); 🎜>

質問 3: データ テンプレート。

必要なものは何でも、すべてが生まれます!このエッセイを書く前に、庭で jquery.tmpl に関する記事を偶然見ました。 tmpl の作成はまさにこの問題の解決策です。この方法が tmpl ほど強力ではないことはわかっていますが、tmpl にはまだ解決されていない問題があります。1. テンプレートが js に保存されている場合、編集が困難です。 、および 2. デザインを容易に表示するには、テンプレートをどこに保存する必要がありますか? tmpl はテンプレートを タグに格納します。これで最初の問題は解決されたと言えますが、2 番目の問題も非常に大きいと感じます。重要。 ！熟考した結果、テンプレートをデータのコンテナー タグに直接保存することしかできません。

コードをコピーします


コードは次のとおりです。

• {タイトル}< ;/a>{コンテンツ}

テンプレートをデータのように直接ターゲットコンテナに書きます。アーティストがスタイルを調整するのは問題ありませんし、プログラムがメソッドを追加するのは問題ありません。仕事！ただし、js はこのテンプレートを直接操作することはできません。ここで行う必要があるのは、このテンプレートを実際のテンプレートに変換することです:

コードをコピー コードは次のとおりです:

$(function() {
var ulList = $("#ulList");
ulList.data("tpl",ulList. html()) .empty();
}

テンプレートをコンテナのデータに保存し、ページが読み込まれた直後にこれを実行するのが最も適切です。バックグラウンドは、後でロードされる実際のデータの json データを提供します。これは非常に簡単です:

コードをコピーします。コードは次のとおりです。

public クラス News
{
public int ID { get; }
public string Title { get; string Content { get; set; }
}
//上記の最初の問題の解決策は、ハンドラー
hs.Add("getNews", delegate()
{
List<) で使用されます。 ;ニュース>リスト = 新しいリスト<ニュース>()
{
新しいニュース(){ ID=1,Title="title1",Content="Content1"},
,Content="Content2" },
new News(){ ID=3,Title="title3",Content="Content3"},
return jss(list);


フロントデスクでデータを取得することについては何も言うことはありません。これは非常に基本的なことです:

コードをコピーコードは次のとおりです: $.get("Handler.ashx?n=" Math.random(), { action: "getNews" }, function(data) {

var list = $.parseJSON(data);

var = $("#ulList");
for (var i = 0; i html = ul.data("tpl").format(list[i]);
}
ul.html(html)
})


string.format メソッドは、データの生成時に使用されました。これは、私の
js の string.format
エッセイに記録されています。 json オブジェクトをサポートするのが目的で、読みやすく、しかも非常に使いやすいです。ここに着くまでに、私はとても興奮していました。テスト結果は次のとおりです。

しかし、イベントを追加した後、それだけでは不十分であることがわかりました。 onclick="show({ID},'{Title}')" をテンプレート li に追加すると、IE で最初にページを開いたときに js エラーが発生します。これはなぜですか?問題は ID パラメータにあります。{ID} は JSON オブジェクトとみなされますが、これは間違った形式の JSON です。JS エラー プロンプトも正常であるため、「{Title}」にはエラーがありません。文字列パラメータとみなされます。この js エラーはプログラムには影響しませんが、js エラーなしで作成したコードを好む人はいません。 解決策は非常に簡単です。show メソッドで数値型が本当に必要な場合は、Title パラメータのように引用符を追加するだけです。しかし、多くの場合、変換する必要がなく、文字列型にしたいことさえあることがわかります。

3週間ぶりに今日の午後は休みを取ったので、彼女に同行したり、友達と飲みに行ったりしたことはありませんでしたが、正直に書き上げました。