ホームページ >バックエンド開発 >PHPチュートリアル >PHPを使用してFTPファイルアップロードの進行状況バーを実装する方法
PHP を使用して FTP ファイル アップロードの進行状況バーを実装する方法
1. 背景の紹介
Web サイト開発では、ファイルのアップロードは一般的な機能です。大きなファイルのアップロードでは、ユーザー エクスペリエンスを向上させるために、多くの場合、ファイルのアップロード プロセスをユーザーに知らせるために、アップロードの進行状況バーを表示する必要があります。この記事では、PHPを使用してFTPファイルアップロードのプログレスバー機能を実装する方法を紹介します。
2. FTP ファイル アップロードの進行状況バーを実装する方法
3. PHP コードの例
フロントエンド ページの例 (upload.html):
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>FTP文件上传进度条</title> <script src="https://cdn.bootcdn.net/ajax/libs/jquery/3.5.1/jquery.min.js"></script> <script> $(document).ready(function () { $("form").submit(function (event) { event.preventDefault(); var formData = new FormData($(this)[0]); $.ajax({ url: 'upload.php', type: 'POST', data: formData, processData: false, contentType: false, xhr: function () { var xhr = new window.XMLHttpRequest(); xhr.upload.addEventListener("progress", function (evt) { if (evt.lengthComputable) { var percentComplete = evt.loaded / evt.total; // 更新进度条 $("#progress-bar").width(Math.round(percentComplete * 100) + '%'); } }, false); return xhr; }, success: function () { alert('文件上传成功!'); } }); }); }); </script> <style> #progress-bar { width: 0%; height: 20px; background-color: #1E90FF; } </style> </head> <body> <form action="upload.php" method="post" enctype="multipart/form-data"> <input type="file" name="file"> <input type="submit" value="上传"> </form> <div id="progress-bar"></div> </body> </html>
バックエンド PHP の例 (upload.php):
<?php $ftp_server = "Your_FTP_Server"; $ftp_user = "Your_FTP_Username"; $ftp_password = "Your_FTP_Password"; $remote_file_path = "/upload/"; if ($_FILES["file"]["error"] > 0) { echo "文件上传失败!"; } else { $file_name = $_FILES["file"]["name"]; $file_tmp = $_FILES["file"]["tmp_name"]; $file_size = $_FILES["file"]["size"]; $ftp_conn = ftp_connect($ftp_server); ftp_login($ftp_conn, $ftp_user, $ftp_password); ftp_pasv($ftp_conn, true); $remote_file = $remote_file_path . $file_name; if (ftp_put($ftp_conn, $remote_file, $file_tmp, FTP_BINARY)) { echo "文件上传成功!"; } else { echo "文件上传失败!"; } ftp_close($ftp_conn); } ?>
上記のコード例では、フロントエンド ページは jQuery ライブラリを使用して、アップロード進行状況イベント ## をリッスンすることで AJAX リクエストを処理します。 #xhr.upload.addEventListener ("progress", function (evt) {}): プログレスバーの幅をリアルタイムで更新します。バックエンド PHP コードは、アップロードされたファイルを受信し、FTP 接続を使用してファイルを FTP サーバーにアップロードします。
上記の方法により、PHP を使用して FTP ファイル アップロードのプログレス バー機能を実装できます。このようにして、ユーザーが大きなファイルをアップロードする場合、ユーザー エクスペリエンスが向上し、アップロードの終了を待つことなくファイルのアップロードの進行状況を明確に確認できるようになります。この記事の内容が皆様のお役に立てれば幸いです。
以上がPHPを使用してFTPファイルアップロードの進行状況バーを実装する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。