回答編集履歴

3

追記

2022/01/15 08:33

投稿

退会済みユーザー
test CHANGED
@@ -15,7 +15,7 @@
15
15
 
16
16
  質問者さんの案のようにポーリングすると、その頻度やクライアントの数、そしてそれを受けてサーバー側で行う処置の内容によっては、サーバーに過大な負荷を強いるかもしれません。
17
17
 
18
- と言って、asp:button は html に変換されてブラウザに送られると input type="submit" 要素になります。なので、それをクリックすると form が submit されます(即ち PostBack されます)。結果、質問に書いてある「非同期のため処理が先に行ってしまいボタンクリックイベントが終わってしまう」ということになります。
18
+ asp:button は html に変換されてブラウザに送られると input type="submit" 要素になります。なので、それをクリックすると form が submit されます(即ち PostBack されます)。結果、質問に書いてある「非同期のため処理が先に行ってしまいボタンクリックイベントが終わってしまう」ということになります。
19
19
 
20
20
  なので、その対応として、クリックしても submit などは起こらない input type="button" のボタンを追加し、それの click イベントで jQuery.ajax でサーバーに要求をかけ、期待する応答が返ってきたらクライアント側のスクリプトで asp:button をクリックするのが良いと思います。
21
21
 

2

2022/01/15 03:58

投稿

退会済みユーザー
test CHANGED
@@ -1,303 +1,141 @@
1
1
  > 最低 Web サーバーが生きていることを確認できれば良いが、できれば Web サーバーの後ろにある
2
-
3
2
  DB サーバーまで生きていることを確認したい。それを ajax を使って非同期でやりたい
4
-
5
-
6
3
 
7
4
  サーバーにある Web アプリに手を加えることが可能ならば、その確認のための要求を受け応答を返す Web サービスとか HTTP ジェネリックハンドラを追加してはいかがですか。
8
5
 
9
-
10
-
11
6
  要求を受けたら例えば "生きてます" という応答を返す(DB サーバの生存確認も必要なら SELECT クエリを投げてその応答を確認するとかしてから)ようにしておき、その url を ajax を使って非同期で呼び出して "生きてます" という応答を確認して生存を確認するとか。
12
-
13
-
14
7
 
15
8
  いつまで経っても応答が返ってこない場合が問題ですが、タイムアウトの処理は考えておられるそうですので、そのあたりは問題ないですよね?
16
9
 
10
+ ---
11
+
12
+ **2022/1/15 追記**
13
+
14
+ ポーリングしないで済む案を私の回答欄に追記したのですが 1/12 のメンテナンス(と言うより破壊的な変更)で消えてしまいました。再度書く気力はなくしていたのですが、検証に使ったサンプルコードは自分の PC に残っていたのでそれをアップしておきます。
15
+
16
+ 質問者さんの案のようにポーリングすると、その頻度やクライアントの数、そしてそれを受けてサーバー側で行う処置の内容によっては、サーバーに過大な負荷を強いるかもしれません。
17
+
18
+ と言って、asp:button は html に変換されてブラウザに送られると input type="submit" 要素になります。なので、それをクリックすると form が submit されます(即ち PostBack されます)。結果、質問に書いてある「非同期のため処理が先に行ってしまいボタンクリックイベントが終わってしまう」ということになります。
19
+
20
+ なので、その対応として、クリックしても submit などは起こらない input type="button" のボタンを追加し、それの click イベントで jQuery.ajax でサーバーに要求をかけ、期待する応答が返ってきたらクライアント側のスクリプトで asp:button をクリックするのが良いと思います。
21
+
22
+ ユーザーに asp:button をクリックされたくなければ CSS で非表示にしてください。
23
+
24
+ 上記が期待通り動くかを検証したサンプルコードを以下に載せておきます。
17
25
 
18
26
 
19
- ---
27
+ **.aspx**
20
28
 
21
-
22
-
23
- **【追記】**
24
-
25
-
26
-
27
- > javascriptコード内にあるbtnSecとasp.netのbtnSecは同じIDです。
28
-
29
-
30
-
31
- > ただコメントのとおりasp:buttonのreturnが非同期ですのでAjaxの回答を待たずにTrueを返してリダイレクト?してしまう現象が発生してしまいました。
32
-
33
-
34
-
35
- asp:button は html に変換されてブラウザに送られると input type="submit" 要素になります。なので、それをクリックすると form が submit されます (リダイレクトではなくて PostBack されます)。同じボタンのクリックイベントで ajax で非同期要求するとそこのところは避けられません。
36
-
37
-
38
-
39
- それに対応するための質問者さんの案が、
40
-
41
-
42
-
43
- > それを一定周期にしHiddenにて値を保持することで
44
-
45
-
46
-
47
- というようにポーリングすることだと理解していますが、その頻度やクライアントの数、そしてそれを受けてサーバー側で行う処置の内容によっては、サーバーに過大な負荷を強いるかもしれません。
48
-
49
-
50
-
51
- ということで、ポーリングしなくても済む以下の案を提案します。
52
-
53
-
54
-
55
- (1) クリックしても何も起こらない input type="button" 要素を追加する。
56
-
57
-
58
-
59
- (2) 上の (1) で追加したボタンの click イベントで ajax を使って非同期でサーバー側の特定の url を呼び出す。
60
-
61
-
62
-
63
- (3) 期待する応答が返ってきたらスクリプトで asp:button をクリックする。
64
-
65
-
66
-
67
- (4) ユーザーに直接 asp:button をクリックされては困るなら css を使って隠しボタンにする。
68
-
69
-
70
-
71
- 一応コードを書いて検証しましたので、そのコードを以下に載せておきます。
72
-
73
-
74
-
75
- **WebForm1.aspx**
76
-
77
-
78
-
79
- timeout: 5000 設定しているので、5 秒以内200 応答があれば done に設定た function が実行されます。サンプルコードの要求先の Handler1.ashx は 3 秒待って応答を返すので timeout: 5000 なら done になります。timeout: 2000 とか 3 秒より短くすると fail になります。
29
+ timeout: 5000 設定してコードを載せた HTTP ジェネリックハンドラ Handler1.ashx を呼び出ています。Handler1.ashx は 3 秒待って応答を返すので done の function が実行され、それにより asp:button がクリックされます。 timeout: 2000 すると fail になります。
80
-
81
-
82
-
83
- サーバー側のコードの書き方によっては何らかの問題で必要な処理ができない場合も 200 応答を返すこともあると思います。下のサンプルコードでは単純に "生きてます" という応答を確認していますが、実際はもう少し考えた方が良さそうです。
84
-
85
-
86
30
 
87
31
  ```
32
+ <%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs"
33
+ Inherits="WebForms1.WebForm1" %>
88
34
 
89
35
  <!DOCTYPE html>
90
36
 
37
+ <html xmlns="http://www.w3.org/1999/xhtml">
38
+ <head runat="server">
39
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
40
+ <title></title>
41
+ <script src="Scripts/jquery-3.4.1.js"></script>
42
+ <script type="text/javascript">
43
+ $(function () {
44
+ $("#btnSec").on("click", function () {
45
+ $.ajax({
46
+ type: "get",
47
+ url: "Handler1.ashx",
48
+ timeout: 5000
49
+ }).done(function (data) {
50
+ if (data == "生きてます") {
51
+ var hiddenbutton = document.getElementById("Button1");
52
+ hiddenbutton.click();
53
+ }
54
+ }).fail(function () {
55
+ $("#Label1").text("タイムアウトまたはサーバーエラー");
56
+ });
57
+ });
58
+ });
59
+ </script>
60
+ <style type="text/css">
61
+ .style1
62
+ {
63
+ display: none;
64
+ }
65
+ </style>
66
+ </head>
67
+ <body>
68
+ <form id="form1" runat="server">
69
+ <div>
70
+ <input id="btnSec" type="button" value="反映" />
71
+ <asp:Button ID="Button1" runat="server"
72
+ OnClick="ClickBtnSection" CssClass="style1" />
73
+ <asp:Label ID="Label1" runat="server" Text="Label1 初期値"></asp:Label>
74
+ </div>
75
+ </form>
76
+ </body>
77
+ </html>
78
+ ```
79
+
80
+ **.aspx.cs**
81
+
82
+ ```
83
+ using System;
84
+
85
+ namespace WebForms1
86
+ {
87
+ public partial class WebForm1 : System.Web.UI.Page
88
+ {
89
+ protected void ClickBtnSection(object sender, EventArgs e)
90
+ {
91
+ Label1.Text = "Button1 がクリックされました";
92
+ }
93
+ }
94
+ }
95
+ ```
96
+
97
+ **Handler1.ashx** (下のコードは Handler1.ashx.cs のもの)
98
+
99
+ 要求を受けると 3 秒待って "生きてます" という応答を返します。実際は本番の asp:button クリックで期待されるサーバー側での操作ができるかを検証してその成否を応答として返すようにするのが良いと思います。
100
+
101
+ ```
102
+ using System;
103
+ using System.Collections.Generic;
104
+ using System.Linq;
105
+ using System.Web;
106
+
107
+ namespace WebForms1
108
+ {
109
+ /// <summary>
110
+ /// Handler1 の概要の説明です
111
+ /// </summary>
112
+ public class Handler1 : IHttpHandler
113
+ {
114
+
115
+ public void ProcessRequest(HttpContext context)
116
+ {
117
+ System.Threading.Thread.Sleep(3000);
118
+ context.Response.ContentType = "text/plain";
119
+ context.Response.Write("生きてます");
120
+ }
121
+
122
+ public bool IsReusable
123
+ {
124
+ get
125
+ {
126
+ return false;
127
+ }
128
+ }
129
+ }
130
+ }
131
+ ```
132
+
133
+ 上のコードの実行して[反映]ボタンをクリックした結果は、timeout: 5000 の場合:
91
134
 
92
135
 
93
- <html xmlns="http://www.w3.org/1999/xhtml">
136
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-01-15/639f5a36-3251-41f3-9e6c-1fb9802908e6.jpeg)
94
137
 
95
- <head runat="server">
138
+ timeout: 2000 の場合:
96
139
 
97
- <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
140
+ ![イメージ説明](https://ddjkaamml8q8x.cloudfront.net/questions/2022-01-15/8d2e91c6-2bcf-41ed-bedd-04aa51664ac8.jpeg)
98
141
 
99
- <title></title>
100
-
101
- <script src="Scripts/jquery-3.4.1.js"></script>
102
-
103
- <script type="text/javascript">
104
-
105
- $(function () {
106
-
107
- $("#btnSec").on("click", function () {
108
-
109
- $.ajax({
110
-
111
- type: "get",
112
-
113
- url: "Handler1.ashx",
114
-
115
- timeout: 5000
116
-
117
- }).done(function (data) {
118
-
119
- if (data == "生きてます") {
120
-
121
- var hiddenbutton = document.getElementById("Button1");
122
-
123
- hiddenbutton.click();
124
-
125
- }
126
-
127
- }).fail(function () {
128
-
129
- $("#Label1").text("タイムアウトまたはサーバーエラー");
130
-
131
- });
132
-
133
- });
134
-
135
- });
136
-
137
- </script>
138
-
139
- <style type="text/css">
140
-
141
- .style1
142
-
143
- {
144
-
145
- display: none;
146
-
147
- }
148
-
149
- </style>
150
-
151
- </head>
152
-
153
- <body>
154
-
155
- <form id="form1" runat="server">
156
-
157
- <div>
158
-
159
- <input id="btnSec" type="button" value="反映" />
160
-
161
- <asp:Button ID="Button1" runat="server"
162
-
163
- OnClick="ClickBtnSection" CssClass="style1" />
164
-
165
- <asp:Label ID="Label1" runat="server" Text="Label1 初期値"></asp:Label>
166
-
167
- </div>
168
-
169
- </form>
170
-
171
- </body>
172
-
173
- </html>
174
-
175
- ```
176
-
177
-
178
-
179
- **WebForm1.aspx.cs**
180
-
181
-
182
-
183
- ```
184
-
185
- using System;
186
-
187
-
188
-
189
- namespace WebForms1
190
-
191
- {
192
-
193
- public partial class WebForm1 : System.Web.UI.Page
194
-
195
- {
196
-
197
- protected void ClickBtnSection(object sender, EventArgs e)
198
-
199
- {
200
-
201
- Label1.Text = "Button1 がクリックされました";
202
-
203
- }
204
-
205
- }
206
-
207
- }
208
-
209
- ```
210
-
211
-
212
-
213
- **Handler1.ashx.cs (HTTP ジェネリックハンドラ)**
214
-
215
-
216
-
217
- 上の (2) に書いた「特定の url」に該当するのがこれ。以下のコードでは単純に Thread.Sleep(3000) で 3 秒待ってから "生きてます" という応答を返すだけですが、イベントハンドラ ClickBtnSection が実行可能かを調べるコードを書いておくのが良いかもしれません。
218
-
219
-
220
-
221
-
222
-
223
- ```
224
-
225
- using System;
226
-
227
- using System.Collections.Generic;
228
-
229
- using System.Linq;
230
-
231
- using System.Web;
232
-
233
-
234
-
235
- namespace WebForms1
236
-
237
- {
238
-
239
- /// <summary>
240
-
241
- /// Handler1 の概要の説明です
242
-
243
- /// </summary>
244
-
245
- public class Handler1 : IHttpHandler
246
-
247
- {
248
-
249
-
250
-
251
- public void ProcessRequest(HttpContext context)
252
-
253
- {
254
-
255
- System.Threading.Thread.Sleep(3000);
256
-
257
- context.Response.ContentType = "text/plain";
258
-
259
- context.Response.Write("生きてます");
260
-
261
- }
262
-
263
-
264
-
265
- public bool IsReusable
266
-
267
- {
268
-
269
- get
270
-
271
- {
272
-
273
- return false;
274
-
275
- }
276
-
277
- }
278
-
279
- }
280
-
281
- }
282
-
283
- ```
284
-
285
-
286
-
287
- 上のコードの実行結果は以下のようになります。
288
-
289
-
290
-
291
- **timeout: 5000**
292
-
293
-
294
-
295
- ![イメージ説明](80c24c4ce5e476af50f7e07eb5dfc060.jpeg)
296
-
297
-
298
-
299
- **timeout: 2000**
300
-
301
-
302
-
303
- ![イメージ説明](5d9681f7ef439eab9f601ff08b801a61.jpeg)

1

追記

2022/01/11 03:03

投稿

退会済みユーザー
test CHANGED
@@ -13,3 +13,291 @@
13
13
 
14
14
 
15
15
  いつまで経っても応答が返ってこない場合が問題ですが、タイムアウトの処理は考えておられるそうですので、そのあたりは問題ないですよね?
16
+
17
+
18
+
19
+ ---
20
+
21
+
22
+
23
+ **【追記】**
24
+
25
+
26
+
27
+ > javascriptコード内にあるbtnSecとasp.netのbtnSecは同じIDです。
28
+
29
+
30
+
31
+ > ただコメントのとおりasp:buttonのreturnが非同期ですのでAjaxの回答を待たずにTrueを返してリダイレクト?してしまう現象が発生してしまいました。
32
+
33
+
34
+
35
+ asp:button は html に変換されてブラウザに送られると input type="submit" 要素になります。なので、それをクリックすると form が submit されます (リダイレクトではなくて PostBack されます)。同じボタンのクリックイベントで ajax で非同期要求するとそこのところは避けられません。
36
+
37
+
38
+
39
+ それに対応するための質問者さんの案が、
40
+
41
+
42
+
43
+ > それを一定周期にしHiddenにて値を保持することで
44
+
45
+
46
+
47
+ というようにポーリングすることだと理解していますが、その頻度やクライアントの数、そしてそれを受けてサーバー側で行う処置の内容によっては、サーバーに過大な負荷を強いるかもしれません。
48
+
49
+
50
+
51
+ ということで、ポーリングしなくても済む以下の案を提案します。
52
+
53
+
54
+
55
+ (1) クリックしても何も起こらない input type="button" 要素を追加する。
56
+
57
+
58
+
59
+ (2) 上の (1) で追加したボタンの click イベントで ajax を使って非同期でサーバー側の特定の url を呼び出す。
60
+
61
+
62
+
63
+ (3) 期待する応答が返ってきたらスクリプトで asp:button をクリックする。
64
+
65
+
66
+
67
+ (4) ユーザーに直接 asp:button をクリックされては困るなら css を使って隠しボタンにする。
68
+
69
+
70
+
71
+ 一応コードを書いて検証しましたので、そのコードを以下に載せておきます。
72
+
73
+
74
+
75
+ **WebForm1.aspx**
76
+
77
+
78
+
79
+ timeout: 5000 に設定しているので、5 秒以内に 200 応答があれば done に設定した function が実行されます。サンプルコードの要求先の Handler1.ashx は 3 秒待って応答を返すので timeout: 5000 なら done になります。timeout: 2000 とか 3 秒より短くすると fail になります。
80
+
81
+
82
+
83
+ サーバー側のコードの書き方によっては何らかの問題で必要な処理ができない場合も 200 応答を返すこともあると思います。下のサンプルコードでは単純に "生きてます" という応答を確認していますが、実際はもう少し考えた方が良さそうです。
84
+
85
+
86
+
87
+ ```
88
+
89
+ <!DOCTYPE html>
90
+
91
+
92
+
93
+ <html xmlns="http://www.w3.org/1999/xhtml">
94
+
95
+ <head runat="server">
96
+
97
+ <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
98
+
99
+ <title></title>
100
+
101
+ <script src="Scripts/jquery-3.4.1.js"></script>
102
+
103
+ <script type="text/javascript">
104
+
105
+ $(function () {
106
+
107
+ $("#btnSec").on("click", function () {
108
+
109
+ $.ajax({
110
+
111
+ type: "get",
112
+
113
+ url: "Handler1.ashx",
114
+
115
+ timeout: 5000
116
+
117
+ }).done(function (data) {
118
+
119
+ if (data == "生きてます") {
120
+
121
+ var hiddenbutton = document.getElementById("Button1");
122
+
123
+ hiddenbutton.click();
124
+
125
+ }
126
+
127
+ }).fail(function () {
128
+
129
+ $("#Label1").text("タイムアウトまたはサーバーエラー");
130
+
131
+ });
132
+
133
+ });
134
+
135
+ });
136
+
137
+ </script>
138
+
139
+ <style type="text/css">
140
+
141
+ .style1
142
+
143
+ {
144
+
145
+ display: none;
146
+
147
+ }
148
+
149
+ </style>
150
+
151
+ </head>
152
+
153
+ <body>
154
+
155
+ <form id="form1" runat="server">
156
+
157
+ <div>
158
+
159
+ <input id="btnSec" type="button" value="反映" />
160
+
161
+ <asp:Button ID="Button1" runat="server"
162
+
163
+ OnClick="ClickBtnSection" CssClass="style1" />
164
+
165
+ <asp:Label ID="Label1" runat="server" Text="Label1 初期値"></asp:Label>
166
+
167
+ </div>
168
+
169
+ </form>
170
+
171
+ </body>
172
+
173
+ </html>
174
+
175
+ ```
176
+
177
+
178
+
179
+ **WebForm1.aspx.cs**
180
+
181
+
182
+
183
+ ```
184
+
185
+ using System;
186
+
187
+
188
+
189
+ namespace WebForms1
190
+
191
+ {
192
+
193
+ public partial class WebForm1 : System.Web.UI.Page
194
+
195
+ {
196
+
197
+ protected void ClickBtnSection(object sender, EventArgs e)
198
+
199
+ {
200
+
201
+ Label1.Text = "Button1 がクリックされました";
202
+
203
+ }
204
+
205
+ }
206
+
207
+ }
208
+
209
+ ```
210
+
211
+
212
+
213
+ **Handler1.ashx.cs (HTTP ジェネリックハンドラ)**
214
+
215
+
216
+
217
+ 上の (2) に書いた「特定の url」に該当するのがこれ。以下のコードでは単純に Thread.Sleep(3000) で 3 秒待ってから "生きてます" という応答を返すだけですが、イベントハンドラ ClickBtnSection が実行可能かを調べるコードを書いておくのが良いかもしれません。
218
+
219
+
220
+
221
+
222
+
223
+ ```
224
+
225
+ using System;
226
+
227
+ using System.Collections.Generic;
228
+
229
+ using System.Linq;
230
+
231
+ using System.Web;
232
+
233
+
234
+
235
+ namespace WebForms1
236
+
237
+ {
238
+
239
+ /// <summary>
240
+
241
+ /// Handler1 の概要の説明です
242
+
243
+ /// </summary>
244
+
245
+ public class Handler1 : IHttpHandler
246
+
247
+ {
248
+
249
+
250
+
251
+ public void ProcessRequest(HttpContext context)
252
+
253
+ {
254
+
255
+ System.Threading.Thread.Sleep(3000);
256
+
257
+ context.Response.ContentType = "text/plain";
258
+
259
+ context.Response.Write("生きてます");
260
+
261
+ }
262
+
263
+
264
+
265
+ public bool IsReusable
266
+
267
+ {
268
+
269
+ get
270
+
271
+ {
272
+
273
+ return false;
274
+
275
+ }
276
+
277
+ }
278
+
279
+ }
280
+
281
+ }
282
+
283
+ ```
284
+
285
+
286
+
287
+ 上のコードの実行結果は以下のようになります。
288
+
289
+
290
+
291
+ **timeout: 5000**
292
+
293
+
294
+
295
+ ![イメージ説明](80c24c4ce5e476af50f7e07eb5dfc060.jpeg)
296
+
297
+
298
+
299
+ **timeout: 2000**
300
+
301
+
302
+
303
+ ![イメージ説明](5d9681f7ef439eab9f601ff08b801a61.jpeg)