mirror of
https://git.mirrors.martin98.com/https://github.com/infiniflow/ragflow.git
synced 2025-08-15 12:45:53 +08:00
Fix: image file can't preview (#5626)
### What problem does this PR solve?  the preview botton of image not work for me. request url: `http://127.0.0.1:9222/document/af570920f80e11efb8e967fd67f0d8c7?ext=jpg&prefix=file` response: `{"code":401,"data":null,"message":"<Unauthorized '401: Unauthorized'>"}` ### Type of change - [x] Bug Fix (non-breaking change which fixes an issue)
This commit is contained in:
parent
148a7e7002
commit
47684fa17c
43
web/src/pages/document-viewer/image/index.tsx
Normal file
43
web/src/pages/document-viewer/image/index.tsx
Normal file
@ -0,0 +1,43 @@
|
|||||||
|
import { Image as AntImage } from 'antd';
|
||||||
|
import { useEffect, useState } from 'react';
|
||||||
|
|
||||||
|
import { Authorization } from '@/constants/authorization';
|
||||||
|
import { getAuthorization } from '@/utils/authorization-util';
|
||||||
|
|
||||||
|
interface ImageProps {
|
||||||
|
src: string;
|
||||||
|
preview?: boolean;
|
||||||
|
}
|
||||||
|
|
||||||
|
const Image = ({ src, preview = false }: ImageProps) => {
|
||||||
|
const [imageSrc, setImageSrc] = useState<string>('');
|
||||||
|
|
||||||
|
useEffect(() => {
|
||||||
|
const loadImage = async () => {
|
||||||
|
try {
|
||||||
|
const response = await fetch(src, {
|
||||||
|
headers: {
|
||||||
|
[Authorization]: getAuthorization(),
|
||||||
|
},
|
||||||
|
});
|
||||||
|
const blob = await response.blob();
|
||||||
|
const objectUrl = URL.createObjectURL(blob);
|
||||||
|
setImageSrc(objectUrl);
|
||||||
|
} catch (error) {
|
||||||
|
console.error('Failed to load image:', error);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
|
||||||
|
loadImage();
|
||||||
|
|
||||||
|
return () => {
|
||||||
|
if (imageSrc) {
|
||||||
|
URL.revokeObjectURL(imageSrc);
|
||||||
|
}
|
||||||
|
};
|
||||||
|
}, [src]);
|
||||||
|
|
||||||
|
return imageSrc ? <AntImage src={imageSrc} preview={preview} /> : null;
|
||||||
|
};
|
||||||
|
|
||||||
|
export default Image;
|
@ -1,9 +1,10 @@
|
|||||||
import { Images } from '@/constants/common';
|
import { Images } from '@/constants/common';
|
||||||
import { api_host } from '@/utils/api';
|
import { api_host } from '@/utils/api';
|
||||||
import { Flex, Image } from 'antd';
|
import { Flex } from 'antd';
|
||||||
import { useParams, useSearchParams } from 'umi';
|
import { useParams, useSearchParams } from 'umi';
|
||||||
import Docx from './docx';
|
import Docx from './docx';
|
||||||
import Excel from './excel';
|
import Excel from './excel';
|
||||||
|
import Image from './image';
|
||||||
import Pdf from './pdf';
|
import Pdf from './pdf';
|
||||||
|
|
||||||
import { previewHtmlFile } from '@/utils/file-util';
|
import { previewHtmlFile } from '@/utils/file-util';
|
||||||
|
Loading…
x
Reference in New Issue
Block a user