shopify-app-js 0.0.1-security → 1.0.1

package/packages/shopify-app-remix/src/server/authenticate/flow/types.ts

@@ -0,0 +1,90 @@
+import {Session, ShopifyRestResources} from '@shopify/shopify-api';
+
+import type {AdminApiContext} from '../../clients';
+
+export interface FlowContext<
+  Resources extends ShopifyRestResources = ShopifyRestResources,
+> {
+  /**
+   * A session with an offline token for the shop.
+   *
+   * Returned only if there is a session for the shop.
+   *
+   * @example
+   * <caption>Shopify session for the Flow request.</caption>
+   * <description>Use the session associated with this request to use REST resources.</description>
+   * ```ts
+   * // /app/routes/flow.tsx
+   * import { ActionFunction } from "@remix-run/node";
+   * import { authenticate } from "../shopify.server";
+   *
+   * export const action: ActionFunction = async ({ request }) => {
+   *   const { session, admin } = await authenticate.flow(request);
+   *
+   *   const products = await admin?.rest.resources.Product.all({ session });
+   *   // Use products
+   *
+   *   return new Response();
+   * };
+   * ```
+   */
+  session: Session;
+
+  /**
+   * The payload from the Flow request.
+   *
+   * @example
+   * <caption>Flow payload.</caption>
+   * <description>Get the request's POST payload.</description>
+   * ```ts
+   * // /app/routes/flow.tsx
+   * import { ActionFunction } from "@remix-run/node";
+   * import { authenticate } from "../shopify.server";
+   *
+   * export const action: ActionFunction = async ({ request }) => {
+   *   const { payload } = await authenticate.flow(request);
+   *   return new Response();
+   * };
+   * ```
+   */
+  payload: any;
+
+  /**
+   * An admin context for the Flow request.
+   *
+   * Returned only if there is a session for the shop.
+   *
+   * @example
+   * <caption>Flow admin context.</caption>
+   * <description>Use the `admin` object in the context to interact with the Admin API.</description>
+   * ```ts
+   * // /app/routes/flow.tsx
+   * import { ActionFunctionArgs } from "@remix-run/node";
+   * import { authenticate } from "../shopify.server";
+   *
+   * export async function action({ request }: ActionFunctionArgs) {
+   *   const { admin } = await authenticate.flow(request);
+   *
+   *   const response = await admin?.graphql(
+   *     `#graphql
+   *     mutation populateProduct($input: ProductInput!) {
+   *       productCreate(input: $input) {
+   *         product {
+   *           id
+   *         }
+   *       }
+   *     }`,
+   *     { variables: { input: { title: "Product Name" } } }
+   *   );
+   *
+   *   const productData = await response.json();
+   *   return json({ data: productData.data });
+   * }
+   * ```
+   */
+  admin: AdminApiContext<Resources>;
+}
+
+export type AuthenticateFlow<
+  Resources extends ShopifyRestResources = ShopifyRestResources,
+> = (request: Request) => Promise<FlowContext<Resources>>;

package/packages/shopify-app-remix/src/server/authenticate/helpers/__tests__/add-response-headers.test.ts

@@ -0,0 +1,25 @@
+import {shopifyApp} from '../../..';
+import {
+  APP_URL,
+  TEST_SHOP,
+  expectDocumentRequestHeaders,
+  testConfig,
+} from '../../../__test-helpers';
+
+describe('addDocumentResponseHeaders', () => {
+  it.each([true, false])(
+    'adds frame-ancestors CSP headers when embedded = %s',
+    (isEmbeddedApp) => {
+      // GIVEN
+      const shopify = shopifyApp(testConfig({isEmbeddedApp}));
+      const request = new Request(`${APP_URL}?shop=${TEST_SHOP}`);
+      const response = new Response();
+
+      // WHEN
+      shopify.addDocumentResponseHeaders(request, response.headers);
+
+      // THEN
+      expectDocumentRequestHeaders(response, isEmbeddedApp);
+    },
+  );
+});

package/packages/shopify-app-remix/src/server/authenticate/helpers/__tests__/app-bridge-url.test.ts

@@ -0,0 +1,21 @@
+import {APP_BRIDGE_URL} from '../../const';
+import {appBridgeUrl, setAppBridgeUrlOverride} from '../app-bridge-url';
+
+describe('appBridgeUrl', () => {
+  it('defaults to returning the const APP_BRIDGE_URL', () => {
+    // GIVEN
+    setAppBridgeUrlOverride(undefined as any as string);
+
+    // THEN
+    expect(appBridgeUrl()).toEqual(APP_BRIDGE_URL);
+  });
+
+  it('returns the override value when set', () => {
+    // GIVEN
+    const override = 'http://localhost:9876/app-bridge.js';
+    setAppBridgeUrlOverride(override);
+
+    // THEN
+    expect(appBridgeUrl()).toEqual(override);
+  });
+});

package/packages/shopify-app-remix/src/server/authenticate/helpers/__tests__/idempotent-promise-handler.test.ts

@@ -0,0 +1,104 @@
+import {ShopifyError} from '@shopify/shopify-api';
+
+import {IdempotentPromiseHandler} from '../idempotent-promise-handler';
+
+const mockFunction = jest.fn();
+async function promiseFunction() {
+  mockFunction();
+}
+
+afterEach(() => {
+  mockFunction.mockReset();
+});
+
+describe('IdempotentPromiseHandler', () => {
+  it('runs the promise function only once for the same identifier', async () => {
+    // GIVEN
+    const promiseHandler = new IdempotentPromiseHandler();
+
+    // WHEN
+    promiseHandler.handlePromise({
+      promiseFunction,
+      identifier: 'first-promise',
+    });
+
+    promiseHandler.handlePromise({
+      promiseFunction,
+      identifier: 'first-promise',
+    });
+
+    // THEN
+    expect(mockFunction).toHaveBeenCalledTimes(1);
+  });
+
+  it('runs the promise function once for each identifier', async () => {
+    // GIVEN
+    // const promiseFunction = jest.fn();
+    const promiseHandler = new IdempotentPromiseHandler();
+
+    // WHEN
+    promiseHandler.handlePromise({
+      promiseFunction,
+      identifier: 'first-promise',
+    });
+
+    promiseHandler.handlePromise({
+      promiseFunction,
+      identifier: 'second-promise',
+    });
+
+    // THEN
+    expect(mockFunction).toHaveBeenCalledTimes(2);
+  });
+
+  it('clears stale identifier from hash', async () => {
+    // GIVEN
+    const currentDate = Date.now();
+    jest.useFakeTimers().setSystemTime(currentDate);
+    const promiseHandler = new IdempotentPromiseHandler() as any;
+
+    // WHEN
+    promiseHandler.handlePromise({
+      promiseFunction,
+      identifier: 'old-promise',
+    });
+
+    jest.useFakeTimers().setSystemTime(currentDate + 70000);
+
+    await promiseHandler.handlePromise({
+      promiseFunction,
+      identifier: 'new-promise',
+    });
+
+    expect(promiseHandler.identifiers.size).toBe(1);
+  });
+
+  it('clears stale identifier from hash even when promise fails', async () => {
+    // GIVEN
+    const promiseFunctionErr = () => {
+      throw new ShopifyError();
+    };
+    const currentDate = Date.now();
+    jest.useFakeTimers().setSystemTime(currentDate);
+    const promiseHandler = new IdempotentPromiseHandler() as any;
+
+    // WHEN
+    expect(
+      promiseHandler.handlePromise({
+        promiseFunction: promiseFunctionErr,
+        identifier: 'old-promise',
+      }),
+    ).rejects.toThrow();
+
+    jest.useFakeTimers().setSystemTime(currentDate + 70000);
+
+    expect(
+      promiseHandler.handlePromise({
+        promiseFunction: promiseFunctionErr,
+        identifier: 'new-promise',
+      }),
+    ).rejects.toThrow();
+
+    expect(promiseHandler.identifiers.size).toBe(1);
+  });
+});

package/packages/shopify-app-remix/src/server/authenticate/helpers/add-response-headers.ts

@@ -0,0 +1,43 @@
+import type {BasicParams} from '../../types';
+
+export type AddDocumentResponseHeadersFunction = (
+  request: Request,
+  headers: Headers,
+) => void;
+
+export function addDocumentResponseHeadersFactory(
+  params: BasicParams,
+): AddDocumentResponseHeadersFunction {
+  const {api, config} = params;
+
+  return function (request: Request, headers: Headers) {
+    const {searchParams} = new URL(request.url);
+    const shop = api.utils.sanitizeShop(searchParams.get('shop')!);
+
+    addDocumentResponseHeaders(headers, config.isEmbeddedApp, shop);
+  };
+}
+
+export function addDocumentResponseHeaders(
+  headers: Headers,
+  isEmbeddedApp: boolean,
+  shop: string | null | undefined,
+) {
+  if (shop) {
+    headers.set(
+      'Link',
+      '<https://cdn.shopify.com/shopifycloud/app-bridge.js>; rel="preload"; as="script";',
+    );
+  }
+
+  if (isEmbeddedApp) {
+    if (shop) {
+      headers.set(
+        'Content-Security-Policy',
+        `frame-ancestors https://${shop} https://admin.shopify.com https://*.spin.dev;`,
+      );
+    }
+  } else {
+    headers.set('Content-Security-Policy', `frame-ancestors 'none';`);
+  }
+}

package/packages/shopify-app-remix/src/server/authenticate/helpers/app-bridge-url.ts

@@ -0,0 +1,10 @@
+import {APP_BRIDGE_URL} from '../const';
+
+let appBridgeUrlOverride: string | undefined;
+export function setAppBridgeUrlOverride(url: string) {
+  appBridgeUrlOverride = url;
+}
+
+export function appBridgeUrl() {
+  return appBridgeUrlOverride || APP_BRIDGE_URL;
+}

package/packages/shopify-app-remix/src/server/authenticate/helpers/ensure-cors-headers.ts

@@ -0,0 +1,38 @@
+import {BasicParams} from '../../types';
+import {REAUTH_URL_HEADER} from '../const';
+
+export interface EnsureCORSFunction {
+  (response: Response): Response;
+}
+
+export function ensureCORSHeadersFactory(
+  params: BasicParams,
+  request: Request,
+  corsHeaders: string[] = [],
+): EnsureCORSFunction {
+  const {logger, config} = params;
+
+  return function ensureCORSHeaders(response) {
+    const origin = request.headers.get('Origin');
+    if (origin && origin !== config.appUrl) {
+      logger.debug(
+        'Request comes from a different origin, adding CORS headers',
+      );
+
+      const corsHeadersSet = new Set([
+        'Authorization',
+        'Content-Type',
+        ...corsHeaders,
+      ]);
+
+      response.headers.set('Access-Control-Allow-Origin', '*');
+      response.headers.set(
+        'Access-Control-Allow-Headers',
+        [...corsHeadersSet].join(', '),
+      );
+      response.headers.set('Access-Control-Expose-Headers', REAUTH_URL_HEADER);
+    }
+
+    return response;
+  };
+}

package/packages/shopify-app-remix/src/server/authenticate/helpers/get-session-token-header.ts

@@ -0,0 +1,11 @@
+const SESSION_TOKEN_PARAM = 'id_token';
+
+export function getSessionTokenHeader(request: Request): string | undefined {
+  return request.headers.get('authorization')?.replace('Bearer ', '');
+}
+
+export function getSessionTokenFromUrlParam(request: Request): string | null {
+  const url = new URL(request.url);
+
+  return url.searchParams.get(SESSION_TOKEN_PARAM);
+}

package/packages/shopify-app-remix/src/server/authenticate/helpers/idempotent-promise-handler.ts

@@ -0,0 +1,45 @@
+export interface IdempotentHandlePromiseParams {
+  promiseFunction: () => Promise<any>;
+  identifier: string;
+}
+
+const IDENTIFIER_TTL_MS = 60000;
+
+export class IdempotentPromiseHandler {
+  protected identifiers: Map<string, number>;
+
+  constructor() {
+    this.identifiers = new Map<string, number>();
+  }
+
+  async handlePromise({
+    promiseFunction,
+    identifier,
+  }: IdempotentHandlePromiseParams): Promise<any> {
+    try {
+      if (this.isPromiseRunnable(identifier)) {
+        await promiseFunction();
+      }
+    } finally {
+      this.clearStaleIdentifiers();
+    }
+
+    return Promise.resolve();
+  }
+
+  private isPromiseRunnable(identifier: string) {
+    if (!this.identifiers.has(identifier)) {
+      this.identifiers.set(identifier, Date.now());
+      return true;
+    }
+    return false;
+  }
+
+  private async clearStaleIdentifiers() {
+    this.identifiers.forEach((date, identifier, map) => {
+      if (Date.now() - date > IDENTIFIER_TTL_MS) {
+        map.delete(identifier);
+      }
+    });
+  }
+}

package/packages/shopify-app-remix/src/server/authenticate/helpers/index.ts

@@ -0,0 +1,8 @@
+export * from './app-bridge-url';
+export * from './add-response-headers';
+export * from './ensure-cors-headers';
+export * from './validate-session-token';
+export * from './get-session-token-header';
+export * from './reject-bot-request';
+export * from './respond-to-options-request';
+export * from './respond-to-invalid-session-token';

package/packages/shopify-app-remix/src/server/authenticate/helpers/reject-bot-request.ts

@@ -0,0 +1,13 @@
+import isbot from 'isbot';
+
+import type {BasicParams} from '../../types';
+
+export function respondToBotRequest(
+  {logger}: BasicParams,
+  request: Request,
+): void | never {
+  if (isbot(request.headers.get('User-Agent'))) {
+    logger.debug('Request is from a bot, skipping auth');
+    throw new Response(undefined, {status: 410, statusText: 'Gone'});
+  }
+}

package/packages/shopify-app-remix/src/server/authenticate/helpers/respond-to-invalid-session-token.ts

@@ -0,0 +1,29 @@
+import {BasicParams} from 'src/server/types';
+
+import {redirectToBouncePage} from '../admin/helpers/redirect-to-bounce-page';
+import {RETRY_INVALID_SESSION_HEADER} from '../const';
+
+interface RespondToInvalidSessionTokenParams {
+  params: BasicParams;
+  request: Request;
+  retryRequest?: boolean;
+}
+
+export function respondToInvalidSessionToken({
+  params,
+  request,
+  retryRequest = false,
+}: RespondToInvalidSessionTokenParams) {
+  const {api, logger, config} = params;
+
+  const isDocumentRequest = !request.headers.get('authorization');
+  if (isDocumentRequest) {
+    return redirectToBouncePage({api, logger, config}, new URL(request.url));
+  }
+
+  throw new Response(undefined, {
+    status: 401,
+    statusText: 'Unauthorized',
+    headers: retryRequest ? RETRY_INVALID_SESSION_HEADER : {},
+  });
+}

package/packages/shopify-app-remix/src/server/authenticate/helpers/respond-to-options-request.ts

@@ -0,0 +1,26 @@
+import {BasicParams} from '../../types';
+
+import {ensureCORSHeadersFactory} from './ensure-cors-headers';
+
+export function respondToOptionsRequest(
+  params: BasicParams,
+  request: Request,
+  corsHeaders?: string[],
+) {
+  if (request.method === 'OPTIONS') {
+    const ensureCORSHeaders = ensureCORSHeadersFactory(
+      params,
+      request,
+      corsHeaders,
+    );
+
+    throw ensureCORSHeaders(
+      new Response(null, {
+        status: 204,
+        headers: {
+          'Access-Control-Max-Age': '7200',
+        },
+      }),
+    );
+  }
+}

package/packages/shopify-app-remix/src/server/authenticate/helpers/validate-session-token.ts

@@ -0,0 +1,32 @@
+import {JwtPayload} from '@shopify/shopify-api';
+
+import type {BasicParams} from '../../types';
+
+interface ValidateSessionTokenOptions {
+  checkAudience?: boolean;
+}
+
+export async function validateSessionToken(
+  {api, logger}: BasicParams,
+  token: string,
+  {checkAudience = true}: ValidateSessionTokenOptions = {},
+): Promise<JwtPayload> {
+  logger.debug('Validating session token');
+
+  try {
+    const payload = await api.session.decodeSessionToken(token, {
+      checkAudience,
+    });
+    logger.debug('Session token is valid', {
+      payload: JSON.stringify(payload),
+    });
+
+    return payload;
+  } catch (error) {
+    logger.debug(`Failed to validate session token: ${error.message}`);
+    throw new Response(undefined, {
+      status: 401,
+      statusText: 'Unauthorized',
+    });
+  }
+}

package/packages/shopify-app-remix/src/server/authenticate/login/__tests__/login.test.ts

@@ -0,0 +1,157 @@
+import {LoginErrorType, shopifyApp} from '../../../index';
+import {
+  APP_URL,
+  TEST_SHOP,
+  TEST_SHOP_NAME,
+  getThrownResponse,
+  testConfig,
+} from '../../../__test-helpers';
+
+describe('login helper', () => {
+  it('returns an empty errors object if GET and no shop param', async () => {
+    // GIVEN
+    const shopify = shopifyApp(testConfig());
+    const requestMock = {
+      url: `${APP_URL}/auth/login`,
+      method: 'GET',
+    };
+
+    // WHEN
+    const errors = await shopify.login(requestMock as any as Request);
+
+    // THEN
+    expect(errors).toStrictEqual({});
+  });
+
+  it('does not access formData if method is GET', async () => {
+    // GIVEN
+    const formDataMock = jest.fn();
+    const shopify = shopifyApp(testConfig());
+    const requestMock = {
+      url: `${APP_URL}/auth/login?shop=${TEST_SHOP}`,
+      method: 'GET',
+      formData: formDataMock,
+    };
+
+    // WHEN
+    getThrownResponse(shopify.login, requestMock as any as Request);
+
+    // THEN
+    expect(formDataMock).not.toHaveBeenCalled();
+  });
+
+  it('returns an error if the shop parameter is missing', async () => {
+    // GIVEN
+    const shopify = shopifyApp(testConfig());
+    const requestMock = {
+      url: `${APP_URL}/auth/login`,
+      formData: async () => ({get: () => null}),
+      method: 'POST',
+    };
+
+    // WHEN
+    const errors = await shopify.login(requestMock as any as Request);
+
+    // THEN
+    expect(errors).toEqual({shop: LoginErrorType.MissingShop});
+  });
+
+  it.each([
+    {urlShop: 'invalid.shop', formShop: null, method: 'GET'},
+    {urlShop: null, formShop: 'invalid.shop', method: 'POST'},
+  ])(
+    'returns an error if the shop parameter is invalid: %s',
+    async ({urlShop, formShop, method}) => {
+      // GIVEN
+      const shopify = shopifyApp(testConfig());
+      const requestMock = {
+        url: urlShop
+          ? `${APP_URL}/auth/login?shop=${urlShop}`
+          : `${APP_URL}/auth/login`,
+        formData: async () => ({get: () => formShop}),
+        method,
+      };
+
+      // WHEN
+      const errors = await shopify.login(requestMock as any as Request);
+
+      // THEN
+      expect(errors).toEqual({shop: LoginErrorType.InvalidShop});
+    },
+  );
+
+  describe.each([
+    {isEmbeddedApp: false, futureFlag: false, redirectToInstall: false},
+    {isEmbeddedApp: true, futureFlag: false, redirectToInstall: false},
+    {isEmbeddedApp: false, futureFlag: true, redirectToInstall: false},
+    {isEmbeddedApp: true, futureFlag: true, redirectToInstall: true},
+  ])('Given setup: %s', (testCaseConfig) => {
+    it.each([
+      {urlShop: null, formShop: TEST_SHOP, method: 'POST'},
+      {urlShop: TEST_SHOP, formShop: null, method: 'GET'},
+      {urlShop: null, formShop: 'test-shop', method: 'POST'},
+      {urlShop: 'test-shop', formShop: null, method: 'GET'},
+      {urlShop: null, formShop: 'test-shop.myshopify.com', method: 'POST'},
+      {urlShop: 'test-shop.myshopify.com', formShop: null, method: 'GET'},
+    ])(
+      'returns a redirect to auth or install if the shop is valid: %s',
+      async ({urlShop, formShop, method}) => {
+        // GIVEN
+        const config = testConfig({
+          future: {unstable_newEmbeddedAuthStrategy: testCaseConfig.futureFlag},
+          isEmbeddedApp: testCaseConfig.isEmbeddedApp,
+        });
+        const shopify = shopifyApp(config);
+        const requestMock = {
+          url: urlShop
+            ? `${APP_URL}/auth/login?shop=${urlShop}`
+            : `${APP_URL}/auth/login`,
+          formData: async () => ({get: () => formShop}),
+          method,
+        };
+
+        // WHEN
+        const response = await getThrownResponse(
+          shopify.login,
+          requestMock as any as Request,
+        );
+
+        // THEN
+        const expectedPath = testCaseConfig.redirectToInstall
+          ? `https://admin.shopify.com/store/${TEST_SHOP_NAME}/oauth/install?client_id=${config.apiKey}`
+          : `${APP_URL}/auth?shop=${TEST_SHOP}`;
+
+        expect(response.status).toEqual(302);
+        expect(response.headers.get('location')).toEqual(expectedPath);
+      },
+    );
+
+    it('sanitizes the shop parameter', async () => {
+      // GIVEN
+      const config = testConfig({
+        future: {unstable_newEmbeddedAuthStrategy: testCaseConfig.futureFlag},
+        isEmbeddedApp: testCaseConfig.isEmbeddedApp,
+      });
+      const shopify = shopifyApp(config);
+      const requestMock = {
+        url: `${APP_URL}/auth/login`,
+        formData: async () => ({get: () => `https://${TEST_SHOP}/`}),
+        method: 'POST',
+      };
+
+      // WHEN
+      const response = await getThrownResponse(
+        shopify.login,
+        requestMock as any as Request,
+      );
+
+      const expectedPath = testCaseConfig.redirectToInstall
+        ? `https://admin.shopify.com/store/${TEST_SHOP_NAME}/oauth/install?client_id=${config.apiKey}`
+        : `${APP_URL}/auth?shop=${TEST_SHOP}`;
+
+      // THEN
+      expect(response.status).toEqual(302);
+      expect(response.headers.get('location')).toEqual(expectedPath);
+    });
+  });
+});