Mirrors/open-webui
1
0
Fork 0
mirror of https://github.com/open-webui/open-webui.git synced 2025-12-16 20:07:49 +01:00
Code Issues Packages Projects Releases Wiki Activity

💄 Limit the size and number of uploaded files

Browse Source 
💄 Limit the size and number of uploaded files
This commit is contained in:
Clivia
2024-08-02 21:36:17 +08:00
parent 7fa9f381e1
commit b6da4baa97
43 changed files with 298 additions and 49 deletions
Download Patch File Download Diff File Expand all files Collapse all files

136
src/lib/components/chat/MessageInput.svelte
View File

@@ -15,8 +15,16 @@
user as _user
} from '$lib/stores';
import { blobToFile, findWordIndices } from '$lib/utils';
import { processDocToVectorDB } from '$lib/apis/rag';
import { transcribeAudio } from '$lib/apis/audio';
import {
getQuerySettings,
processDocToVectorDB,
uploadDocToVectorDB,
uploadWebToVectorDB,
uploadYoutubeTranscriptionToVectorDB
} from '$lib/apis/rag';
import { uploadFile } from '$lib/apis/files';
import {
SUPPORTED_FILE_TYPE,
@@ -54,6 +62,7 @@
let commandsElement;
let inputFiles;
let querySettings;
let dragged = false;
let user = null;
@@ -169,7 +178,67 @@
}
};
const processFileCountLimit = async (querySettings, inputFiles) => {
const maxFiles = querySettings.max_file_count;
const currentFilesCount = files.length;
const inputFilesCount = inputFiles.length;
const totalFilesCount = currentFilesCount + inputFilesCount;
if (currentFilesCount >= maxFiles || totalFilesCount > maxFiles) {
toast.error(
$i18n.t('File count exceeds the limit of {{size}}', {
count: maxFiles
})
);
if (currentFilesCount >= maxFiles) {
return [false, null];
}
if (totalFilesCount > maxFiles) {
inputFiles = inputFiles.slice(0, maxFiles - currentFilesCount);
}
}
return [true, inputFiles];
};
const processFileSizeLimit = async (querySettings, file) => {
if (file.size <= querySettings.max_file_size * 1024 * 1024) {
if (['image/gif', 'image/webp', 'image/jpeg', 'image/png'].includes(file['type'])) {
if (visionCapableModels.length === 0) {
toast.error($i18n.t('Selected model(s) do not support image inputs'));
return;
}
let reader = new FileReader();
reader.onload = (event) => {
files = [
...files,
{
type: 'image',
url: `${event.target.result}`
}
];
};
reader.readAsDataURL(file);
} else {
uploadFileHandler(file);
}
} else {
toast.error(
$i18n.t('File size exceeds the limit of {{size}}MB', {
size: querySettings.max_file_size
})
);
}
};
onMount(() => {
const initializeSettings = async () => {
try {
querySettings = await getQuerySettings(localStorage.token);
} catch (error) {
console.error('Error fetching query settings:', error);
}
};
initializeSettings();
window.setTimeout(() => chatTextAreaElement?.focus(), 0);
const dropZone = document.querySelector('body');
@@ -198,27 +267,19 @@
const inputFiles = Array.from(e.dataTransfer?.files);
if (inputFiles && inputFiles.length > 0) {
inputFiles.forEach((file) => {
console.log(inputFiles);
const [canProcess, filesToProcess] = await processFileCountLimit(
querySettings,
inputFiles
);
if (!canProcess) {
dragged = false;
return;
}
console.log(filesToProcess);
filesToProcess.forEach((file) => {
console.log(file, file.name.split('.').at(-1));
if (['image/gif', 'image/webp', 'image/jpeg', 'image/png'].includes(file['type'])) {
if (visionCapableModels.length === 0) {
toast.error($i18n.t('Selected model(s) do not support image inputs'));
return;
}
let reader = new FileReader();
reader.onload = (event) => {
files = [
...files,
{
type: 'image',
url: `${event.target.result}`
}
];
};
reader.readAsDataURL(file);
} else {
uploadFileHandler(file);
}
processFileSizeLimit(querySettings, file);
});
} else {
toast.error($i18n.t(`File not found.`));
@@ -341,26 +402,19 @@
on:change={async () => {
if (inputFiles && inputFiles.length > 0) {
const _inputFiles = Array.from(inputFiles);
_inputFiles.forEach((file) => {
if (['image/gif', 'image/webp', 'image/jpeg', 'image/png'].includes(file['type'])) {
if (visionCapableModels.length === 0) {
toast.error($i18n.t('Selected model(s) do not support image inputs'));
return;
}
let reader = new FileReader();
reader.onload = (event) => {
files = [
...files,
{
type: 'image',
url: `${event.target.result}`
}
];
};
reader.readAsDataURL(file);
} else {
uploadFileHandler(file);
}
console.log(_inputFiles);
const [canProcess, filesToProcess] = await processFileCountLimit(
querySettings,
_inputFiles
);
if (!canProcess) {
filesInputElement.value = '';
return;
}
console.log(filesToProcess);
filesToProcess.forEach((file) => {
console.log(file, file.name.split('.').at(-1));
processFileSizeLimit(querySettings, file);
});
} else {
toast.error($i18n.t(`File not found.`));