improve test result views

n8n-io · Apr 14, 2023 · 73d5ecc · 73d5ecc
1 parent 49d838f
commit 73d5ecc
Show file tree

Hide file tree

Showing 4 changed files with 101 additions and 14 deletions.
diff --git a/packages/cli/src/sso/saml/routes/saml.controller.ee.ts b/packages/cli/src/sso/saml/routes/saml.controller.ee.ts
@@ -21,6 +21,8 @@ import {
 	getServiceProviderEntityId,
 	getServiceProviderReturnUrl,
 } from '../serviceProvider.ee';
+import { getSamlConnectionTestSuccessView } from '../views/samlConnectionTestSuccess';
+import { getSamlConnectionTestFailedView } from '../views/samlConnectionTestFailed';
 
 @RestController('/sso/saml')
 export class SamlController {
@@ -106,11 +108,15 @@ export class SamlController {
 		res: express.Response,
 		binding: SamlLoginBinding,
 	) {
-		const loginResult = await this.samlService.handleSamlLogin(req, binding);
-		if (loginResult) {
-			// return attributes if this is a test connection
+		try {
+			const loginResult = await this.samlService.handleSamlLogin(req, binding);
+			// if RelayState is set to the test connection Url, this is a test connection
 			if (req.body.RelayState && req.body.RelayState === getServiceProviderConfigTestReturnUrl()) {
-				return res.status(202).send(loginResult.attributes);
+				if (loginResult.authenticatedUser) {
+					return res.send(getSamlConnectionTestSuccessView(loginResult.attributes));
+				} else {
+					return res.send(getSamlConnectionTestFailedView('', loginResult.attributes));
+				}
 			}
 			if (loginResult.authenticatedUser) {
 				// Only sign in user if SAML is enabled, otherwise treat as test connection
@@ -125,8 +131,13 @@ export class SamlController {
 					return res.status(202).send(loginResult.attributes);
 				}
 			}
+			throw new AuthError('SAML Authentication failed');
+		} catch (err) {
+			if (req.body.RelayState && req.body.RelayState === getServiceProviderConfigTestReturnUrl()) {
+				return res.send(getSamlConnectionTestFailedView(err.message));
+			}
+			throw new AuthError('SAML Authentication failed: ' + err.message);
 		}
-		throw new AuthError('SAML Authentication failed');
 	}
 
 	/**

diff --git a/packages/cli/src/sso/saml/saml.service.ee.ts b/packages/cli/src/sso/saml/saml.service.ee.ts
@@ -139,14 +139,11 @@ export class SamlService {
 	async handleSamlLogin(
 		req: express.Request,
 		binding: SamlLoginBinding,
-	): Promise<
-		| {
-				authenticatedUser: User | undefined;
-				attributes: SamlUserAttributes;
-				onboardingRequired: boolean;
-		  }
-		| undefined
-	> {
+	): Promise<{
+		authenticatedUser: User | undefined;
+		attributes: SamlUserAttributes;
+		onboardingRequired: boolean;
+	}> {
 		const attributes = await this.getAttributesFromLoginResponse(req, binding);
 		if (attributes.email) {
 			const user = await Db.collections.User.findOne({
@@ -187,7 +184,11 @@ export class SamlService {
 				}
 			}
 		}
-		return undefined;
+		return {
+			authenticatedUser: undefined,
+			attributes,
+			onboardingRequired: false,
+		};
 	}
 
 	async setSamlPreferences(prefs: SamlPreferences): Promise<SamlPreferences | undefined> {

diff --git a/packages/cli/src/sso/saml/views/samlConnectionTestFailed.ts b/packages/cli/src/sso/saml/views/samlConnectionTestFailed.ts
@@ -0,0 +1,42 @@
+import { SamlUserAttributes } from '../types/samlUserAttributes';
+
+export function getSamlConnectionTestFailedView(
+	message: string,
+	attributes?: SamlUserAttributes,
+): string {
+	return `
+    <http>
+    <head>
+    <title>n8n - SAML Connection Test Result</title>
+    <style>
+        body { background: rgb(251,252,254); font-family: 'Open Sans', sans-serif; padding: 10px; margin: auto; width: 500px; top: 40%; position: relative; }
+        h1 { color: rgb(240, 60, 60); font-size: 16px; font-weight: 400; margin: 0 0 10px 0; }
+        h2 { color: rgb(0, 0, 0); font-size: 12px; font-weight: 400; margin: 0 0 10px 0; }
+        button { border: 1px solid rgb(219, 223, 231); background: rgb(255, 255, 255); border-radius: 4px; padding: 10px; }
+        ul { border: 1px solid rgb(219, 223, 231); border-radius: 4px; padding: 10px; }
+        li { decoration: none; list-style: none; margin: 0 0 0px 0; color: rgb(125, 125, 125); font-size: 12px;}
+    </style>
+    </head>
+    <body>
+    <div style="text-align:center">
+    <h1>SAML Connection Test failed</h1>
+    <h2>${message ?? 'A common issue could be that no email attribute is set'}</h2>
+    <button onclick="window.close()">You can close this window now</button>
+    <p></p>
+    ${
+			attributes
+				? `
+        <h2>Here are the attributes returned by your SAML IdP:</h2>
+        <ul>
+        <li><strong>Email:</strong> ${attributes?.email ?? '(n/a)'}</li>
+        <li><strong>First Name:</strong> ${attributes?.firstName ?? '(n/a)'}</li>
+        <li><strong>Last Name:</strong> ${attributes?.lastName ?? '(n/a)'}</li>
+        <li><strong>UPN:</strong> ${attributes?.userPrincipalName ?? '(n/a)'}</li>
+        </ul>`
+				: ''
+		}
+    </div>
+    </body>
+    </http>
+	`;
+}
diff --git a/packages/cli/src/sso/saml/views/samlConnectionTestSuccess.ts b/packages/cli/src/sso/saml/views/samlConnectionTestSuccess.ts
@@ -0,0 +1,33 @@
+import { SamlUserAttributes } from '../types/samlUserAttributes';
+
+export function getSamlConnectionTestSuccessView(attributes: SamlUserAttributes): string {
+	return `
+    <http>
+    <head>
+    <title>n8n - SAML Connection Test Result</title>
+    <style>
+        body { background: rgb(251,252,254); font-family: 'Open Sans', sans-serif; padding: 10px; margin: auto; width: 500px; top: 40%; position: relative; }
+        h1 { color: rgb(0, 0, 0); font-size: 16px; font-weight: 400; margin: 0 0 10px 0; }
+        h2 { color: rgb(0, 0, 0); font-size: 12px; font-weight: 400; margin: 0 0 10px 0; }
+        button { border: 1px solid rgb(219, 223, 231); background: rgb(255, 255, 255); border-radius: 4px; padding: 10px; }
+        ul { border: 1px solid rgb(219, 223, 231); border-radius: 4px; padding: 10px; }
+        li { decoration: none; list-style: none; margin: 0 0 0px 0; color: rgb(125, 125, 125); font-size: 12px;}
+    </style>
+    </head>
+    <body>
+    <div style="text-align:center">
+    <h1>SAML Connection Test was successful</h1>
+    <button onclick="window.close()">You can close this window now</button>
+    <p></p>
+    <h2>Here are the attributes returned by your SAML IdP:</h2>
+    <ul>
+    <li><strong>Email:</strong> ${attributes.email ?? '(n/a)'}</li>
+    <li><strong>First Name:</strong> ${attributes.firstName ?? '(n/a)'}</li>
+    <li><strong>Last Name:</strong> ${attributes.lastName ?? '(n/a)'}</li>
+    <li><strong>UPN:</strong> ${attributes.userPrincipalName ?? '(n/a)'}</li>
+    </ul>
+    </div>
+    </body>
+    </http>
+	`;
+}