diff --git a/web/app/components/workflow/nodes/http/components/edit-body/index.tsx b/web/app/components/workflow/nodes/http/components/edit-body/index.tsx
index 645bcdcdf9..0417c408cc 100644
--- a/web/app/components/workflow/nodes/http/components/edit-body/index.tsx
+++ b/web/app/components/workflow/nodes/http/components/edit-body/index.tsx
@@ -23,15 +23,17 @@ const allTypes = [
   BodyType.none,
   BodyType.formData,
   BodyType.xWwwFormUrlencoded,
-  BodyType.rawText,
   BodyType.json,
+  BodyType.rawText,
+  BodyType.binary,
 ]
 const bodyTextMap = {
   [BodyType.none]: 'none',
   [BodyType.formData]: 'form-data',
   [BodyType.xWwwFormUrlencoded]: 'x-www-form-urlencoded',
-  [BodyType.rawText]: 'raw text',
+  [BodyType.rawText]: 'raw',
   [BodyType.json]: 'JSON',
+  [BodyType.binary]: 'binary',
 }
 
 const EditBody: FC<Props> = ({
@@ -125,6 +127,7 @@ const EditBody: FC<Props> = ({
             list={body}
             onChange={setBody}
             onAdd={addBody}
+            isSupportFile={type === BodyType.formData}
           />
         )}
 
diff --git a/web/app/components/workflow/nodes/http/components/key-value/index.tsx b/web/app/components/workflow/nodes/http/components/key-value/index.tsx
index 65fab16cac..b14f7d9dd1 100644
--- a/web/app/components/workflow/nodes/http/components/key-value/index.tsx
+++ b/web/app/components/workflow/nodes/http/components/key-value/index.tsx
@@ -10,6 +10,7 @@ type Props = {
   list: KeyValue[]
   onChange: (newList: KeyValue[]) => void
   onAdd: () => void
+  isSupportFile: boolean
   // toggleKeyValueEdit: () => void
 }
 
@@ -19,6 +20,7 @@ const KeyValueList: FC<Props> = ({
   list,
   onChange,
   onAdd,
+  isSupportFile,
   // toggleKeyValueEdit,
 }) => {
   // const handleBulkValueChange = useCallback((value: string) => {
@@ -48,6 +50,7 @@ const KeyValueList: FC<Props> = ({
     list={list}
     onChange={onChange}
     onAdd={onAdd}
+    isSupportFile={isSupportFile}
   // onSwitchToBulkEdit={toggleKeyValueEdit}
   />
   // : <BulkEdit
diff --git a/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/index.tsx b/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/index.tsx
index c95e020bbb..0802052768 100644
--- a/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/index.tsx
+++ b/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/index.tsx
@@ -16,6 +16,7 @@ type Props = {
   list: KeyValue[]
   onChange: (newList: KeyValue[]) => void
   onAdd: () => void
+  isSupportFile?: boolean
   // onSwitchToBulkEdit: () => void
 }
 
@@ -25,6 +26,7 @@ const KeyValueList: FC<Props> = ({
   list,
   onChange,
   onAdd,
+  isSupportFile,
   // onSwitchToBulkEdit,
 }) => {
   const { t } = useTranslation()
@@ -79,6 +81,7 @@ const KeyValueList: FC<Props> = ({
             onAdd={onAdd}
             readonly={readonly}
             canRemove={list.length > 1}
+            isSupportFile={isSupportFile}
           />
         ))
       }
diff --git a/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/input-item.tsx b/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/input-item.tsx
index 16b1674d54..b6c5b635c3 100644
--- a/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/input-item.tsx
+++ b/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/input-item.tsx
@@ -18,6 +18,7 @@ type Props = {
   onRemove?: () => void
   placeholder?: string
   readOnly?: boolean
+  isSupportFile?: boolean
 }
 
 const InputItem: FC<Props> = ({
@@ -30,6 +31,7 @@ const InputItem: FC<Props> = ({
   onRemove,
   placeholder,
   readOnly,
+  isSupportFile,
 }) => {
   const { t } = useTranslation()
 
@@ -39,7 +41,11 @@ const InputItem: FC<Props> = ({
   const { availableVars, availableNodesWithParent } = useAvailableVarList(nodeId, {
     onlyLeafNodeVar: false,
     filterVar: (varPayload: Var) => {
-      return [VarType.string, VarType.number, VarType.secret].includes(varPayload.type)
+      const supportVarTypes = [VarType.string, VarType.number, VarType.secret]
+      if (isSupportFile)
+        supportVarTypes.push(...[VarType.file, VarType.arrayFile])
+
+      return supportVarTypes.includes(varPayload.type)
     },
   })
 
diff --git a/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/item.tsx b/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/item.tsx
index 7839b94730..aa7a3d9bbe 100644
--- a/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/item.tsx
+++ b/web/app/components/workflow/nodes/http/components/key-value/key-value-edit/item.tsx
@@ -20,6 +20,7 @@ type Props = {
   onRemove: () => void
   isLastItem: boolean
   onAdd: () => void
+  isSupportFile?: boolean
 }
 
 const KeyValueItem: FC<Props> = ({
@@ -33,6 +34,7 @@ const KeyValueItem: FC<Props> = ({
   onRemove,
   isLastItem,
   onAdd,
+  isSupportFile,
 }) => {
   const { t } = useTranslation()
 
@@ -71,6 +73,7 @@ const KeyValueItem: FC<Props> = ({
           onRemove={onRemove}
           placeholder={t(`${i18nPrefix}.value`)!}
           readOnly={readonly}
+          isSupportFile={isSupportFile}
         />
       </div>
     </div>
diff --git a/web/app/components/workflow/nodes/http/types.ts b/web/app/components/workflow/nodes/http/types.ts
index 0383425a04..0495a74b95 100644
--- a/web/app/components/workflow/nodes/http/types.ts
+++ b/web/app/components/workflow/nodes/http/types.ts
@@ -15,6 +15,7 @@ export enum BodyType {
   xWwwFormUrlencoded = 'x-www-form-urlencoded',
   rawText = 'raw-text',
   json = 'json',
+  binary = 'binary',
 }
 
 export type KeyValue = {