Feat/add headers to custom mcp (#4581)

* add headers to custom mcp

* Refactor MCP fetch method and update CustomMCP documentation to include variable usage in headers

packages/components/nodes/tools/MCP/CustomMCP/CustomMCP.ts

@@ -27,6 +27,16 @@ For example, you have a variable called "var1":
     }
 }
 \`\`\`
+
+For example, when using SSE, you can use the variable "var1" in the headers:
+\`\`\`json
+{
+    "url": "https://api.example.com/endpoint/sse",
+    "headers": {
+        "Authorization": "Bearer {{$vars.var1}}"
+    }
+}
+\`\`\`
 `
 
 class Custom_MCP implements INode {

packages/components/nodes/tools/MCP/core.ts

@@ -53,10 +53,29 @@ export class MCPToolkit extends BaseToolkit {
 
             const baseUrl = new URL(this.serverParams.url)
             try {
-                transport = new StreamableHTTPClientTransport(baseUrl)
+                if (this.serverParams.headers) {
+                    transport = new StreamableHTTPClientTransport(baseUrl, {
+                        requestInit: {
+                            headers: this.serverParams.headers
+                        }
+                    })
+                } else {
+                    transport = new StreamableHTTPClientTransport(baseUrl)
+                }
                 await client.connect(transport)
             } catch (error) {
-                transport = new SSEClientTransport(baseUrl)
+                if (this.serverParams.headers) {
+                    transport = new SSEClientTransport(baseUrl, {
+                        requestInit: {
+                            headers: this.serverParams.headers
+                        },
+                        eventSourceInit: {
+                            fetch: (url, init) => fetch(url, { ...init, headers: this.serverParams.headers })
+                        }
+                    })
+                } else {
+                    transport = new SSEClientTransport(baseUrl)
+                }
                 await client.connect(transport)
             }
         }