0

私は非常に新しいASP.NET開発者です(さらに言えば、Web開発者です)。タイマーを設定するためのいくつかのコントロールと開始ボタンを含むフォームを提供するWebサーバーを備えた単純なWebサイトをまとめたいと思います。 、を押すと、構成がサーバーに送信され(タイマーが設定されている期間)、クライアントでタイマーが開始されます。有効期限が切れると、これが行われたこともサーバーに送信されます。

これが簡単な場合、このようなことを行う方法を説明してください。これが簡単でない場合、またはそれ以上の場合、これが「これを行うのに適した方法ではない」場合は、より良いアーキテクチャまたは設計について説明してください。これ。

4

1 に答える 1

1

これはクライアント側のものなので、ASP.NETは使用しません:)とにかく、それでもサーバー側を表していることは明らかです。

  1. 1つのコントローラー、2つのビュー、および2つの対応するビューモデルを備えた新しいASP.NETMVCプロジェクト。
  2. ビューには<form>、タイマー<select>またはテキストボックスなどがあります。
  3. コントローラには、POSTされたフォームデータを受信して​​保存するアクションがあり、タイマーがいつ終了するかを指定する非表示フィールドを持つビューに303応答を返します。この値は、次のSession場合に備えてサーバーに保持する必要があります。ユーザーがページを更新します。値は、UTCの絶対日時値として保存する必要があります。
  4. クライアントには、ページの読み込み時にこの非表示フィールドを検査し、を使用してタイマーを設定する単純なクライアントスクリプトがありますsetTimeout
  5. スクリプトには、タイマーが終了したときに呼び出されるコールバック関数も含まれています。このコールバック関数は、送信された非表示の動的<form>要素を作成して入力し、期限切れになったクライアントとタイマーを識別するタグを使用してサーバーにPOSTリクエストを送信します。次に、サーバーは別の303リダイレクトを実行して元のビューに戻します。これには、ユーザーなどへのメッセージが含まれている可能性があります。

これはおそらく、最新の技術を使用し、AJAXまたはjQueryやMootoolsなどの外部フレームワークの使用に固有の複雑さを回避するための単純な方法です。HTML応答をPOSTリクエストに返す代わりに303リダイレクトを使用していることに注意してください。これはユーザーの利益のためであり、ブラウザに「フォームを再送信しますか?」ダイアログを表示し、タイマーがリセットされないようにします。

アップデート:

3xx応答が良い理由:

クライアントがPOSTリクエストを送信すると、Webサーバーは、応答を直接返すか、別のページへの3xxリダイレクトを実行することによって応答できます。応答を直接提供する場合の問題は、HTTPに関する限り、応答のコンテンツ(つまり、Webページ)に「アクセス可能」ではないことです。GET要求で同じコンテンツを取得することはできません。これが、ユーザーがF5キーを押すか、POSTされたページの[更新]を押すと、フォームを再送信するように(不可解な言語で)プロンプトを表示するメッセージボックスが表示される理由です。ただし、ユーザーがフォームを再送信すると、フォームが壊れてしまうことがよくあります。それらのデータは2回処理されるため、アプリケーション。これが、「ポストバック」に大きく依存していたASP.NETWebFormsが段階的に廃止されている理由です。

Javascript

コードは次のようになります。

// bind to this event rather than executing directly because the onload event is only fired after the entire DOM is available. If you run the code immediately then you won't be able to traverse the DOM tree.
window.onload = setUpCallback;

function setUpCallback() {
    var hiddenField = document.getElementByID("someHiddenFieldId");
    var timeStampEnd = parseInt( hiddenField.value ); // this is the number of miliseconds since 1970-Jan-01 00:00
    var timeStampNow = new Date().getTime(); // this also returns a miliseconds-since-1970 value

    var timeToEnd = timeStampEnd - timeStampNow;
    if( timeToEnd > 0 ) {
        window.setTimeout( onTimerEnd, timeToEnd ); // set-up the callback
    }
}

function onTimerEnd() {
    var form = document.createElement("form");
    form.action = "http://mywebsite/uriToSubmitPostTo";
    form.method = "post";
    document.documentElement.appendChild( form );

    var clientField = document.createElement("input");
    clientField.type = "hidden";
    clientField.name = "someFieldName";
    clientField.value = "someValueToIdentifyTheClientOrJustUseSession?";

    form.appendChild( clientField );

    form.submit();
}
于 2013-02-15T01:06:48.117 に答える