Passport Fix (#1955)

* fix: Fixed bug in passport access

* fix: resolved issues with postMessage and static urls

client/coral-auth-callback/src/index.js

@@ -4,7 +4,7 @@ import { createPostMessage } from 'coral-framework/services/postMessage';
 
 document.addEventListener('DOMContentLoaded', () => {
   const staticConfig = getStaticConfiguration();
-  const { STATIC_ORIGIN: origin } = staticConfig;
+  const { BASE_ORIGIN: origin } = staticConfig;
   const postMessage = createPostMessage(origin);
 
   // Get the auth element and parse it as JSON by decoding it.

client/coral-framework/services/bootstrap.js

@@ -136,7 +136,7 @@ export async function createContext({
   });
 
   const staticConfig = getStaticConfiguration();
-  let { LIVE_URI: liveUri, STATIC_ORIGIN: origin } = staticConfig;
+  let { LIVE_URI: liveUri, BASE_ORIGIN: origin } = staticConfig;
   if (liveUri == null) {
     // The protocol must match the origin protocol, secure/insecure.
     const protocol = location.protocol === 'https:' ? 'wss' : 'ws';

middleware/staticTemplate.js

@@ -5,6 +5,7 @@ const { merge } = require('lodash');
 
 const {
   BASE_URL,
+  BASE_ORIGIN,
   BASE_PATH,
   MOUNT_PATH,
   STATIC_URL,
@@ -29,6 +30,7 @@ const TALK_CLIENT_ENV = Object.keys(process.env)
       LIVE_URI: WEBSOCKET_LIVE_URI,
       STATIC_URL,
       STATIC_ORIGIN,
+      BASE_ORIGIN,
     }
   );
 

services/passport.js

@@ -19,6 +19,7 @@ const ms = require('ms');
 const _ = require('lodash');
 const { attachStaticLocals } = require('../middleware/staticTemplate');
 const { encodeJSONForHTML } = require('./response');
+const { STATIC_URL, BASE_URL } = require('../url');
 
 // Create a redis client to use for authentication.
 const { createClientFactory } = require('./redis');
@@ -97,10 +98,14 @@ const HandleGenerateCredentials = (req, res, next) => (err, user) => {
   res.json({ user, token });
 };
 
-const generateAuthPopupCallbackCSP = req =>
-  req.locals.STATIC_URL && req.locals.BASE_URL !== req.locals.STATIC_URL
-    ? `default-src 'self' ${req.locals.STATIC_URL};`
-    : "default-src 'self';";
+/**
+ * authPopupCallbackCSP is the header sent via Content-Security-Policy when
+ * a social callback request is being made.
+ */
+const authPopupCallbackCSP = (() =>
+  STATIC_URL && BASE_URL !== STATIC_URL
+    ? `default-src 'self' ${STATIC_URL.replace(/\/$/, '')};`
+    : "default-src 'self';")();
 
 /**
  * Returns the response to the login attempt via a popup callback with some JS.
@@ -111,7 +116,7 @@ const HandleAuthPopupCallback = (req, res, next) => (err, user) => {
   res.header('Pragma', 'no-cache');
 
   // Ensure the only scripts that can run here are those on the Talk domain.
-  res.header('Content-Security-Policy', generateAuthPopupCallbackCSP(req));
+  res.header('Content-Security-Policy', authPopupCallbackCSP);
 
   // Attach static locals to the response locals object.
   attachStaticLocals(res.locals);

url.js

@@ -11,6 +11,8 @@ const BASE_URL = trailingSlash(ROOT_URL);
 // The BASE_PATH is simply the path component of the BASE_URL.
 const BASE_PATH = new URL(BASE_URL).pathname;
 
+const BASE_ORIGIN = new URL(BASE_URL).origin;
+
 // The MOUNT_PATH is derived from the BASE_PATH, if it is provided and enabled.
 // This will mount all the application routes onto it.
 const MOUNT_PATH = ROOT_URL_MOUNT_PATH ? BASE_PATH : '/';
@@ -22,6 +24,7 @@ const STATIC_ORIGIN = new URL(STATIC_URI).origin;
 
 module.exports = {
   BASE_URL,
+  BASE_ORIGIN,
   BASE_PATH,
   MOUNT_PATH,
   STATIC_URL,