diff --git a/web/app/components/workflow/nodes/trigger-webhook/use-config.ts b/web/app/components/workflow/nodes/trigger-webhook/use-config.ts
index f22b596dd8..e754d563f3 100644
--- a/web/app/components/workflow/nodes/trigger-webhook/use-config.ts
+++ b/web/app/components/workflow/nodes/trigger-webhook/use-config.ts
@@ -27,9 +27,25 @@ const useConfig = (id: string, payload: WebhookTriggerNodeType) => {
 
   const handleContentTypeChange = useCallback((contentType: string) => {
     setInputs(produce(inputs, (draft) => {
+      const previousContentType = draft.content_type
       draft.content_type = contentType
+
+      // If the content type changes, reset body parameters and their variables, as the variable types might differ.
+      // However, we could consider retaining variables that are compatible with the new content type later.
+      if (previousContentType !== contentType) {
+        draft.body = []
+        if (draft.variables) {
+          const bodyVariables = draft.variables.filter(v => v.label === 'body')
+          bodyVariables.forEach((v) => {
+            if (isVarUsedInNodes([id, v.variable]))
+              removeUsedVarInNodes([id, v.variable])
+          })
+
+          draft.variables = draft.variables.filter(v => v.label !== 'body')
+        }
+      }
     }))
-  }, [inputs, setInputs])
+  }, [inputs, setInputs, id, isVarUsedInNodes, removeUsedVarInNodes])
 
   const syncVariablesInDraft = useCallback((
     draft: WebhookTriggerNodeType,