1. ホーム
  2. Web制作
  3. HTML/Xhtml

Form formタグのEnctype属性の役割とその応用例を紹介します。

2022-01-10 04:23:36
Enctype。ブラウザがデータをサーバーに送り返す際に使用するエンコーディングの種類を指定します。これは、フォームに画像がアップロードされている場合に使用されます。
エンコーディングは3種類あります。
application/x-www-form-urlencoded: 送信前にすべての文字をエンコードする(デフォルト)。これは標準的なエンコーディングフォーマットです。
multipart/form-data。ファイルアップロードコントロールを含むフォームを使用するときに使用する必要があります。
text/plain。フォームデータは、コントロールやフォーマット文字を含まないプレーンテキストとしてエンコードされます。

コピーコード
コードは以下の通りです。

<form action="${pageContext.request.contextPath}/imageUpload_saveOrUpdate.action" method="post" enctype=" multipart/form-data">
<div>
<label> Please select the upload image address:</label>
<input type="file" name="image"/>
</div>
</div>
<div>
<input type="submit" value="upload"/>
</div>
</form>

フォームのenctype="multipart/form-data"の意味は、フォームのMIMEエンコーディングを設定することです。デフォルトでは、このエンコーディングフォーマットは application/x-www-form-urlencoded で、これはファイルのアップロードには使えません; multipart/form-data でのみ、ファイルデータをそのまま渡すことができます。
enctype="multipart/form-data" は、バイナリデータをアップロードするためのものです。
サーバー側のRequestオブジェクトを通して対応するフォームフィールドの値を取得したい場合は、enctypeプロパティにapplication/x-www-form-urlencodedの値(つまり、表示せずに設定できるデフォルト値)を設定する必要があります。
enctype="multipart/form-data" を設定してファイルをアップロードする理由。
理由:enctypeをmultipart/form-dataの値にした後、文字をエンコードせずにバイナリ形式でサーバー側に送信されるため、requestを使用すると対応するフォームの値を直接取得できず、ストリームstreamオブジェクトを介してサーバー側に渡されたバイナリデータをデコードしてデータを読み取る必要があるため。
ファイルをアップロードする場合は、エンコードをmultipart/form-dataに設定する必要があります。