我有單擊下載按鈕時，下載文件大約需要 15 秒，因為它必須通過 SFTP 進入服務器，找到正確的路徑/文件，然后返回響應download。超文本標記語言<a class="btn btn-primary btn-sm text-primary btn-download-1" onclick="startDownload('1')"><i class="fa fa-download "></i></a>注意：其中 1 是我知道它是哪個文件的關鍵......現在該按鈕只會觸發下面的這個功能function startDownload(interfaceId) {
window.location = "/nodes/interface/capture/download?port=" + interfaceId;
console.log(interfaceId);
}它基本上刷新頁面并調用下載路徑/節點/界面/捕獲/下載public function download_files(){ $dir = ''; $portNumber = Request::get('port'); $zipMe = false; $remotePath = "/home/john/logs/".$dir."/"; if (!isset($dir) || $dir == null) { return redirect()->back()->withInput()->withFlashDanger('SFTP Could not connect.'); } $acsIp = explode('://', env('ACS_URL')); $acsIp = explode(':',$acsIp[1])[0]; $sftp = new SFTP($acsIp.':22'); if (!$sftp->login('john', '***')) { return redirect()->back()->withInput()->withFlashDanger('SFTP Could not connect.'); } // Get into the Specified Directory $sftpConn = Storage::disk('sftp'); $SFTPFiles = $sftpConn->allFiles('/'.$dir); if ( count($SFTPFiles) > 0 ) { foreach ($SFTPFiles as $file) { $fileName = $file; break; } } else { \Log::info('Files Not found in the Remote!'); return redirect()->back()->withInput()->withFlashDanger('Files Not found in the Remote!'); } // Create and give 777 permission to remote-files directory if (!is_dir(public_path('remote-files/'.$dir))) { mkdir(public_path('remote-files/'.$dir), 0777, true); } $filesToZip = []; foreach ( $SFTPFiles as $fileName ) { if ( $fileName == '..' || $fileName == '.' ) { continue; } else if ( $fileName == '' ) { \Log::info('File not found'); continue; } } }}結果它正在工作，但不知何故，它在那里停留了 15 秒，沒有任何反饋。這真的很糟糕，用戶不知道發生了什么。我想顯示一個模式“正在下載，請不要關閉窗口”，但我不知道該怎么做，因為我必須使用 GET 下載文件。我現在有點卡住了。對我有什么建議嗎？
2 回答
天涯盡頭無女友
TA貢獻1831條經驗 獲得超9個贊
由于延遲是在服務器端，我相信你可以采取兩種方法：
有一條路線來創建隊列作業并確定進度，還有另一條路線供用戶在服務器中下載下載的文件。用戶每秒都會 ping 第一條路由以確定狀態。
download_files()這個想法是在每次創建會話時生成一個唯一的 ID，將其存儲在由路由和另一個路由共享的數組中，以啟動download_files()和存儲其結果。
例子：
$global_progress = array();
$global_files = array();
public function checkup_progress($id = null) {
if ($id == null) {
// this is new request, create job here
$id = generate_id_func();
download_file_job($id);
} else if ($global_progress[$id] != "FINISHED") {
// return $global_progress[$id] result
} else {
// finished, return download link
// return route to "link_to_download_file/$id"
}
}
public function download_file_job($id) {
$global_progress[$id] = "NEW";
// some code
$global_progress[$id] = "IN PROGRESS (1)";
// more code
// more state here
$global_files[$id] = $file;
$global_progress[$id] = "FINISHED";
}
public function link_to_download_file($id) {
// code here
return Response::download($file, $onlyFileName, $headers);
}
如果您不想更改任何內容，可以使用 websocket，它會在幾次操作后更新下載狀態，并將文件發送到客戶端。但這會受到文件大小的限制，因為 websocket 是在 javascript 中處理的，這意味著下載必須首先將 javascript 對象存儲在瀏覽器內存中。
米琪卡哇伊
TA貢獻1998條經驗 獲得超6個贊
在進行重定向之前，顯示一個包含您選擇的消息的覆蓋 div 。這不需要在服務器端執行任何操作。
function startDownload(interfaceId) {
? ? document.getElementById("overlay").style.display = "block"; // Show the overlay
? ? window.location = "/nodes/interface/capture/download?port=" + interfaceId;
? ? console.log(interfaceId);
}
CSS
#overlay {
? position: fixed; /* Sit on top of the page content */
? display: none; /* Hidden by default */
? width: 100%; /* Full width (cover the whole page) */
? height: 100%; /* Full height (cover the whole page) */
? top: 0;
? left: 0;
? right: 0;
? bottom: 0;
? background-color: rgba(0,0,0,0.5); /* Black background with opacity */
? z-index: 2; /* Specify a stack order in case you're using a different order for other elements */
? cursor: pointer; /* Add a pointer on hover */
? display: flex;
? justify-content: center;
? align-items: center;
? color: yellow;
}
超文本標記語言
<div id="overlay">
? Downloading is in progress, please don't close the window
</div>?
- 2 回答
- 0 關注
- 155 瀏覽
添加回答
舉報
0/150
提交
取消