☰

XMLHttpRequest POST multipart/form-data 質問する

tag-icon • tag-icon javascript ajax xmlhttprequest
XMLHttpRequest POST multipart/form-data 質問する

JavaScript で XMLHttpRequest を使用して、ファイル タイプ入力要素を含むフォームを POST し、ページの更新を回避して有用な XML を取得したいと考えています。

JavaScript を使用してフォームの target 属性を MSIE の iframe または Mozilla のオブジェクトに設定することで、ページを更新せずにフォームを送信できますが、これには 2 つの問題があります。小さな問題は、target が W3C に準拠していないことです (これが、XHTML ではなく JavaScript で設定している理由です)。大きな問題は、少なくとも OS X Leopard 上の Mozilla では、onload イベントが起動しないことです。さらに、XMLHttpRequest を使用すると、返されるデータが iframe の場合のように XHTML に限定されず、XML になる可能性があるため、応答コードがよりきれいになります。

フォームを送信すると、次のような HTTP が返されます。

Content-Type: multipart/form-data;boundary=<boundary string>
Content-Length: <length>
--<boundary string>
Content-Disposition: form-data, name="<input element name>"

<input element value>
--<boundary string>
Content-Disposition: form-data, name=<input element name>"; filename="<input element value>"
Content-Type: application/octet-stream

<element body>

上記の HTTP ストリームを複製するために XMLHttpRequest オブジェクトの send メソッドを取得するにはどうすればよいですか?

ベストアンサー1

'multipart/form-data'リクエストを自分で作成することもできます（詳細については、http://www.faqs.org/rfcs/rfc2388.html) を記述し、sendメソッド (例: xhr.send(your-multipart-form-data)) を使用します。同様に、Firefox 4+ (Chrome 5+ および Safari 5+ でも) では、より簡単な方法として、フォームデータインターフェースは、このようなリクエストを作成するのに役立ちます。このsend方法はテキストコンテンツに適していますが、画像などのバイナリデータを送信したい場合は、Firefox 3.0以降で導入されている方法を使用できますsendAsBinary。 経由でファイルを送信する方法の詳細についてはXMLHttpRequest、を参照してください。http://blog.igstan.ro/2009/01/pure-javascript-file-upload.html。

おすすめ記事