Node.js 連続したHTTPリクエストの送受信

macOS 10.15.7 / node v18.12.1 / express 4.18.2

CGI（Common Gateway Interface）方式

HTTP送受信を２回行う。１度目のリクエストで formにより値を入力・送信するページをブラウザに表示する。２度目のリクエストで入力された値をサーバに送信し、サーバは値を利用したページを作成してクライアントに返す。最初のページとそのあとのページは別物である。これが CGI方式の基本動作である。

１度目の送信

http://localhost:50002/test1.html

Webサーバ（Node.js）

test1.html

２度目の送信

http://localhost:50002/test2.html

Webサーバ（Node.js）

test2.html

Ajax（Asynchronous JavaScript ＆ XML）方式

HTTP送受信を２回行う。１度目のリクエストで XMLHttpRequestクラスのリクエスト機能を使用して値を送信するページをブラウザに表示する。送信ボタンにより入力された値をサーバに送信し（２度目のリクエスト）、サーバは値のみをクライアントに返す。サーバから値を受け取ったクライアントは、値をタグに編集して表示する。このやり取りは同一のページ上で行われる。これが Ajax方式の基本動作である。

１度目の送信

http://localhost:50002/test3.html

Webサーバ（Node.js）

test3.html

XMLHttpRequestによるリクエストの URLは相対パス名でもよい。自動的に補完されるようだ。

２度目の送信

http://localhost:50002/test4.js

Webサーバ（Node.js）

[ 注意事項 ]　CORSエラーの発生

localhostの IPアドレスは 192.168.11.3 であるが、アドレスが正しくても次の指定はエラーになる。１度目のリクエストのホスト名が localhostに対し、２度目のリクエストのホスト名が形式的に異なるので CORSエラーにより弾かれる。

１度目のリクエストを、http://192.168.11.3:50002/test3.html とすれば問題ない。

１度目のリクエストと２度目のリクエストが異なるポート番号のサーバーに送られた場合も CORSエラーになる。（こちらこそ本来のセキュリティの問題であるが）

もし、これらの制約を回避して CORSエラーを発生させないようにするには、２度目のリクエストに対するレスポンスの作成時、ヘッダに Access-Control-Allow-Originプロパティを設定する。値にはアクセスを許可する URLを指定するが、どのような URLでも許可する場合には * を指定する。