🔰【HTML・PHP】画像が更新されない問題を解決したい

質問内容

初めて質問させていただきます。
phpとHTMLで「オーダーメイドのジュエリーの完成予想図を閲覧できる」システムを作っています。
MAMP上ではうまく動いていたのですが、エックスサーバー上では完成予想図が更新されない問題が起こっています。

【解決方法と解説】

を教えていただきたいです。よろしくお願いいたします。

問題の詳細

30秒ほどの現状の動画をGドライブに上げました。
MAMPの場合
 エックスサーバーの場合

動画のようにMAMPでは「完成図を見る」を押すと画像が更新されます。しかし、エックスサーバーでは「完成図を見る」を押しても更新されません。「完成図を見る」を押した後にスーパーリロードをすると画像が更新されます。

エラーメッセージ

なし

該当のソースコード（抜粋）

PHP
1//画像合成
2//背景画像作成（リング）
3$ring_image = imagecreatefrompng($ring_array['ring_file_path']);
4//背景画像のサイズ取得（リング）（元々の画像のサイズをそのまま取得）
5$imagesize = getimagesize($ring_array['ring_file_path']);
6$ring_w = $imagesize[0];//[0]は画像の横幅を取得
7$ring_h = $imagesize[1];//[1]は画像の高さを取得
8
9//石1
10// コピー元画像読み込み（石）
11$stone1_image = imagecreatefrompng($stone1_array['stone_file_path']);
12// コピー元画像のサイズ取得（石）
13$imagesize = getimagesize($stone1_array['stone_file_path']);
14$stone1_w = $imagesize[0];//[0]は画像の横幅を取得
15$stone1_h = $imagesize[1];//[1]は画像の高さを取得
16// コピー元画像の配置後のサイズ計算
17$resize_stone1_w = $ring_array['stone1_w'];
18$resize_stone1_h = $ring_array['stone1_h'];
19// リサイズしてコピー
20imagecopyresampled(
21  $ring_image, // コピー先の画像
22	$stone1_image, // コピー元の画像
23	$ring_array['stone1_x'], // コピー先の x 座標
24	$ring_array['stone1_y'], // コピー先の y 座標。
25	0,          // コピー元の x 座標
26	0,          // コピー元の y 座標
27	$resize_stone1_w,  // コピー先の幅
28	$resize_stone1_h,  // コピー先の高さ
29	$stone1_w,     // コピー元の幅
30	$stone1_h);    // コピー元の高さ
31  
32//画像の保存
33imagepng($ring_image, $jewelry_image);
34rename($jewelry_image, "images/jewelry_image/jewelry_image.png");

HTML
1<img class="jewelry_image" src="<?php echo "{$jewelry_image_path}"; ?>" alt="">

【全体のプログラムの流れ】

フォームから見たいリング、宝石の名前がPOSTされる
POSTされたデータを元にDB、画像パスを参照し画像を合成
「images/jewelry_image/jewelry_image.png」の画像を2で合成した画像に書き換える
「images/jewelry_image/jewelry_image.png」を完成図としてHTMLで表示する

【参考コード】
https://dev-lib.com/php-gd-imagecopy/
https://www.youtube.com/watch?v=yvK9z-e5rMo

試したこと

キャッシュの問題だと考え以下のことを試しました。

エックスサーバーの「ブラウザキャッシュ設定」、「サーバーキャッシュ設定」でキャッシュをOFFにした→変化なし
htmlの<head>に以下のコードを挿入した→変化なし

HTML
1<meta http-equiv="Cache-Control" content="no-cache">
2<meta http-equiv="Pragma" content="no-cache">
3<meta http-equiv="Expires" content="0">

htmlの画像表示部分を以下のように変更→画像が表示されなくなる

HTML
1<img class="jewelry_image" src="<?php echo "{$jewelry_image_path} "."?". date("YmdHis"); ?>" alt=""/>

【参考コード】
https://nabewakashi.com/solve-image-cache-problem

補足

私のプログラミング経験は半年ほどです。
キャッシュの理解が甘いのかもしれません、、、
上記で分かりにくいところがありましたらお気軽に質問してください！！

よろしくお願いいたします。

tabuu

2022/08/05 02:40

>htmlの画像表示部分を以下のように変更→画像が表示されなくなる実際にhtmlのソースコードに出力されたurlはどのようになっていますか？正しく出力されていますか？

Nakana

2022/08/09 09:35

返信が遅くなってしまい申し訳ございません。URLは正しく出力されています。

tabuu

2022/08/09 23:46

「URLは正しく出力されています。」とは、URLをブラウザのアドレス欄に入力すると正しい画像が表示されるということでしたら、HTMLのタグに誤りがあると思います。

行動規範の内容に同意します

あなたの回答

tips

プレビュー

行動規範の内容に同意します

質問の解決につながる回答をしましょう。サンプルコードなど、より具体的な説明があると質問者の理解の助けになります。また、読む側のことを考えた、分かりやすい文章を心がけましょう。

まだ回答がついていません

会員登録して回答してみよう

アカウントをお持ちの方は

15分調べてもわからないことは
teratailで質問しよう！

ただいまの回答率
85.48%

質問をまとめることで
思考を整理して素早く解決

テンプレート機能で
簡単に質問をまとめる

質問する

質問をすることでしか得られない、回答やアドバイスがある。

15分調べてもわからないことは、質問しよう！