⬇️ fix: Image Download Browser Compatibility (#7950)
* fix: Add null check for SelectedTTS in MessageAudio component to prevent rendering issues * fix: image download browser compatibility with error handling and fallback mechanism - Updated the downloadImage function to use fetch for improved reliability and added error handling. - Implemented a fallback to the original download method in case of fetch failure. - Ensured the download link uses a blob URL for better compatibility with various image types.
This commit is contained in:
@@ -46,13 +46,33 @@ const Image = ({
|
||||
[placeholderDimensions, height, width],
|
||||
);
|
||||
|
||||
const downloadImage = () => {
|
||||
const link = document.createElement('a');
|
||||
link.href = imagePath;
|
||||
link.download = altText;
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
const downloadImage = async () => {
|
||||
try {
|
||||
const response = await fetch(imagePath);
|
||||
if (!response.ok) {
|
||||
throw new Error(`Failed to fetch image: ${response.status}`);
|
||||
}
|
||||
|
||||
const blob = await response.blob();
|
||||
const url = window.URL.createObjectURL(blob);
|
||||
|
||||
const link = document.createElement('a');
|
||||
link.href = url;
|
||||
link.download = altText || 'image.png';
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
|
||||
window.URL.revokeObjectURL(url);
|
||||
} catch (error) {
|
||||
console.error('Download failed:', error);
|
||||
const link = document.createElement('a');
|
||||
link.href = imagePath;
|
||||
link.download = altText || 'image.png';
|
||||
document.body.appendChild(link);
|
||||
link.click();
|
||||
document.body.removeChild(link);
|
||||
}
|
||||
};
|
||||
|
||||
return (
|
||||
|
||||
@@ -14,6 +14,9 @@ function MessageAudio(props: TMessageAudio) {
|
||||
};
|
||||
|
||||
const SelectedTTS = TTSComponents[engineTTS];
|
||||
if (!SelectedTTS) {
|
||||
return null;
|
||||
}
|
||||
return <SelectedTTS {...props} />;
|
||||
}
|
||||
|
||||
|
||||
Reference in New Issue
Block a user