勉強したことのメモ

webプログラマ見習いが勉強したことのメモ。

FormDataを使ったAjax通信がiPhoneのみエラー

   

FormDataオブジェクトを使用したAjax通信するシステムがあり、PCやAndroid端末では送信できるものの、iPhoneのみ特定ケースでエラーが発生した。以下に症状と対応策をメモ。

 

症状

このサンプルページで作ったようなFormDataオブジェクトとAjax通信の組み合わせで、iPhoneのみ画像を選択しておかないとエラー(fail側)と判定されてしまう。画像を選択すれば送信できる。

ただこれは以前は動いていたように思う。というのも仕事で似たようなソースで書いており、その際にテストしているので動いたはず。

 

エラーの原因

textStatusを出力させると400エラーになっていた。不正な要求もしくは要求の形式が正しくないらしい。FormDataを使わずに1つずつ$('.hoge').val()みたいに取得する形にするか、もしくはajaxではなく普通にsubmitさせれば改善しそうだけどそれは手間がかかる。

次にFormDataの中身を確認してみたところ、iPhoneのみ画像を選択していなくても、なぜかオブジェクトが格納されていた。これが原因っぽい。

 

対応策

iPhoneのみ画像が選択されていない場合はFormDataオブジェクト内から画像のデータを削除する、ということで送信前に以下を追記。

 

まとめ

FormDataをAjaxで送信する場合にiPhoneのみエラーが発生する場合はファイル関連の送信データ部分を疑う。ファイルを選択していないのに、送信データに入っている場合は削除することで改善される。

 - jQuery

  関連記事

jQueryでiframe内の要素を呼び出し

jQueryでiframeで開いたbody内の内容が欲しかった。 ■jQuery ...

POP広告をjQueryで再現する方法

サイト内のリンクをクリックすると、新しいタブもしくはウィンドウで開く広告をちょい ...

リアルタイムプレビュー時の改行とテーブルの上部揃え

■サンプル http://sample.taitan916.info/previ ...

htmlタグが入った内容の文字を丸める

phpである文字列が○文字以上だった際、 省略してお尻に「……」をつけたいという ...

jQueryで画像(タグ内)のsrc情報を取得する場合

すぐに出てこなかったのでメモ。 $('#test').attr('src'); ...

jQueryでコンテンツのスライド

jQueryもしくはJavaScriptでリンクを押すと 右から左にコンテンツを ...

テキストエリアを自動でリサイズ

改行するだけで勝手にリサイズしてくれるので、 ユーザー用でも管理用でも使えそう。 ...

tableのフィルター機能

jQueryのプラグインで簡単にフィルター機能が つけられたのでメモ。 ■必要な ...

jQueryで後から追加された要素にイベントを設定

jQueryで.html()等を使って追加した要素に対してイベントを設定したかっ ...

jQuery Alert Dialogsで表示後に処理したい

最近携わったサイトの中でJavaScript内に「jAlert」とかいう記述があ ...