Page Comparison

Shopify Dashboard & Research:

1. Learn what Shopify requires and how to do development with them.
   Shopify PHP - https://github.com/Shopify/shopify-api-php
   https://shopify.dev/docs/apps/launch/app-requirements-checklist
   https://shopify.dev/docs/api/app-bridge

2. Shopify app authentication and authorization.
   https://shopify.dev/docs/apps/build/authentication-authorization
   https://shopify.dev/docs/apps/build/authentication-authorization/set-embedded-app-authorization?extension=javascript

   1. Authentication is the process of verifying the identity of the user or the app. To keep transactions on Shopify’s platform safe and secure, all apps connecting with Shopify APIs must authenticate when making API requests.

   2. Authorization is the process of giving permissions to apps. When an app user installs a Shopify app they authorize the app, enabling the app to acquire an access token. For example, an app might be authorized to access orders and product data in a store.
      Outline of the Shopify Auth process:

      1. Create a route for starting the OAuth method such as /installAction.

      2. In this route, the Shopify\Auth\OAuth::begin method will be used.

      3. The begin method returns a URL that will be used for redirecting the user to the Shopify Authentication screen to complete the OAuth process, your app needs to validate the callback request made by Shopify after the merchant authorizes your app to access their store data.

      4. To do that, you can call the Shopify\Auth\OAuth::callbackAction method in the endpoint defined in the redirectPath argument of the begin method.

   3. App minimal required permissions:

      1. View personal data:
         Store Owner → Name, email address, phone number, physical address.
         Minimal use of information from shopify which means we pass certain compliance expectations.

         Code Block
         { "storeId": 66872279297, "storeName": "ek-dev-plugins", "storeEmail": "productmanagement@ekomi-group.com", "storeDomain": "ek-dev-plugins.myshopify.com", "storeOwnerName": "eKomi Product", "accountCreated": 0 }

   4. In the Shopify App Dashboard Configuration Settings these must be added for installation and authentication (The callback verification):

      1. App URL

      2. Preferences URL (optional)

      3. Allowed redirection URL(s)

   5. Compliance Webhooks that Shopify requires to be registered.
      Every app that's distributed through the Shopify App Store must subscribe to the following compliance webhook topics in the Partner Dashboard:

      1. Customer data request endpoint - customers/data_request - Requests to view stored customer data.

      2. Customer data erasure endpoint - customers/redact - Requests to delete customer data.

      3. Shop data erasure endpoint - shop/redact - Requests to delete shop data.
         When you receive one of the compliance webhooks, you need to take the following actions:

         • Confirm that you've received the request by responding with a 200 series status code.

         • Complete the action within 30 days of receiving the request. However, if you're unable to comply with a redaction request because you're legally required to retain data, then you shouldn't complete the action.

   6. Security requirements:
      Security header to only allow iframes to work in the provided domains.

      Code Block
      // Setting this directive guarantees that your app can be framed only within the shop admin. header("Content-Security-Policy: frame-ancestors " . $secureShopUrl . " https://admin.shopify.com;");

3. Shopify - Ngrok.
   In the Shopify ecosystem, embedded apps run in an iframe in a production environment. In order to test the functionality of your app within that context in development, you’re going to want to tunnel what you have running locally to an accessible URL.

   1. https://ngrok.com/

   2. Setup Ngrok for local development with Shopify platform.

      1. Set the Ngrok URL as the URL for your webhook call backs in Shopify Admin.

      2. Customer data request endpoint → https://a80d-41-193-138-209.ngrok-free.app/netcomm/customers/data_request