shopify-app-js 0.0.1-security → 1.0.1

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

@@ -0,0 +1,53 @@
+import {redirect} from '@remix-run/server-runtime';
+
+import {BasicParams, LoginError, LoginErrorType} from '../../types';
+
+export function loginFactory(params: BasicParams) {
+  const {api, config, logger} = params;
+
+  return async function login(request: Request): Promise<LoginError | never> {
+    const url = new URL(request.url);
+    const shopParam = url.searchParams.get('shop');
+
+    if (request.method === 'GET' && !shopParam) {
+      return {};
+    }
+
+    const shop: string | null =
+      shopParam || ((await request.formData()).get('shop') as string);
+
+    if (!shop) {
+      logger.debug('Missing shop parameter', {shop});
+      return {shop: LoginErrorType.MissingShop};
+    }
+
+    const shopWithoutProtocol = shop
+      .replace(/^https?:\/\//, '')
+      .replace(/\/$/, '');
+    const shopWithDomain =
+      shop?.indexOf('.') === -1
+        ? `${shopWithoutProtocol}.myshopify.com`
+        : shopWithoutProtocol;
+    const sanitizedShop = api.utils.sanitizeShop(shopWithDomain);
+
+    if (!sanitizedShop) {
+      logger.debug('Invalid shop parameter', {shop});
+      return {shop: LoginErrorType.InvalidShop};
+    }
+
+    const authPath = `${config.appUrl}${config.auth.path}?shop=${sanitizedShop}`;
+
+    const adminPath = api.utils.legacyUrlToShopAdminUrl(sanitizedShop);
+    const installPath = `https://${adminPath}/oauth/install?client_id=${config.apiKey}`;
+
+    const shouldInstall =
+      config.isEmbeddedApp && config.future.unstable_newEmbeddedAuthStrategy;
+    const redirectUrl = shouldInstall ? installPath : authPath;
+
+    logger.info(`Redirecting login request to ${redirectUrl}`, {
+      shop: sanitizedShop,
+    });
+
+    throw redirect(redirectUrl);
+  };
+}

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

@@ -0,0 +1,224 @@
+import {shopifyApp} from '../../..';
+import {
+  APP_URL,
+  getJwt,
+  getThrownResponse,
+  testConfig,
+} from '../../../__test-helpers';
+
+describe('Authenticate.public', () => {
+  describe('when v3_authenticatePublic is not set and authenticate.public() is called', () => {
+    it('logs that authenticate.public() is deprecated', async () => {
+      // GIVEN
+      const config = testConfig({
+        future: {
+          v3_authenticatePublic: false,
+        },
+      });
+      const shopify = shopifyApp(config);
+      const {token} = getJwt();
+
+      // WHEN
+      await shopify.authenticate.public(
+        new Request(APP_URL, {
+          headers: {
+            Authorization: `Bearer ${token}`,
+          },
+        }),
+      );
+
+      // THEN
+      expect(config.logger?.log).toHaveBeenCalledWith(
+        expect.any(Number),
+        expect.stringContaining(
+          'authenticate.public() will be deprecated in v3. Use authenticate.public.checkout() instead.',
+        ),
+      );
+    });
+
+    it('returns token when successful', async () => {
+      // GIVEN
+      const shopify = shopifyApp(
+        testConfig({
+          future: {
+            v3_authenticatePublic: false,
+          },
+        }),
+      );
+      const {token, payload} = getJwt();
+
+      // WHEN
+      const {sessionToken} = await shopify.authenticate.public(
+        new Request(APP_URL, {
+          headers: {
+            Authorization: `Bearer ${token}`,
+          },
+        }),
+      );
+
+      // THEN
+      expect(sessionToken).toMatchObject(payload);
+    });
+
+    it('sets extra CORS allowed headers when requested from a different origin', async () => {
+      // GIVEN
+      const shopify = shopifyApp(
+        testConfig({
+          future: {
+            v3_authenticatePublic: false,
+          },
+        }),
+      );
+      const {token} = getJwt();
+
+      // WHEN
+      const {cors} = await shopify.authenticate.public(
+        new Request(APP_URL, {
+          headers: {
+            Origin: 'https://some-other.origin',
+            Authorization: `Bearer ${token}`,
+          },
+        }),
+        {corsHeaders: ['Content-Type', 'X-Extra-Header']},
+      );
+      const response = cors(new Response());
+
+      // THEN
+      expect(response.headers.get('Access-Control-Allow-Headers')).toBe(
+        'Authorization, Content-Type, X-Extra-Header',
+      );
+    });
+
+    it('responds to preflight requests', async () => {
+      // GIVEN
+      const shopify = shopifyApp(
+        testConfig({
+          future: {
+            v3_authenticatePublic: false,
+          },
+        }),
+      );
+      const {token, payload} = getJwt();
+
+      // WHEN
+      const response = await getThrownResponse(
+        shopify.authenticate.public,
+        new Request(APP_URL, {
+          method: 'OPTIONS',
+          headers: {Authorization: `Bearer ${token}`},
+        }),
+      );
+
+      // THEN
+      expect(response.status).toBe(204);
+    });
+
+    it('responds to preflight requests from a different origin with extra CORS allowed headers', async () => {
+      // GIVEN
+      const shopify = shopifyApp(
+        testConfig({
+          future: {
+            v3_authenticatePublic: false,
+          },
+        }),
+      );
+      const {token} = getJwt();
+      const request = new Request(APP_URL, {
+        method: 'OPTIONS',
+        headers: {
+          Origin: 'https://some-other.origin',
+          Authorization: `Bearer ${token}`,
+        },
+      });
+
+      // WHEN
+      const response = await getThrownResponse(
+        async (request) =>
+          shopify.authenticate.public(request, {
+            corsHeaders: ['X-Extra-Header'],
+          }),
+        request,
+      );
+
+      // THEN
+      expect(response.status).toBe(204);
+      expect(response.headers.get('Access-Control-Allow-Headers')).toBe(
+        'Authorization, Content-Type, X-Extra-Header',
+      );
+    });
+
+    it('throws a 401 on missing Authorization bearer token', async () => {
+      // GIVEN
+      const shopify = shopifyApp(
+        testConfig({
+          future: {
+            v3_authenticatePublic: false,
+          },
+        }),
+      );
+
+      // WHEN
+      const response = await getThrownResponse(
+        shopify.authenticate.public,
+        new Request(APP_URL),
+      );
+
+      // THEN
+      expect(response.status).toBe(401);
+    });
+
+    it('throws a 401 on invalid Authorization bearer token', async () => {
+      // GIVEN
+      const shopify = shopifyApp(
+        testConfig({
+          future: {
+            v3_authenticatePublic: false,
+          },
+        }),
+      );
+
+      // WHEN
+      const response = await getThrownResponse(
+        shopify.authenticate.public,
+        new Request(APP_URL, {
+          headers: {Authorization: `Bearer this_is_not_a_valid_token`},
+        }),
+      );
+
+      // THEN
+      expect(response.status).toBe(401);
+    });
+
+    it('rejects bot requests', async () => {
+      // GIVEN
+      const shopify = shopifyApp(
+        testConfig({
+          future: {
+            v3_authenticatePublic: false,
+          },
+        }),
+      );
+
+      // WHEN
+      const response = await getThrownResponse(
+        shopify.authenticate.public,
+        new Request(APP_URL, {
+          headers: {'User-Agent': 'Googlebot'},
+        }),
+      );
+
+      // THEN
+      expect(response.status).toBe(410);
+    });
+  });
+
+  describe('when v3_authenticatePublic is true', () => {
+    it('authenticate.public is an object not a function', async () => {
+      // GIVEN
+      const shopify = shopifyApp(testConfig());
+
+      // THEN
+      expect(typeof shopify.authenticate.public).toBe('object');
+    });
+  });
+});

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

@@ -0,0 +1,282 @@
+import {HashFormat, createSHA256HMAC} from '@shopify/shopify-api/runtime';
+
+import {LATEST_API_VERSION, shopifyApp} from '../../../..';
+import {
+  API_SECRET_KEY,
+  APP_URL,
+  TEST_SHOP,
+  expectAdminApiClient,
+  expectStorefrontApiClient,
+  getThrownResponse,
+  mockExternalRequest,
+  setUpValidSession,
+  testConfig,
+} from '../../../../__test-helpers';
+
+describe('authenticating app proxy requests', () => {
+  it('Throws a 400 response if there is no signature param', async () => {
+    // GIVEN
+    const shopify = shopifyApp(testConfig());
+
+    // WHEN
+    const url = new URL(APP_URL);
+    url.searchParams.set('shop', TEST_SHOP);
+    url.searchParams.set('timestamp', secondsInPast(10));
+
+    const response = await getThrownResponse(
+      shopify.authenticate.public.appProxy,
+      new Request(url.toString()),
+    );
+
+    // THEN
+    expect(response.status).toBe(400);
+    expect(response.statusText).toBe('Bad Request');
+  });
+
+  it('Throws a 400 response if the signature param is incorrect', async () => {
+    // GIVEN
+    const shopify = shopifyApp(testConfig());
+
+    // WHEN
+    const url = new URL(APP_URL);
+    url.searchParams.set('shop', TEST_SHOP);
+    url.searchParams.set('timestamp', secondsInPast(1));
+    url.searchParams.set('signature', 'not-the-right-signature');
+
+    const response = await getThrownResponse(
+      shopify.authenticate.public.appProxy,
+      new Request(url.toString()),
+    );
+
+    // THEN
+    expect(response.status).toBe(400);
+    expect(response.statusText).toBe('Bad Request');
+  });
+
+  it('Throws a 400 response if the timestamp is more than 90 seconds old', async () => {
+    // GIVEN
+    const shopify = shopifyApp(testConfig());
+
+    // WHEN
+    const url = new URL(APP_URL);
+    url.searchParams.set('shop', TEST_SHOP);
+    url.searchParams.set('timestamp', secondsInPast(100));
+    url.searchParams.set('signature', await createAppProxyHmac(url));
+
+    const response = await getThrownResponse(
+      shopify.authenticate.public.appProxy,
+      new Request(url.toString()),
+    );
+
+    // THEN
+    expect(response.status).toBe(400);
+    expect(response.statusText).toBe('Bad Request');
+  });
+
+  it('Throws a 400 response if the timestamp is more than 90 seconds in the future', async () => {
+    // GIVEN
+    const shopify = shopifyApp(testConfig());
+
+    // WHEN
+    const url = new URL(APP_URL);
+    url.searchParams.set('shop', TEST_SHOP);
+    url.searchParams.set('timestamp', secondsInFuture(100));
+    url.searchParams.set('signature', await createAppProxyHmac(url));
+
+    const response = await getThrownResponse(
+      shopify.authenticate.public.appProxy,
+      new Request(url.toString()),
+    );
+
+    // THEN
+    expect(response.status).toBe(400);
+    expect(response.statusText).toBe('Bad Request');
+  });
+
+  describe('Valid requests return a liquid helper', () => {
+    it('Returns a Response with Content-Type: application/liquid and status 200 by default', async () => {
+      // GIVEN
+      const config = testConfig();
+      const shopify = shopifyApp(config);
+
+      // WHEN
+      const {liquid} = await shopify.authenticate.public.appProxy(
+        await getValidRequest(),
+      );
+      const response = liquid('Liquid template {{shop.name}}');
+
+      // THEN
+      expect(response.status).toBe(200);
+      expect(await response.text()).toBe('Liquid template {{shop.name}}');
+      expect(response.headers.get('Content-Type')).toBe('application/liquid');
+    });
+
+    it('Returns a Response with status equal to init if init is number', async () => {
+      // GIVEN
+      const config = testConfig();
+      const shopify = shopifyApp(config);
+
+      // WHEN
+      const {liquid} = await shopify.authenticate.public.appProxy(
+        await getValidRequest(),
+      );
+      const response = liquid('Liquid template {{shop.name}}', 400);
+
+      // THEN
+      expect(response.status).toBe(400);
+    });
+
+    it('Returns a Response with properties from init in init is an object', async () => {
+      // GIVEN
+      const config = testConfig();
+      const shopify = shopifyApp(config);
+
+      // WHEN
+      const {liquid} = await shopify.authenticate.public.appProxy(
+        await getValidRequest(),
+      );
+      const response = liquid('Liquid template {{shop.name}}', {
+        headers: {
+          my: 'header',
+        },
+        status: 300,
+        statusText: 'Oops',
+      });
+
+      // THEN
+      expect(response.headers.get('my')).toBe('header');
+      expect(response.headers.get('Content-Type')).toBe('application/liquid');
+      expect(response.status).toBe(300);
+      expect(response.statusText).toBe('Oops');
+    });
+
+    it('Returns a Response body with layout {% layout none %} if layout is false', async () => {
+      // GIVEN
+      const config = testConfig();
+      const shopify = shopifyApp(config);
+
+      // WHEN
+      const {liquid} = await shopify.authenticate.public.appProxy(
+        await getValidRequest(),
+      );
+      const response = liquid('Liquid template {{shop.name}}', {
+        layout: false,
+      });
+
+      // THEN
+      expect(await response.text()).toBe(
+        '{% layout none %} Liquid template {{shop.name}}',
+      );
+    });
+
+    it('Returns a Response body combining layout and initOptions', async () => {
+      // GIVEN
+      const config = testConfig();
+      const shopify = shopifyApp(config);
+
+      // WHEN
+      const {liquid} = await shopify.authenticate.public.appProxy(
+        await getValidRequest(),
+      );
+      const response = liquid('Liquid template {{shop.name}}', {
+        status: 400,
+        layout: false,
+      });
+
+      // THEN
+      expect(response.status).toBe(400);
+      expect(await response.text()).toBe(
+        '{% layout none %} Liquid template {{shop.name}}',
+      );
+    });
+  });
+
+  describe('Valid requests with no session', () => {
+    it('Returns AppProxy Context ', async () => {
+      // GIVEN
+      const config = testConfig();
+      const shopify = shopifyApp(config);
+
+      // WHEN
+      const context = await shopify.authenticate.public.appProxy(
+        await getValidRequest(),
+      );
+
+      // THEN
+      expect(context).toStrictEqual({
+        session: undefined,
+        admin: undefined,
+        storefront: undefined,
+        liquid: expect.any(Function),
+      });
+    });
+  });
+
+  describe('Valid requests with a session return an admin API client', () => {
+    expectAdminApiClient(async () => {
+      const shopify = shopifyApp(testConfig());
+      const expectedSession = await setUpValidSession(shopify.sessionStorage, {
+        isOnline: false,
+      });
+
+      const {admin, session: actualSession} =
+        await shopify.authenticate.public.appProxy(await getValidRequest());
+
+      if (!admin) {
+        throw new Error('No admin client');
+      }
+
+      return {admin, expectedSession, actualSession};
+    });
+  });
+
+  describe('Valid requests with a session return a Storefront API client', () => {
+    expectStorefrontApiClient(async () => {
+      const shopify = shopifyApp(testConfig());
+      const expectedSession = await setUpValidSession(shopify.sessionStorage, {
+        isOnline: false,
+      });
+
+      const {storefront, session: actualSession} =
+        await shopify.authenticate.public.appProxy(await getValidRequest());
+
+      if (!storefront) {
+        throw new Error('No storefront client');
+      }
+
+      return {storefront, expectedSession, actualSession};
+    });
+  });
+});
+
+async function getValidRequest(): Promise<Request> {
+  const url = new URL(APP_URL);
+  url.searchParams.set('shop', TEST_SHOP);
+  url.searchParams.set('timestamp', secondsInPast(1));
+  url.searchParams.set('signature', await createAppProxyHmac(url));
+
+  return new Request(url.toString());
+}
+
+async function createAppProxyHmac(url: URL): Promise<string> {
+  const params = Object.fromEntries(url.searchParams.entries());
+  const string = Object.entries(params)
+    .sort(([val1], [val2]) => val1.localeCompare(val2))
+    .reduce((acc, [key, value]) => {
+      return `${acc}${key}=${Array.isArray(value) ? value.join(',') : value}`;
+    }, '');
+
+  return createSHA256HMAC(API_SECRET_KEY, string, HashFormat.Hex);
+}
+
+function secondsInPast(seconds: number): string {
+  const now = Math.trunc(Date.now() / 1000);
+
+  return String(now - seconds);
+}
+
+function secondsInFuture(seconds: number): string {
+  const now = Math.trunc(Date.now() / 1000);
+
+  return String(now + seconds);
+}

package/packages/shopify-app-remix/src/server/authenticate/public/appProxy/authenticate.public.app-proxy.doc.ts

@@ -0,0 +1,36 @@
+import {ReferenceEntityTemplateSchema} from '@shopify/generate-docs';
+
+const data: ReferenceEntityTemplateSchema = {
+  name: 'App proxy',
+  description:
+    '[App proxies](/docs/apps/online-store/app-proxies) take requests to Shopify links, and redirect them to external links.' +
+    '\nThe `authenticate.public.appProxy` function validates requests made to app proxies, and returns a context to enable querying Shopify APIs.' +
+    '\n\n> Note: If the store has not installed the app, store-related properties such as `admin` or `storefront` will be `undefined`',
+  category: 'Authenticate',
+  subCategory: 'Public',
+  type: 'object',
+  isVisualComponent: false,
+  definitions: [
+    {
+      title: 'authenticate.public.appProxy',
+      description:
+        'Authenticates requests coming to the app from Shopify app proxies.',
+      type: 'AuthenticateAppProxy',
+    },
+  ],
+  jsDocTypeExamples: ['AppProxyContextWithSession'],
+  related: [
+    {
+      name: 'Admin API context',
+      subtitle: 'Interact with the Admin API.',
+      url: '/docs/api/shopify-app-remix/apis/admin-api',
+    },
+    {
+      name: 'Storefront API context',
+      subtitle: 'Interact with the Storefront API.',
+      url: '/docs/api/shopify-app-remix/apis/storefront-api',
+    },
+  ],
+};
+
+export default data;

package/packages/shopify-app-remix/src/server/authenticate/public/appProxy/authenticate.ts

@@ -0,0 +1,90 @@
+import {ShopifyRestResources} from '@shopify/shopify-api';
+
+import {adminClientFactory, storefrontClientFactory} from '../../../clients';
+import {BasicParams} from '../../../types';
+
+import {
+  AppProxyContext,
+  AppProxyContextWithSession,
+  AuthenticateAppProxy,
+  LiquidResponseFunction,
+} from './types';
+
+export function authenticateAppProxyFactory<
+  Resources extends ShopifyRestResources,
+>(params: BasicParams): AuthenticateAppProxy {
+  const {api, config, logger} = params;
+
+  return async function authenticate(
+    request,
+  ): Promise<AppProxyContext | AppProxyContextWithSession<Resources>> {
+    logger.info('Authenticating app proxy request');
+
+    const {searchParams} = new URL(request.url);
+    const query = Object.fromEntries(searchParams.entries());
+    let isValid = false;
+
+    try {
+      isValid = await api.utils.validateHmac(query, {
+        signator: 'appProxy',
+      });
+    } catch (error) {
+      logger.info(error.message);
+      throw new Response(undefined, {status: 400, statusText: 'Bad Request'});
+    }
+
+    if (!isValid) {
+      logger.info('App proxy request has invalid signature');
+      throw new Response(undefined, {
+        status: 400,
+        statusText: 'Bad Request',
+      });
+    }
+
+    const shop = searchParams.get('shop')!;
+    const sessionId = api.session.getOfflineId(shop);
+    const session = await config.sessionStorage.loadSession(sessionId);
+
+    if (!session) {
+      const context: AppProxyContext = {
+        liquid,
+        session: undefined,
+        admin: undefined,
+        storefront: undefined,
+      };
+
+      return context;
+    }
+
+    const context: AppProxyContextWithSession<Resources> = {
+      liquid,
+      session,
+      admin: adminClientFactory({params, session}),
+      storefront: storefrontClientFactory({params, session}),
+    };
+
+    return context;
+  };
+}
+
+const liquid: LiquidResponseFunction = (body, initAndOptions) => {
+  if (typeof initAndOptions !== 'object') {
+    return new Response(body, {
+      status: initAndOptions || 200,
+      headers: {
+        'Content-Type': 'application/liquid',
+      },
+    });
+  }
+
+  const {layout, ...responseInit} = initAndOptions || {};
+  const responseBody = layout === false ? `{% layout none %} ${body}` : body;
+
+  const headers = new Headers(responseInit.headers);
+  headers.set('Content-Type', 'application/liquid');
+
+  return new Response(responseBody, {
+    ...responseInit,
+    headers,
+  });
+};