fix: auth bug when value is a secret environment (#4210)

Co-authored-by: jamesgeorge007 <25279263+jamesgeorge007@users.noreply.github.com>

packages/hoppscotch-common/package.json

@@ -35,10 +35,10 @@
     "@codemirror/view": "6.25.1",
     "@hoppscotch/codemirror-lang-graphql": "workspace:^",
     "@hoppscotch/data": "workspace:^",
+    "@hoppscotch/httpsnippet": "3.0.6",
     "@hoppscotch/js-sandbox": "workspace:^",
     "@hoppscotch/ui": "0.2.0",
     "@hoppscotch/vue-toasted": "0.1.0",
-    "@hoppscotch/httpsnippet": "3.0.6",
     "@lezer/highlight": "1.2.0",
     "@unhead/vue": "1.8.8",
     "@urql/core": "4.2.0",
@@ -124,6 +124,7 @@
     "@types/nprogress": "0.2.3",
     "@types/paho-mqtt": "1.0.10",
     "@types/postman-collection": "3.5.10",
+    "@types/qs": "6.9.12",
     "@types/splitpanes": "2.2.6",
     "@types/uuid": "9.0.7",
     "@types/yargs-parser": "21.0.3",

packages/hoppscotch-common/src/helpers/utils/EffectiveURL.ts

@@ -42,6 +42,9 @@ export interface EffectiveHoppRESTRequest extends HoppRESTRequest {
  * Get headers that can be generated by authorization config of the request
  * @param req Request to check
  * @param envVars Currently active environment variables
+ * @param auth Authorization config to check
+ * @param parse Whether to parse the template strings
+ * @param showKeyIfSecret Whether to show the key if the value is a secret
  * @returns The list of headers
  */
 export const getComputedAuthHeaders = (
@@ -53,7 +56,8 @@ export const getComputedAuthHeaders = (
         headers: HoppRESTHeaders
       },
   auth?: HoppRESTRequest["auth"],
-  parse = true
+  parse = true,
+  showKeyIfSecret = false
 ) => {
   const request = auth ? { auth: auth ?? { authActive: false } } : req
   // If Authorization header is also being user-defined, that takes priority
@@ -69,10 +73,20 @@ export const getComputedAuthHeaders = (
   // TODO: Support a better b64 implementation than btoa ?
   if (request.auth.authType === "basic") {
     const username = parse
-      ? parseTemplateString(request.auth.username, envVars, false, true)
+      ? parseTemplateString(
+          request.auth.username,
+          envVars,
+          false,
+          showKeyIfSecret
+        )
       : request.auth.username
     const password = parse
-      ? parseTemplateString(request.auth.password, envVars, false, true)
+      ? parseTemplateString(
+          request.auth.password,
+          envVars,
+          false,
+          showKeyIfSecret
+        )
       : request.auth.password
 
     headers.push({
@@ -93,7 +107,9 @@ export const getComputedAuthHeaders = (
       active: true,
       key: "Authorization",
       value: `Bearer ${
-        parse ? parseTemplateString(token, envVars, false, true) : token
+        parse
+          ? parseTemplateString(token, envVars, false, showKeyIfSecret)
+          : token
       }`,
     })
   } else if (request.auth.authType === "api-key") {
@@ -101,9 +117,14 @@ export const getComputedAuthHeaders = (
     if (addTo === "HEADERS" && key) {
       headers.push({
         active: true,
-        key: parseTemplateString(key, envVars, false, true),
+        key: parseTemplateString(key, envVars, false, showKeyIfSecret),
         value: parse
-          ? parseTemplateString(request.auth.value ?? "", envVars, false, true)
+          ? parseTemplateString(
+              request.auth.value ?? "",
+              envVars,
+              false,
+              showKeyIfSecret
+            )
           : request.auth.value ?? "",
       })
     }
@@ -157,6 +178,8 @@ export type ComputedHeader = {
  * For e.g, Authorization headers maybe added if an Auth Mode is defined on REST
  * @param req The request to check
  * @param envVars The environment variables active
+ * @param parse Whether to parse the template strings
+ * @param showKeyIfSecret Whether to show the key if the value is a secret
  * @returns The headers that are generated along with the source of that header
  */
 export const getComputedHeaders = (
@@ -167,10 +190,17 @@ export const getComputedHeaders = (
         headers: HoppRESTHeaders
       },
   envVars: Environment["variables"],
-  parse = true
+  parse = true,
+  showKeyIfSecret = false
 ): ComputedHeader[] => {
   return [
-    ...getComputedAuthHeaders(envVars, req, undefined, parse).map((header) => ({
+    ...getComputedAuthHeaders(
+      envVars,
+      req,
+      undefined,
+      parse,
+      showKeyIfSecret
+    ).map((header) => ({
       source: "auth" as const,
       header,
     })),
@@ -246,11 +276,13 @@ export const resolvesEnvsInBody = (
   if (!body.contentType) return body
 
   if (body.contentType === "multipart/form-data") {
-    if (!body.body)
+    if (!body.body) {
       return {
-        contentType: "",
+        contentType: null,
-        body: [],
+        body: null,
       }
+    }
+
     return {
       contentType: "multipart/form-data",
       body: body.body.map(
@@ -373,7 +405,12 @@ export function getEffectiveRESTRequest(
   showKeyIfSecret = false
 ): EffectiveHoppRESTRequest {
   const effectiveFinalHeaders = pipe(
-    getComputedHeaders(request, environment.variables).map((h) => h.header),
+    getComputedHeaders(
+      request,
+      environment.variables,
+      true,
+      showKeyIfSecret
+    ).map((h) => h.header),
     A.concat(request.headers),
     A.filter((x) => x.active && x.key !== ""),
     A.map((x) => ({

pnpm-lock.yaml

@@ -671,6 +671,9 @@ importers:
       '@types/postman-collection':
         specifier: 3.5.10
         version: 3.5.10
+      '@types/qs':
+        specifier: 6.9.12
+        version: 6.9.12
       '@types/splitpanes':
         specifier: 2.2.6
         version: 2.2.6(typescript@5.3.2)