Authenticate with Shopify

You can authenticate with Shopify to create your own instance of the Shopify element through the UI or through APIs. Once authenticated, you can use the element instance to access the different functionality offered by the Shopify platform.

Authenticate Through the UI

Use the UI to authenticate with Shopify and create an element instance. Shopify authentication follows the typical OAuth 2 framework and you will need to sign in to Shopify as part of the process.

If you are configuring events, see the Events section.

To authenticate an element instance:

  1. Sign in to Cloud Elements, and then search for Shopify in our Elements Catalog. Search
  2. Hover over the element card, and then click Authenticate. Create Instance
  3. Enter a name for the element instance.
  4. In Shopify Site Address enter the personalized portion of your myshopify.com URL. For example, in https://cloud-elements.myshopify.com just enter cloud-elements.
  5. Click Create Instance.
  6. Provide your Shopify credentials, and then allow the connection.

After successfully authenticating, we give you several options for next steps. Make requests using the API docs associated with the instance, map the instance to a virtual data resource, or use it in a formula template.

Authenticate Through API

Authenticating through API is a multi-step process that involves:

1
Redirect URL

2
Authenticate Users

3
Authenticate Instance

Getting a Redirect URL

1
Redirect URL

2
Authenticate Users

3
Authenticate Instance

Use the following API call to request a redirect URL where the user can authenticate with the vendor. Replace {keyOrId} with the element key, shopify.

GET /elements/{keyOrId}/oauth/url?apiKey=<api_key>&apiSecret=<api_secret>&callbackUrl=<url>&siteAddress=<url>

Query Parameters

Query Parameter Description
apiKey The key obtained from registering your app with the provider. This is the Client ID that you recorded in API Provider Setup section.
apiSecret The client secret obtained from registering your app with the provider. This is the Client Secret that you recorded in API Provider Setup section.
callbackUrl The URL that will receive the code from the vendor to be used to create an element instance. This is the Callback URL that you recorded in API Provider Setup section.

Example cURL

curl -X GET
-H 'Content-Type: application/json'
'https://api.cloud-elements.com/elements/api-v2/elements/shopify/oauth/url?apiKey=fake_api_key&apiSecret=fake_api_secret&callbackUrl=https://www.mycoolapp.com/auth&state=shopify'

Example Response

Use the oauthUrl in the response to allow users to authenticate with the vendor.

{
"element": "shopify",
"oauthUrl": "https://SHOPIFYSHOPNAME.myshopify.com/admin/oauth/authorize?client_id=fake_client_id&scope=write_orders,write_products,write_customers&redirect_uri=https://www.mycoolapp.com/auth&state=shopify"
}

Authenticating Users and Receiving the Authorization Grant Code

1
Redirect URL

2
Authenticate Users

3
Authenticate Instance

Provide the response from the previous step to the users. After they authenticate, Shopify provides the following information in the response:

  • code
  • state
Response Parameter Description
code The Authorization Grant Code required by Cloud Elements to retrieve the OAuth access and refresh tokens from the endpoint.
state A customizable identifier, typically the element key (shopify) .

Authenticating the Element Instance

1
Redirect URL

2
Authenticate Users

3
Authenticate Instance

Use the /instances endpoint to authenticate with Shopify and create an element instance. If you are configuring events, see the Events section.

To create an element instance:

  1. Construct a JSON body as shown below (see Parameters):

            {
              "element": {
                "key": "shopify"
              },
              "providerData": {
                "code": "<AUTHORIZATION_GRANT_CODE>"
              },
              "configuration": {
                "oauth.api.key": "<LIENT_ID>",
                "oauth.api.secret": "<CLIENT_SECRET>",
                "oauth.callback.url": "https://www.examplecallbackurl.com/",
                "shopify.site.address":"<SHOPIFY_USER_SHOP_NAME>",
                "oauth.scope":"write_orders,write_products,write_customers"
              },
              "tags": [
                "<Add_Your_Tag>"
              ],
              "name": "<Insert_Instance_Name>"
            }
    
  2. Call the following, including the JSON body you constructed in the previous step:

    POST /instances
    
  3. Note the Token and ID and save them for all future requests using the element instance.

Example cURL

curl -X POST \
  https://api.cloud-elements.com/elements/api-v2/instances \
  -H 'authorization: User <USER_SECRET>, Organization <ORGANIZATION_SECRET>' \
  -H 'content-type: application/json' \
  -d '{
    "element": {
      "key": "shopify"
    },
    "providerData": {
      "code": "8aa74ff8ae16ba3ca19d12cbdea83aff16bddcd7"
    },
    "configuration": {
      "oauth.api.key": "xxxxxxxxxxxxxxxxxx",
      "oauth.api.secret": "xxxxxxxxxxxxxxxxxxxxxx",
      "shopify.site.address": "mycoolapp",
      "oauth.scope": "write_orders,write_products,write_customers",
      "oauth.callback.url": "https://mycoolapp.com"
    },
    "tags": [
      "Test"
    ],
    "name": "ShopifyInstance"
  }'

Parameters

API parameters not shown in Cloud Elements are in code formatting.

Parameter Description Data Type
'key' The element key.
shopify
string
Name
name
The name for the element instance created during authentication. Body
oauth.callback.url The Callback URL for the connected app you created for Shopify. This is the Callback URL that you recorded in API Provider Setup section.
oauth.api.key The key obtained from registering your app with the provider. This is the Client ID that you recorded in API Provider Setup section. string
oauth.api.secret The client secret obtained from registering your app with the provider. This is the Client Secret that you recorded in API Provider Setup section. string
Shopify Site Address
shopify.site.address
The personalized portion of your myshopify.com URL. For example, in https://cloud-elements.myshopify.com just enter cloud-elements. string
oauth.scope The permissions granted to the user when they authenticate to your application string
tags Optional. User-defined tags to further identify the instance. string

Example Response

{
  "id": 123,
  "name": "Test",
  "token": "5MOr3Sl/E4kww6mTjmjBYV/hAUAzz1g=",
  "element": {
    "id": 48,
    "name": "Shopify Beta",
    "key": "shopify",
    "description": "Add a Shopify Instance to connect your existing Shopify account to the eCommerce Hub, allowing you to manage orders and products across multiple eCommerce Elements. You will need your Shopify account information to add an instance.",
    "image": "elements/provider_shopify.png",
    "active": true,
    "deleted": false,
    "typeOauth": true,
    "trialAccount": false,
    "configDescription": "If you do not have an Shopify account, you can create one at",
    "signupURL": "https://www.shopify.com/login",
    "transformationsEnabled": true,
    "authentication": {
      "type": "oauth2"
    },
    "hub": "ecommerce",
    "parameters": []
  },
  "provisionInteractions": [],
  "valid": true,
  "disabled": false,
  "maxCacheSize": 0,
  "cacheTimeToLive": 0,
  "configuration": {
    "oauth.api.secret": "SHOPIFY_API_SECRET",
    "event.notification.subscription.id": null,
    "event.notification.callback.url": null,
    "oauth.callback.url": "https://examplecallbackurl.com",
    "shopify.site.address": "SHOP_NAME",
    "oauth.scope": "write_orders,write_products,write_customers",
    "oauth.api.key": "SHOPIFY_API_KEY",
    "oauth.user.token": "f9a67e985bee7c6352c739d1ddcdb0f9",
    "event.notification.enabled": "false"
  },
  "eventsEnabled": false,
  "cachingEnabled": false,
  "traceLoggingEnabled": false
}