成果物
www.youtube.com
ようやくメインの目標を達成することができました。セキュリティ的にはまだまだ改良できるところがあるかもしれませんが、ひとまずシンプルなアップロードシステムができました。
仕組み
Ajaxを使ってリロードなしでファイルを送る。
ボタンが押されたときフォームデータを作成し、AjaxでPHPにファイルを送信します。
[JavaScript] Ajaxでファイルをアップロード【jQuery使用】 - Qiita
画像を表示する処理
PHPのプログラムは、データ指定なしの場合とファイル送信が成功した場合は、アップロードデータ用のディレクトリの中身のファイル名を返します。このファイル名をもとにJavaScriptでというコードを作成し、HTMLを書き換えることで、画像を表示しています。ページを開いた際は、データ指定なしでPHPを呼び出しているので、アップロード済の画像が表示されるのみという仕組みです。
キーが存在するか確認する。
PHPで配列のキーが存在するか調べる：array_key_exists(), isset() | UX MILK
