先日、とあるメーカーのキャンペーン用に PHP と Javascript でプログラムを作りました。
そのキャンペーンでは、購入した商品のレシート画像を、フォームから送信して応募します。
一般的なフォーム送信と同様に、入力画面->確認画面->サンクス画面 と遷移していきます。
今回のクライアントは、複数台で構成されているサーバーを利用しているので、フォームで画像をアップロードし確認画面を表示している間に、サーバーが別のサーバーに切り替わった場合、アップロードした画像にアクセスできなくなってしまうことが考えられたので、AJAXを利用して、確認画面を表示させようと考えました。
調べてみると formData API を利用すれば、やりたいことができるようで、早速プログラミングしてみました。
開発は通常PCで行い、まず Chrome で動作チェックします。PCで用いられているブラウザでは問題なく動作しました。
次にスマホで確認、Huawei novalite (Android 7.0) で動作確認もOK。 iOS 系には、 iPod 第4世代(iOS 6.1.6), とiPod 第5世代(iOS 9.3.5)で動作確認したところOK.
そこで、「プログラミング終了！」と、喜んだのもつかの間、WEBデザインを担当している方から、私のiPhone5 では送信できないと、クレームが来ました。 その後iPhone 6S でも動作しないがiPhone 7では正常との連絡がありました。
動作しない iPhone 6S で詳しく調べてみると、formData を利用したところでエラーになっているようでした。
かなり古いiPod でも正常に作動していたので、比較的新しい iPhone 6S などで動作しないとは…
iPhone 5, 6 を利用している人はまだかなりの人たちが利用していると考えられるので、利用できない端末にしてしまう訳にはいきません。
結局、 formData を利用するのは諦め、確認画面ではサムネイルを標示させる目的なので、 FileReader API を利用してサムネイル画像を表示。
画像ファイルの送信は、Ajax ではなく、form を submit することで問題を解決しました。
iPhone5 ,6 S では formData API を利用できないという覚え書きでした。
コメント