AI/ragflow
1
0
Fork 0
mirror of https://git.mirrors.martin98.com/https://github.com/infiniflow/ragflow.git synced 2025-08-15 18:05:57 +08:00
Code Issues Packages Projects Releases Wiki Activity

Feat: Support preview of HTML files #5096 (#5134)

Browse Source 
### What problem does this PR solve?

Feat: Support preview of HTML files #5096
### Type of change


- [x] New Feature (non-breaking change which adds functionality)
This commit is contained in:
balibabu 2025-02-19 16:28:48 +08:00 committed by GitHub
parent 38e551cc3d
commit 24efa86f26
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 25 additions and 45 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

6
web/src/pages/document-viewer/index.tsx
View File

@ -6,6 +6,7 @@ import Docx from './docx';
import Excel from './excel';
import Pdf from './pdf';
import { previewHtmlFile } from '@/utils/file-util';
import styles from './index.less';
// TODO: The interface returns an incorrect content-type for the SVG.
@ -17,6 +18,11 @@ const DocumentViewer = () => {
const prefix = currentQueryParameters.get('prefix');
const api = `${api_host}/${prefix || 'file'}/get/${documentId}`;
if (ext === 'html' && documentId) {
previewHtmlFile(documentId);
return;
}
return (
<section className={styles.viewerWrapper}>
{Images.includes(ext!) && (

43
web/src/services/file-manager-service.ts
View File

@ -1,7 +1,6 @@
import api from '@/utils/api';
import registerServer from '@/utils/register-server';
import request from '@/utils/request';
import pureRequest from 'axios';
const {
listFile,
@ -67,45 +66,3 @@ const fileManagerService = registerServer<keyof typeof methods>(
);
export default fileManagerService;
export const getDocumentFile = (documentId: string) => {
return pureRequest(getFile + '/' + documentId, {
responseType: 'blob',
method: 'get',
// headers: {
// 'content-type':
// 'text/plain;charset=UTF-8, application/vnd.openxmlformats-officeddocument.spreadsheetml.sheet;charset=UTF-8',
// },
// parseResponse: false,
// getResponse: true,
})
.then((res) => {
const x = res?.headers?.get('content-disposition');
const y = res?.headers?.get('Content-Type');
console.info(res);
console.info(x);
console.info('Content-Type', y);
return res;
})
.then((res) => {
// const objectURL = URL.createObjectURL(res);
// let btn = document.createElement('a');
// btn.download = '文件名.pdf';
// btn.href = objectURL;
// btn.click();
// URL.revokeObjectURL(objectURL);
// btn = null;
return res;
})
.catch((err) => {
console.info(err);
});
};

21
web/src/utils/file-util.ts
View File

@ -98,6 +98,24 @@ export const getBase64FromUploadFileList = async (fileList?: UploadFile[]) => {
return '';
};
async function fetchDocumentBlob(id: string, mimeType?: FileMimeType) {
const response = await fileManagerService.getDocumentFile({}, id);
const blob = new Blob([response.data], {
type: mimeType || response.data.type,
});
return blob;
}
export async function previewHtmlFile(id: string) {
const blob = await fetchDocumentBlob(id, FileMimeType.Html);
const url = URL.createObjectURL(blob);
const link = document.createElement('a');
link.href = url;
link.click();
URL.revokeObjectURL(url);
}
export const downloadFileFromBlob = (blob: Blob, name?: string) => {
const url = window.URL.createObjectURL(blob);
const a = document.createElement('a');
@ -116,8 +134,7 @@ export const downloadDocument = async ({
id: string;
filename?: string;
}) => {
const response = await fileManagerService.getDocumentFile({}, id);
const blob = new Blob([response.data], { type: response.data.type });
const blob = await fetchDocumentBlob(id);
downloadFileFromBlob(blob, filename);
};