JS XmlHttpRequest 〜JSでの同期/非同期通信〜

イントロダクション

ブラウザアプリを作成しています。
GoogleMapへのデータ登録と表示を行うシンプルなものです。

設計と思想

今回の実装は、PHPを使用するけどサーバーサイドとクライアントサイドを分断して実装しようと思いましたので以下のようなファイル構成で実装しています。
<クライアント>

  • SampleMap.html
  • SampleMap.js

<サーバー>

  • InsertMap.php
  • GetMapInfo.php

XmlHttpRequest

ここで使用するのはXMLHttpReuqstを使用して実装します。
リクエストのタイプは2つあります。

  1. データを送信しないGET
    XMLHttpReuqst.send(); // 引数なし
  2. データを送信する[POST]()
    XMLHttpReuqst.send(data); // 引数あり

これらは用途により使い分けます。世間巷でよくある$ajaxなどはこれを使用しているのでテクノロジー的には大差ありません。

とりあえずはこんな形で実装します。

しかし

実装したのだけれど、ファイルの送信がうまくいかず。。。以前イメージファイルの送信に以下のようなコードでリクエストを飛ばし、DBへのデータ登録まで確認したのだけれど、またうまくいかなくなりました。

怪しいところ

HTML側のFormに余計な属性をつけた。

enctype="multipart/form-data"

しかし、これは関係ないようでした。どこなのだろうか?
絶賛戦闘中です(笑)



コメントを残す