Ajaxを今から勉強する者です。
現在、サイトのフォームから画像をサーバーにアップロードする作業をphpで行っています。
【html】 <form name="sample_form" action="" method="post" enctype="multipart/form-data"> <input type="text" name="content"> <input type="file" accept=".jpg,.gif,.png,image/gif,image/jpeg,image/png" name="sample_image"> <input type="submit" name="sample_submit" value="送信"> </form>
現在は、以下の流れになっています。
1:上のフォームをPOST
2:phpでPOSTの内容をチェック
※例えば「データベースに既に同じ内容のcontentがある」or「ログインしていない」とき、DBへの保存を中止するなど、様々なチェック処理を行う
3:2のチェック作業で問題がなければ、phpで文章をDBに保存し、input type="file"の画像をサーバーの特定のフォルダに保存して、完了。
今までは上記の処理で事足りたのですが、最近、画像をアップロードする前にリサイズしたいと感じるようになりました。
調べたところ、jsでクライアント側で画像をリサイズし、submitのタイミングでリサイズしたデータをAjaxでサーバーに保存するとのことでした。
そこで、疑問なのですが、
1.現在、私はjsのコードはすべて「js-matome.js」というファイルにまとめていて、htmlの<head>内で読み込んでいます。(=誰でも中身を見れる)
もし、Ajaxのコードを書く場合、私でいうところの「js-matome.js」に書くのが普通なのでしょうか?もしくは、phpの専用のファイルを作成して、そこに書くものなのでしょうか?
2.現在は、「phpでPOSTの内容をチェックして、内容に問題なければphpで画像を保存」という形ですが、
「phpでPOSTの内容をチェックして、内容に問題なければAjaxでリサイズした画像を特定のフォルダに保存」ということは可能なのでしょうか?
あるいは、phpの条件分岐の結果に応じてAjaxを実行するのは無理で、Ajaxで画像をリサイズして保存を実現するためには、POSTの内容のチェックの部分もAjaxに統一する必要があるのでしょうか。
※Ajaxに触れるのが初めてで、本当に質問内容が稚拙でお恥ずかしい限りです。。
何卒、道しるべを頂けましたら幸いです。
回答2件
あなたの回答
tips
プレビュー