shopify-app-js 0.0.1-security → 1.0.1

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

@@ -0,0 +1,83 @@
+import {
+  TypedResponse,
+  redirect as remixRedirect,
+} from '@remix-run/server-runtime';
+
+import {BasicParams} from '../../../types';
+import {getSessionTokenHeader} from '../../helpers/get-session-token-header';
+
+import {renderAppBridge} from './render-app-bridge';
+import {redirectWithAppBridgeHeaders} from './redirect-with-app-bridge-headers';
+
+export type RedirectTarget = '_self' | '_parent' | '_top';
+export type RedirectInit = number | (ResponseInit & {target?: RedirectTarget});
+export type RedirectFunction = (
+  url: string,
+  init?: RedirectInit,
+) => TypedResponse<never>;
+
+export function redirectFactory(
+  params: BasicParams,
+  request: Request,
+): RedirectFunction {
+  const {config} = params;
+
+  return function redirect(url, init: RedirectInit) {
+    const {searchParams} = new URL(request.url);
+    const parsedUrl = new URL(url, config.appUrl);
+
+    const isSameOrigin = parsedUrl.origin === config.appUrl;
+    if (isSameOrigin || url.startsWith('/')) {
+      searchParams.forEach((value, key) => {
+        if (!parsedUrl.searchParams.has(key)) {
+          parsedUrl.searchParams.set(key, value);
+        }
+      });
+    }
+
+    const target = (typeof init !== 'number' && init?.target) || '_self';
+    if (target === '_self') {
+      if (isBounceRequest(request)) {
+        throw renderAppBridge(params, request, {
+          url: parsedUrl.toString(),
+          target,
+        });
+      } else {
+        return remixRedirect(parsedUrl.toString(), init);
+      }
+    } else if (isDataRequest(request)) {
+      throw redirectWithAppBridgeHeaders(parsedUrl.toString());
+    } else if (isEmbeddedRequest(request)) {
+      throw renderAppBridge(params, request, {
+        url: parsedUrl.toString(),
+        target,
+      });
+    }
+
+    return remixRedirect(url, init);
+  };
+}
+
+function isBounceRequest(request: Request) {
+  return (
+    Boolean(getSessionTokenHeader(request)) &&
+    request.headers.has('X-Shopify-Bounce')
+  );
+}
+
+function isDataRequest(request: Request) {
+  const isGet = request.method === 'GET';
+  const sessionTokenHeader = Boolean(getSessionTokenHeader(request));
+
+  return (
+    sessionTokenHeader &&
+    !isBounceRequest(request) &&
+    (!isEmbeddedRequest(request) || !isGet)
+  );
+}
+
+function isEmbeddedRequest(request: Request) {
+  const {searchParams} = new URL(request.url);
+
+  return searchParams.get('embedded') === '1';
+}

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

@@ -0,0 +1,46 @@
+import {BasicParams} from '../../../types';
+import {appBridgeUrl} from '../../helpers/app-bridge-url';
+import {addDocumentResponseHeaders} from '../../helpers/add-response-headers';
+
+import {sanitizeRedirectUrl} from './validate-redirect-url';
+
+import type {RedirectTarget} from '.';
+
+export interface RedirectToOptions {
+  url: string | URL;
+  target?: RedirectTarget;
+}
+
+export function renderAppBridge(
+  {config}: BasicParams,
+  request: Request,
+  redirectTo?: RedirectToOptions,
+): never {
+  let redirectToScript = '';
+  if (redirectTo) {
+    const destination = sanitizeRedirectUrl(config.appUrl, redirectTo.url);
+
+    const target = redirectTo.target ?? '_top';
+
+    redirectToScript = `<script>window.open(${JSON.stringify(
+      destination.toString(),
+    )}, ${JSON.stringify(target)})</script>`;
+  }
+
+  const responseHeaders = new Headers({
+    'content-type': 'text/html;charset=utf-8',
+  });
+  addDocumentResponseHeaders(
+    responseHeaders,
+    config.isEmbeddedApp,
+    new URL(request.url).searchParams.get('shop'),
+  );
+
+  throw new Response(
+    `
+      <script data-api-key="${config.apiKey}" src="${appBridgeUrl()}"></script>
+      ${redirectToScript}
+    `,
+    {headers: responseHeaders},
+  );
+}

package/packages/shopify-app-remix/src/server/authenticate/admin/helpers/trigger-after-auth-hook.ts

@@ -0,0 +1,28 @@
+import {Session, ShopifyRestResources} from '@shopify/shopify-api';
+
+import type {BasicParams} from '../../../types';
+import {AuthorizationStrategy} from '../strategies/types';
+
+import {createAdminApiContext} from './create-admin-api-context';
+
+export async function triggerAfterAuthHook<
+  Resources extends ShopifyRestResources = ShopifyRestResources,
+>(
+  params: BasicParams,
+  session: Session,
+  request: Request,
+  authStrategy: AuthorizationStrategy,
+) {
+  const {config, logger} = params;
+  if (config.hooks.afterAuth) {
+    logger.info('Running afterAuth hook');
+    await config.hooks.afterAuth({
+      session,
+      admin: createAdminApiContext<Resources>(
+        session,
+        params,
+        authStrategy.handleClientError(request),
+      ),
+    });
+  }
+}

package/packages/shopify-app-remix/src/server/authenticate/admin/helpers/validate-redirect-url.ts

@@ -0,0 +1,67 @@
+import {ShopifyError} from '@shopify/shopify-api';
+
+interface Options {
+  requireSSL?: boolean;
+  throwOnInvalid?: boolean;
+}
+
+type SanitizedRedirectUrl<OptionsArg extends Options> =
+  OptionsArg['throwOnInvalid'] extends false ? URL | undefined : URL;
+
+const FILE_URI_MATCH = /\/\/\//;
+const INVALID_RELATIVE_URL = /[/\\][/\\]/;
+const WHITESPACE_CHARACTER = /\s/;
+const VALID_PROTOCOLS = ['https:', 'http:'];
+
+function isSafe(
+  domain: string,
+  redirectUrl: unknown,
+  requireSSL: boolean | undefined = true,
+): redirectUrl is string {
+  if (typeof redirectUrl !== 'string') {
+    return false;
+  }
+
+  if (
+    FILE_URI_MATCH.test(redirectUrl) ||
+    WHITESPACE_CHARACTER.test(redirectUrl)
+  ) {
+    return false;
+  }
+
+  let url: URL;
+
+  try {
+    url = new URL(redirectUrl, domain);
+  } catch (error) {
+    return false;
+  }
+
+  if (INVALID_RELATIVE_URL.test(url.pathname)) {
+    return false;
+  }
+
+  if (!VALID_PROTOCOLS.includes(url.protocol)) {
+    return false;
+  }
+
+  if (requireSSL && url.protocol !== 'https:') {
+    return false;
+  }
+
+  return true;
+}
+
+export function sanitizeRedirectUrl<OptionsArg extends Options>(
+  domain: string,
+  redirectUrl: unknown,
+  options: OptionsArg = {} as OptionsArg,
+): SanitizedRedirectUrl<OptionsArg> {
+  if (isSafe(domain, redirectUrl, options.requireSSL)) {
+    return new URL(redirectUrl, domain) as SanitizedRedirectUrl<OptionsArg>;
+  } else if (options.throwOnInvalid === false) {
+    return undefined as SanitizedRedirectUrl<OptionsArg>;
+  } else {
+    throw new ShopifyError('Invalid URL. Refusing to redirect');
+  }
+}

package/packages/shopify-app-remix/src/server/authenticate/admin/helpers/validate-shop-and-host-params.ts

@@ -0,0 +1,28 @@
+import {redirect} from '@remix-run/server-runtime';
+import {BasicParams} from 'src/server/types';
+
+export function validateShopAndHostParams(
+  params: BasicParams,
+  request: Request,
+) {
+  const {api, config, logger} = params;
+
+  if (config.isEmbeddedApp) {
+    const url = new URL(request.url);
+    const shop = api.utils.sanitizeShop(url.searchParams.get('shop')!);
+    if (!shop) {
+      logger.debug('Missing or invalid shop, redirecting to login path', {
+        shop,
+      });
+      throw redirect(config.auth.loginPath);
+    }
+
+    const host = api.utils.sanitizeHost(url.searchParams.get('host')!);
+    if (!host) {
+      logger.debug('Invalid host, redirecting to login path', {
+        host: url.searchParams.get('host'),
+      });
+      throw redirect(config.auth.loginPath);
+    }
+  }
+}

package/packages/shopify-app-remix/src/server/authenticate/admin/strategies/__tests__/auth-code-flow/admin-client.test.ts

@@ -0,0 +1,222 @@
+import {
+  ApiVersion,
+  LATEST_API_VERSION,
+  SESSION_COOKIE_NAME,
+  Session,
+} from '@shopify/shopify-api';
+import {restResources} from '@shopify/shopify-api/rest/admin/2023-04';
+
+import {
+  APP_URL,
+  BASE64_HOST,
+  TEST_SHOP,
+  expectExitIframeRedirect,
+  getJwt,
+  getThrownResponse,
+  setUpValidSession,
+  signRequestCookie,
+  testConfig,
+  mockExternalRequest,
+  expectAdminApiClient,
+} from '../../../../../__test-helpers';
+import {shopifyApp} from '../../../../..';
+import {REAUTH_URL_HEADER} from '../../../../const';
+import {AdminApiContext} from '../../../../../clients';
+
+describe('admin.authenticate context', () => {
+  expectAdminApiClient(async () => {
+    const {
+      admin,
+      expectedSession,
+      session: actualSession,
+    } = await setUpEmbeddedFlow();
+
+    return {admin, expectedSession, actualSession};
+  });
+  describe.each([
+    {
+      testGroup: 'REST client',
+      mockRequest: mockRestRequest,
+      action: async (admin: AdminApiContext, _session: Session) =>
+        admin.rest.get({path: '/customers.json'}),
+    },
+    {
+      testGroup: 'REST resources',
+      mockRequest: mockRestRequest,
+      action: async (admin: AdminApiContext, session: Session) =>
+        admin.rest.resources.Customer.all({session}),
+    },
+    {
+      testGroup: 'GraphQL client',
+      mockRequest: mockGraphqlRequest(),
+      action: async (admin: AdminApiContext, _session: Session) =>
+        admin.graphql('{ shop { name } }'),
+    },
+    {
+      testGroup: 'GraphQL client with options',
+      mockRequest: mockGraphqlRequest('2021-01' as ApiVersion),
+      action: async (admin: AdminApiContext, _session: Session) =>
+        admin.graphql(
+          'mutation myMutation($ID: String!) { shop(ID: $ID) { name } }',
+          {
+            variables: {ID: '123'},
+            apiVersion: '2021-01' as ApiVersion,
+            headers: {custom: 'header'},
+            tries: 2,
+          },
+        ),
+    },
+  ])(
+    '$testGroup re-authentication',
+    ({testGroup: _testGroup, mockRequest, action}) => {
+      it('redirects to auth when request receives a 401 response and not embedded', async () => {
+        // GIVEN
+        const {admin, session} = await setUpNonEmbeddedFlow();
+        const requestMock = await mockRequest(401);
+
+        // WHEN
+        const response = await getThrownResponse(
+          async () => action(admin, session),
+          requestMock,
+        );
+
+        // THEN
+        expect(response.status).toEqual(302);
+
+        const {hostname, pathname} = new URL(response.headers.get('Location')!);
+        expect(hostname).toEqual(TEST_SHOP);
+        expect(pathname).toEqual('/admin/oauth/authorize');
+      });
+
+      it('redirects to exit iframe when request receives a 401 response and embedded', async () => {
+        // GIVEN
+        const {admin, session} = await setUpEmbeddedFlow();
+        const requestMock = await mockRequest(401);
+
+        // WHEN
+        const response = await getThrownResponse(
+          async () => action(admin, session),
+          requestMock,
+        );
+
+        // THEN
+        expectExitIframeRedirect(response);
+      });
+
+      it('returns app bridge redirection headers when request receives a 401 response on fetch requests', async () => {
+        // GIVEN
+        const {admin, session} = await setUpFetchFlow();
+        const requestMock = await mockRequest(401);
+
+        // WHEN
+        const response = await getThrownResponse(
+          async () => action(admin, session),
+          requestMock,
+        );
+
+        // THEN
+        expect(response.status).toEqual(401);
+
+        const {origin, pathname, searchParams} = new URL(
+          response.headers.get(REAUTH_URL_HEADER)!,
+        );
+        expect(origin).toEqual(APP_URL);
+        expect(pathname).toEqual('/auth');
+        expect(searchParams.get('shop')).toEqual(TEST_SHOP);
+      });
+    },
+  );
+});
+
+async function setUpEmbeddedFlow() {
+  const shopify = shopifyApp(
+    testConfig({
+      future: {unstable_newEmbeddedAuthStrategy: false},
+      restResources,
+    }),
+  );
+  const expectedSession = await setUpValidSession(shopify.sessionStorage);
+
+  const {token} = getJwt();
+  const request = new Request(
+    `${APP_URL}?embedded=1&shop=${TEST_SHOP}&host=${BASE64_HOST}&id_token=${token}`,
+  );
+
+  return {
+    shopify,
+    expectedSession,
+    ...(await shopify.authenticate.admin(request)),
+  };
+}
+
+async function setUpFetchFlow() {
+  const shopify = shopifyApp(
+    testConfig({
+      future: {unstable_newEmbeddedAuthStrategy: false},
+      restResources,
+    }),
+  );
+  await setUpValidSession(shopify.sessionStorage);
+
+  const {token} = getJwt();
+  const request = new Request(APP_URL, {
+    headers: {Authorization: `Bearer ${token}`},
+  });
+
+  return {
+    shopify,
+    ...(await shopify.authenticate.admin(request)),
+  };
+}
+
+async function setUpNonEmbeddedFlow() {
+  const shopify = shopifyApp(
+    testConfig({
+      future: {unstable_newEmbeddedAuthStrategy: false},
+      restResources,
+      isEmbeddedApp: false,
+    }),
+  );
+  const session = await setUpValidSession(shopify.sessionStorage);
+
+  const request = new Request(`${APP_URL}?shop=${TEST_SHOP}`);
+  signRequestCookie({
+    request,
+    cookieName: SESSION_COOKIE_NAME,
+    cookieValue: session.id,
+  });
+
+  return {
+    shopify,
+    ...(await shopify.authenticate.admin(request)),
+  };
+}
+
+async function mockRestRequest(status) {
+  const requestMock = new Request(
+    `https://${TEST_SHOP}/admin/api/${LATEST_API_VERSION}/customers.json`,
+  );
+
+  await mockExternalRequest({
+    request: requestMock,
+    response: new Response('{}', {status}),
+  });
+
+  return requestMock;
+}
+
+function mockGraphqlRequest(apiVersion = LATEST_API_VERSION) {
+  return async function (status = 401) {
+    const requestMock = new Request(
+      `https://${TEST_SHOP}/admin/api/${apiVersion}/graphql.json`,
+      {method: 'POST'},
+    );
+
+    await mockExternalRequest({
+      request: requestMock,
+      response: new Response(undefined, {status}),
+    });
+
+    return requestMock;
+  };
+}