diff --git a/web/app/i18n.ts b/web/app/i18n.ts
index a03216c55..b15332d35 100644
--- a/web/app/i18n.ts
+++ b/web/app/i18n.ts
@@ -2,6 +2,8 @@ import i18n from 'i18next';
 import { initReactI18next } from 'react-i18next';
 
 const en = {
+  UploadDataSuccessfully: 'file uploaded successfully',
+  UploadDataFailed: 'file upload failed',
   UploadData: 'Upload Data',
   CodeEditor: 'Code Editor:',
   openCodeEditor:'Open Code Editor',
@@ -237,6 +239,8 @@ export interface Resources {
 }
 
 const zh: Resources['translation'] = {
+  UploadDataSuccessfully: '文件上传成功',
+  UploadDataFailed: '文件上传失败',
   UploadData: '上传数据',
   CodeEditor: '代码编辑:',
   openCodeEditor: '打开代码编辑器',
diff --git a/web/components/flow/node-renderer/upload.tsx b/web/components/flow/node-renderer/upload.tsx
index 9f2944af7..35da07eb4 100644
--- a/web/components/flow/node-renderer/upload.tsx
+++ b/web/components/flow/node-renderer/upload.tsx
@@ -1,37 +1,72 @@
-import React from 'react';
+import React, { useState, useRef } from 'react';
 import { UploadOutlined } from '@ant-design/icons';
 import type { UploadProps } from 'antd';
-import { Button, Upload } from 'antd';
+import { Button, Upload, message } from 'antd';
 import { convertKeysToCamelCase } from '@/utils/flow';
 import { IFlowNodeParameter } from '@/types/flow';
 import { useTranslation } from 'react-i18next';
 
-const props: UploadProps = {
-  name: 'file',
-  action: 'https://660d2bd96ddfa2943b33731c.mockapi.io/api/upload',
-  headers: {
-    authorization: 'authorization-text',
-  },
-};
-
 type Props = {
   data: IFlowNodeParameter;
   defaultValue: any;
   onChange: (value: any) => void;
 };
-
 export const RenderUpload = (params: Props) => {
   const { t } = useTranslation();
-
+  const urlList = useRef<string[]>([]);
   const { data, defaultValue, onChange } = params;
 
   const attr = convertKeysToCamelCase(data.ui?.attr || {});
+  const [uploading, setUploading] = useState(false);
+  const [uploadType, setUploadType] = useState('');
 
+  const getUploadSuccessUrl = (url: string) => {
+    if (urlList.current.length === data.ui.attr.max_count) {
+      urlList.current.pop();
+    }
+    urlList.current.push(url)
+
+    onChange(urlList.current.toString())
+  }
+  const handleFileRemove = (file: any) => {
+    const index = urlList.current.indexOf(file.response.data[0].uri);
+    if (index !== -1) {
+      urlList.current.splice(index, 1);
+    }
+    onChange(urlList.current.toString())
+  }
+  const props: UploadProps = {
+    name: 'files',
+    action: process.env.API_BASE_URL + data.ui.action,
+    headers: {
+      'authorization': 'authorization-text',
+    },
+    onChange(info) {
+      setUploading(true)
+      if (info.file.status !== 'uploading') {
+      }
+      if (info.file.status === 'done') {
+        setUploading(false)
+        message.success(`${info.file.response.data[0].file_name} ${t('UploadDataSuccessfully')}`);
+        getUploadSuccessUrl(info.file.response.data[0].uri)
+      } else if (info.file.status === 'error') {
+        setUploading(false)
+        message.error(`${info.file.response.data[0].file_name}  ${t('UploadDataFailed')}`);
+      }
+    },
+  };
+
+  if (data.ui?.file_types && Array.isArray(data.ui?.file_types)) {
+    setUploadType(data.ui?.file_types.toString())
+  }
   return (
     <div className="p-2 text-sm text-center">
-      <Upload {...attr}   {...props}>
-        <Button icon={<UploadOutlined />}>{t('UploadData')}</Button>
-      </Upload>
+      {data.is_list ? <Upload onRemove={handleFileRemove}   {...props} {...attr} multiple={true} accept={uploadType}>
+        <Button loading={uploading} icon={<UploadOutlined />}>{t('UploadData')}</Button>
+      </Upload> : <Upload onRemove={handleFileRemove}  {...props} {...attr} multiple={false} accept={uploadType}>
+        <Button loading={uploading} icon={<UploadOutlined />}>{t('UploadData')}</Button>
+      </Upload>}
+
     </div>
   )
 
diff --git a/web/types/flow.ts b/web/types/flow.ts
index ed497c018..e45a846f4 100644
--- a/web/types/flow.ts
+++ b/web/types/flow.ts
@@ -71,6 +71,8 @@ export type IFlowNodeParameter = {
 export type IFlowNodeParameterUI = {
   ui_type: string;
   language: string;
+  file_types: string;
+  action: string;
   attr: {
     disabled: boolean;
     [key: string]: any;