feat(core): Return OAuth2 error body if available (#5794)

Co-authored-by: कारतोफ्फेलस्क्रिप्ट™ <aditya@netroy.in>
n8n-io · May 16, 2023 · 79d0a0f · 79d0a0f
1 parent b4fd9ba
commit 79d0a0f
Show file tree

Hide file tree

Showing 2 changed files with 20 additions and 12 deletions.
diff --git a/packages/cli/src/credentials/oauth2Credential.api.ts b/packages/cli/src/credentials/oauth2Credential.api.ts
@@ -12,7 +12,7 @@ import type {
 	INodeCredentialsDetails,
 	ICredentialsEncrypted,
 } from 'n8n-workflow';
-import { LoggerProxy } from 'n8n-workflow';
+import { LoggerProxy, jsonStringify } from 'n8n-workflow';
 import { resolve as pathResolve } from 'path';
 
 import * as Db from '@/Db';
@@ -173,8 +173,8 @@ oauth2CredentialController.get(
 	}),
 );
 
-const renderCallbackError = (res: express.Response, errorMessage: string) =>
-	res.render('oauth-error-callback', { error: { message: errorMessage } });
+const renderCallbackError = (res: express.Response, message: string, reason?: string) =>
+	res.render('oauth-error-callback', { error: { message, reason } });
 
 /**
  * GET /oauth2-credential/callback
@@ -192,9 +192,8 @@ oauth2CredentialController.get(
 			if (!code || !stateEncoded) {
 				return renderCallbackError(
 					res,
-					`Insufficient parameters for OAuth2 callback. Received following query parameters: ${JSON.stringify(
-						req.query,
-					)}`,
+					'Insufficient parameters for OAuth2 callback.',
+					`Received following query parameters: ${JSON.stringify(req.query)}`,
 				);
 			}
 
@@ -326,7 +325,12 @@ oauth2CredentialController.get(
 
 			return res.sendFile(pathResolve(TEMPLATES_DIR, 'oauth-callback.html'));
 		} catch (error) {
-			return renderCallbackError(res, (error as Error).message);
+			return renderCallbackError(
+				res,
+				(error as Error).message,
+				// eslint-disable-next-line @typescript-eslint/no-unsafe-member-access
+				'body' in error ? jsonStringify(error.body) : undefined,
+			);
 		}
 	},
 );
diff --git a/packages/cli/templates/oauth-error-callback.handlebars b/packages/cli/templates/oauth-error-callback.handlebars
@@ -3,17 +3,21 @@
 		<title>n8n - OAuth Callback</title>
 		<style>
 			body { font-family: 'Open Sans', sans-serif; padding: 10px;}
-			pre.error { background: #f7f7f7; border: 1px solid #ddd; border-radius: 3px; padding: 10px; overflow: auto; overflow-wrap: break-word; white-space: pre-wrap; }
+			details.error { margin-bottom: 20px; }
+			pre.reason { background: #f7f7f7; border: 1px solid #ddd; border-radius: 3px; padding: 10px; overflow: auto; overflow-wrap: break-word; white-space: pre-wrap;}
 		</style>
 	</head>
 	<body>
 		{{#if error}}
-			<h4>Error:</h4>
-			<pre class='error'>{{error.message}}</pre>
+			<h4>Error: {{error.message}}</h4>
+			<details class='error'>
+				<summary>More details</summary>
+				{{#if error.reason}}<pre class="reason">{{error.reason}}</pre>{{/if}}
+				</details>
 		{{/if}}
-					Failed to connect. The window can be closed now.
+		Failed to connect. The window can be closed now.
 		<script>
-			(function messageParent() { window.opener.postMessage('error', '*'); })();
+			(function messageParent() { window.opener?.postMessage('error', '*'); })();
 		</script>
 	</body>
 </html>