問題: 画像の読み込みが遅すぎる

Question

Html、Css、Js、Php を使用して、Craiglist に似た Web サイトを作成しました。 ユーザーが 1mb を超える画像をクリックしてアップロードすると、ページが非常に遅くなるか、失敗します (503 エラー)。 100kb以下の画像であれば問題ありません。

1. phpページにtype=file inputタグとpreview imgタグを持つフォームがあります。 > ここでは問題ありません。
2. ユーザーが送信ボタンをクリックすると、フォームは入力タグの値をアップロード コードを含む別の PHP ページに渡します。

質問: サーバーにアップロードする前に画像を拡大縮小する最良の方法は何ですか? Craigslist と比較すると、私のサイトは非常に遅いか、画像のアップロードに失敗します。 アップロードを高速化するにはどうすればよいですか?

https://www.mimarketa.com/mmMain/mmEnglish/mmPostAd.php?country=US&county=Lewis&state=WA&adCity=All_Cities& ;category=ALL

ここと Google で答えを探してみました。

PHP ページ 1: ファイル タグと画像プレビュー タグを入力します。 JS は描画メソッドを介してスケーリングします。

PHP ページ 2 のコード:

$upload_dir = "mmAdPics/";
    $file1 = $upload_dir . rand() . ".png";
    $picUrl1='https://www.mimarketa.com/mmMain/mmEnglish/'.$file1;
    $img1 = $_POST['hidden_​​data1'];
    $img1 = str_replace('data:image/png;base64,', '', $img1);
    $img1 = str_replace(' ', ' ', $img1);
    $data1 = Base64_decode($img1);
    $success = file_put_contents($file1, $data1);
    print $success ? $file1 : 'ファイル 1 を保存できません。 ';

Answer 1

確認してください: https://www.php.net/manual/en/book.imagick.php

具体的には、画像のサイズを変更します。さらに、503 エラーはサーバーのタイムアウトが原因である可能性が高くなります。サーバー側でタイムアウトを増やしたり、クライアント側でアップロードされるファイルのサイズを制限したりできます。