feat(webhook): add API key support for webhook notifications

docs/using-jellyseerr/notifications/webhook.md

@@ -22,6 +22,14 @@ This is typically not needed. Please refer to your webhook provider's documentat
 
 This value will be sent as an `Authorization` HTTP header.
 
+### API Key (optional)
+
+:::info
+Uses the `X-API-Key` header, a de facto standard for webhook authentication.
+:::
+
+This value will be sent as an `X-API-Key` HTTP header.
+
 ### JSON Payload
 
 Customize the JSON payload to suit your needs. Jellyseerr provides several [template variables](#template-variables) for use in the payload, which will be replaced with the relevant data when the notifications are triggered.

jellyseerr-api.yml

@@ -1449,6 +1449,8 @@ components:
               type: string
             authHeader:
               type: string
+            apiKey:
+              type: string
             jsonPayload:
               type: string
             supportVariables:

server/lib/notifications/agents/webhook.ts

@@ -196,16 +196,19 @@ class WebhookAgent
     }
 
     try {
+      const headers: Record<string, string> = {};
+
+      if (settings.options.authHeader) {
+        headers.Authorization = settings.options.authHeader;
+      }
+      if (settings.options.apiKey) {
+        headers['X-API-Key'] = settings.options.apiKey;
+      }
+
       await axios.post(
         webhookUrl,
         this.buildPayload(type, payload),
-        settings.options.authHeader
-          ? {
-              headers: {
-                Authorization: settings.options.authHeader,
-              },
-            }
-          : undefined
+        Object.keys(headers).length > 0 ? { headers } : undefined
       );
 
       return true;

server/lib/settings/index.ts

@@ -275,6 +275,7 @@ export interface NotificationAgentWebhook extends NotificationAgentConfig {
     webhookUrl: string;
     jsonPayload: string;
     authHeader?: string;
+    apiKey?: string;
     supportVariables?: boolean;
   };
 }

server/routes/settings/notifications.ts

@@ -301,6 +301,7 @@ notificationRoutes.post('/webhook', async (req, res, next) => {
         ),
         webhookUrl: req.body.options.webhookUrl,
         authHeader: req.body.options.authHeader,
+        apiKey: req.body.options.apiKey,
         supportVariables: req.body.options.supportVariables ?? false,
       },
     };
@@ -333,6 +334,7 @@ notificationRoutes.post('/webhook/test', async (req, res, next) => {
         ),
         webhookUrl: req.body.options.webhookUrl,
         authHeader: req.body.options.authHeader,
+        apiKey: req.body.options.apiKey,
         supportVariables: req.body.options.supportVariables ?? false,
       },
     };

src/components/Settings/Notifications/NotificationsWebhook/index.tsx

@@ -80,6 +80,8 @@ const messages = defineMessages(
     supportVariablesTip:
       'Available variables are documented in the webhook template variables section',
     authheader: 'Authorization Header',
+    apikey: 'API Key',
+    apikeyTip: 'API key will be sent as X-API-Key header',
     validationJsonPayloadRequired: 'You must provide a valid JSON payload',
     webhooksettingssaved: 'Webhook notification settings saved successfully!',
     webhooksettingsfailed: 'Webhook notification settings failed to save.',
@@ -159,6 +161,7 @@ const NotificationsWebhook = () => {
         webhookUrl: data.options.webhookUrl,
         jsonPayload: data.options.jsonPayload,
         authHeader: data.options.authHeader,
+        apiKey: data.options.apiKey,
         supportVariables: data.options.supportVariables ?? false,
       }}
       validationSchema={NotificationsWebhookSchema}
@@ -171,6 +174,7 @@ const NotificationsWebhook = () => {
               webhookUrl: values.webhookUrl,
               jsonPayload: JSON.stringify(values.jsonPayload),
               authHeader: values.authHeader,
+              apiKey: values.apiKey,
               supportVariables: values.supportVariables,
             },
           });
@@ -229,6 +233,7 @@ const NotificationsWebhook = () => {
                 webhookUrl: values.webhookUrl,
                 jsonPayload: JSON.stringify(values.jsonPayload),
                 authHeader: values.authHeader,
+                apiKey: values.apiKey,
                 supportVariables: values.supportVariables ?? false,
               },
             });
@@ -344,6 +349,19 @@ const NotificationsWebhook = () => {
                 </div>
               </div>
             </div>
+            <div className="form-row">
+              <label htmlFor="apiKey" className="text-label">
+                {intl.formatMessage(messages.apikey)}
+                <div className="label-tip">
+                  {intl.formatMessage(messages.apikeyTip)}
+                </div>
+              </label>
+              <div className="form-input-area">
+                <div className="form-input-field">
+                  <Field id="apiKey" name="apiKey" type="text" />
+                </div>
+              </div>
+            </div>
             <div className="form-row">
               <label htmlFor="webhook-json-payload" className="text-label">
                 {intl.formatMessage(messages.customJson)}

src/i18n/locale/en.json

@@ -680,6 +680,8 @@
   "components.Settings.Notifications.NotificationsSlack.webhookUrl": "Webhook URL",
   "components.Settings.Notifications.NotificationsSlack.webhookUrlTip": "Create an <WebhookLink>Incoming Webhook</WebhookLink> integration",
   "components.Settings.Notifications.NotificationsWebhook.agentenabled": "Enable Agent",
+  "components.Settings.Notifications.NotificationsWebhook.apikey": "API Key",
+  "components.Settings.Notifications.NotificationsWebhook.apikeyTip": "API key will be sent as X-API-Key header",
   "components.Settings.Notifications.NotificationsWebhook.authheader": "Authorization Header",
   "components.Settings.Notifications.NotificationsWebhook.customJson": "JSON Payload",
   "components.Settings.Notifications.NotificationsWebhook.resetPayload": "Reset to Default",