mirror of
				https://github.com/blakeblackshear/frigate.git
				synced 2025-10-27 10:52:11 +01:00 
			
		
		
		
	Use direct download link instead of blob method (#14347)
This commit is contained in:
		
							parent
							
								
									3879fde06d
								
							
						
					
					
						commit
						0abd514064
					
				@ -18,8 +18,6 @@ export function DownloadVideoButton({
 | 
				
			|||||||
}: DownloadVideoButtonProps) {
 | 
					}: DownloadVideoButtonProps) {
 | 
				
			||||||
  const [isDownloading, setIsDownloading] = useState(false);
 | 
					  const [isDownloading, setIsDownloading] = useState(false);
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  const handleDownload = async () => {
 | 
					 | 
				
			||||||
    setIsDownloading(true);
 | 
					 | 
				
			||||||
  const formattedDate = formatUnixTimestampToDateTime(startTime, {
 | 
					  const formattedDate = formatUnixTimestampToDateTime(startTime, {
 | 
				
			||||||
    strftime_fmt: "%D-%T",
 | 
					    strftime_fmt: "%D-%T",
 | 
				
			||||||
    time_style: "medium",
 | 
					    time_style: "medium",
 | 
				
			||||||
@ -27,48 +25,40 @@ export function DownloadVideoButton({
 | 
				
			|||||||
  });
 | 
					  });
 | 
				
			||||||
  const filename = `${camera}_${formattedDate}.mp4`;
 | 
					  const filename = `${camera}_${formattedDate}.mp4`;
 | 
				
			||||||
 | 
					
 | 
				
			||||||
    try {
 | 
					  const handleDownloadStart = () => {
 | 
				
			||||||
      const response = await fetch(source);
 | 
					    setIsDownloading(true);
 | 
				
			||||||
      const blob = await response.blob();
 | 
					    toast.success("Your review item video has started downloading.", {
 | 
				
			||||||
      const url = window.URL.createObjectURL(blob);
 | 
					 | 
				
			||||||
      const a = document.createElement("a");
 | 
					 | 
				
			||||||
      a.style.display = "none";
 | 
					 | 
				
			||||||
      a.href = url;
 | 
					 | 
				
			||||||
      a.download = filename;
 | 
					 | 
				
			||||||
      document.body.appendChild(a);
 | 
					 | 
				
			||||||
      a.click();
 | 
					 | 
				
			||||||
      window.URL.revokeObjectURL(url);
 | 
					 | 
				
			||||||
      toast.success(
 | 
					 | 
				
			||||||
        "Your review item video has been downloaded successfully.",
 | 
					 | 
				
			||||||
        {
 | 
					 | 
				
			||||||
      position: "top-center",
 | 
					      position: "top-center",
 | 
				
			||||||
        },
 | 
					    });
 | 
				
			||||||
      );
 | 
					  };
 | 
				
			||||||
    } catch (error) {
 | 
					
 | 
				
			||||||
      toast.error(
 | 
					  const handleDownloadEnd = () => {
 | 
				
			||||||
        "There was an error downloading the review item video. Please try again.",
 | 
					 | 
				
			||||||
        {
 | 
					 | 
				
			||||||
          position: "top-center",
 | 
					 | 
				
			||||||
        },
 | 
					 | 
				
			||||||
      );
 | 
					 | 
				
			||||||
    } finally {
 | 
					 | 
				
			||||||
    setIsDownloading(false);
 | 
					    setIsDownloading(false);
 | 
				
			||||||
    }
 | 
					    toast.success("Download completed successfully.", {
 | 
				
			||||||
 | 
					      position: "top-center",
 | 
				
			||||||
 | 
					    });
 | 
				
			||||||
  };
 | 
					  };
 | 
				
			||||||
 | 
					
 | 
				
			||||||
  return (
 | 
					  return (
 | 
				
			||||||
    <div className="flex justify-center">
 | 
					    <div className="flex justify-center">
 | 
				
			||||||
      <Button
 | 
					      <Button
 | 
				
			||||||
        onClick={handleDownload}
 | 
					        asChild
 | 
				
			||||||
        disabled={isDownloading}
 | 
					        disabled={isDownloading}
 | 
				
			||||||
        className="flex items-center gap-2"
 | 
					        className="flex items-center gap-2"
 | 
				
			||||||
        size="sm"
 | 
					        size="sm"
 | 
				
			||||||
 | 
					      >
 | 
				
			||||||
 | 
					        <a
 | 
				
			||||||
 | 
					          href={source}
 | 
				
			||||||
 | 
					          download={filename}
 | 
				
			||||||
 | 
					          onClick={handleDownloadStart}
 | 
				
			||||||
 | 
					          onBlur={handleDownloadEnd}
 | 
				
			||||||
        >
 | 
					        >
 | 
				
			||||||
          {isDownloading ? (
 | 
					          {isDownloading ? (
 | 
				
			||||||
          <ActivityIndicator className="h-4 w-4" />
 | 
					            <ActivityIndicator className="size-4" />
 | 
				
			||||||
          ) : (
 | 
					          ) : (
 | 
				
			||||||
          <FaDownload className="h-4 w-4" />
 | 
					            <FaDownload className="size-4 text-secondary-foreground" />
 | 
				
			||||||
          )}
 | 
					          )}
 | 
				
			||||||
 | 
					        </a>
 | 
				
			||||||
      </Button>
 | 
					      </Button>
 | 
				
			||||||
    </div>
 | 
					    </div>
 | 
				
			||||||
  );
 | 
					  );
 | 
				
			||||||
 | 
				
			|||||||
		Loading…
	
		Reference in New Issue
	
	Block a user