fix: authenticateRequest

lib/graphql/index.js

@@ -27,7 +27,7 @@ async function fetch(url, options = {}) {
   // options.headers['oc-secret'] = process.env.OC_SECRET; // TODO
   options.headers['oc-application'] = 'pdf';
   options.headers['user-agent'] = 'opencollective-pdf/1.0 node-fetch/1.0';
-
+  console.log('FETCH', url, options);
   const result = await nodeFetch(url, options);
 
   return result;
@@ -50,14 +50,16 @@ function getCustomAgent() {
 export const createClient = (authorizationHeaders) => {
   const authLink = setContext((_, { headers }) => {
     const newHeaders = { ...headers, ...authorizationHeaders };
+    console.log({ headers, newHeaders });
     return { headers: newHeaders };
   });
 
+  console.log('URI:', getGraphqlUrl('v2'));
   const apiLink = new HttpLink({ uri: getGraphqlUrl('v2'), fetch });
   return new ApolloClient({
     connectToDevTools: process.browser,
     ssrMode: !process.browser, // Disables forceFetch on the server (so queries are only run once)
-    link: ApolloLink.from([authLink, apiLink]),
+    link: authLink.concat(apiLink),
     cache: new InMemoryCache({
       // Documentation:
       // https://www.apollographql.com/docs/react/data/fragments/#using-fragments-with-unions-and-interfaces

lib/graphql/queries.js

@@ -234,9 +234,14 @@ export async function fetchTransactionInvoice(transactionId, authorizationHeader
       variables: { transactionId },
       fetchPolicy: 'no-cache',
     });
-  } catch (e) {
-    console.error('Query Error', JSON.stringify(e, null, 2));
-    throw e;
+  } catch (error) {
+    console.error(
+      'Query Error',
+      JSON.stringify({
+        response,
+      }),
+    );
+    throw error;
   }
 
   if (!response.data.transaction) {

lib/req-utils.js

@@ -4,17 +4,15 @@ import { get, isEmpty } from 'lodash';
  * To forward API Key or Authorization headers from the request to the API calls.
  * Returns `null` if no headers are found.
  */
-export const getAuthorizationHeadersFromReq = (req) => {
+const getAuthorizationHeadersFromReq = (req) => {
   const { headers, query } = req;
   const result = {};
   const apiKey = get(headers, 'api-key') || get(query, 'apiKey');
   const personalToken = get(headers, 'personal-token') || get(query, 'personalToken') || get(query, 'app_key');
-  const authorization = get(headers, 'authorization') || req.cookies?.authorization;
+  const authorization = get(headers, 'authorization');
   if (authorization) {
-    const parts = authorization.split(' ');
-    const scheme = parts[0];
-    const accessToken = parts[1];
-    if (!/^Bearer$/i.test(scheme) || !accessToken) {
+    const [scheme, accessToken] = authorization.split(' ');
+    if (scheme !== 'Bearer' || !accessToken) {
       throw new Error('Invalid authorization header. Format should be: Authorization: Bearer [token]');
     }
 
@@ -29,19 +27,19 @@ export const getAuthorizationHeadersFromReq = (req) => {
     result['Personal-Token'] = personalToken;
   }
 
-  return isEmpty(headers) ? null : headers;
+  return isEmpty(headers) ? null : result;
 };
 
 /**
  * Some syntax sugar around the `getAuthorizationHeadersFromReq` function, that throws for non-authenticated requests
  * but allows `OPTIONS` requests to pass through
  */
-export const authenticateRequest = (ctx) => {
-  const authorizationHeaders = getAuthorizationHeadersFromReq(ctx);
+export const authenticateRequest = (req) => {
+  const authorizationHeaders = getAuthorizationHeadersFromReq(req);
   if (!authorizationHeaders) {
     // Frontend sends an OPTIONS request to check CORS, we should just return OK when that happens
-    if (ctx.req.method === 'OPTIONS') {
-      return {};
+    if (req.method === 'OPTIONS') {
+      return null;
     } else {
       throw new Error('Please provide an access token or an APP key');
     }

pages/expense/[id]/[filename].js

@@ -12,6 +12,10 @@ class TransactionReceipt extends React.Component {
     if (isServer) {
       const { id } = ctx.query;
       const authorizationHeaders = authenticateRequest(ctx.req);
+      if (!authorizationHeaders) {
+        return {};
+      }
+
       const expense = await fetchExpenseInvoiceData(id, authorizationHeaders);
       return { expense, pageFormat: ctx.query.pageFormat };
     }

pages/receipts/collectives/[fromCollectiveSlug]/[toCollectiveSlug]/[isoStartDate]/[isoEndDate]/[filename].js

@@ -12,6 +12,10 @@ class TransactionReceipt extends React.Component {
     if (isServer) {
       const { fromCollectiveSlug, toCollectiveSlug: hostSlug, isoStartDate: dateFrom, isoEndDate: dateTo } = ctx.query;
       const authorizationHeaders = authenticateRequest(ctx.req);
+      if (!authorizationHeaders) {
+        return {};
+      }
+
       const queryParams = { fromCollectiveSlug, hostSlug, dateFrom, dateTo };
       const response = await fetchInvoiceByDateRange(queryParams, authorizationHeaders);
 

pages/receipts/transactions/[id]/[filename].js

@@ -12,6 +12,10 @@ class TransactionReceipt extends React.Component {
     if (isServer) {
       const { id, pageFormat } = ctx.query;
       const authorizationHeaders = authenticateRequest(ctx.req);
+      if (!authorizationHeaders) {
+        return {};
+      }
+
       const transaction = await fetchTransactionInvoice(id, authorizationHeaders);
       return {
         pageFormat: pageFormat,