Snapchat Connection Gives Error "Cannot find module 'axios@0.22.0'"

Problem statement

When attempting to authenticate against the Snapchat social connection, the following error occurs.

Cannot find module ‘axios@0.22.0

Cause

Auth0 does not support axios@0.22.0 in node18, so the error is expected.

Solution

To resolve the issue, update the Snapchat connection to use a more recent version of the Axios library ( e.g. v1.2.1). The easiest way to do this and to ensure the existing config is not lost is to run a GET on the connection first via the Get a connection endpoint, take the output and paste it into the Update a connection. Remove some properties like id, name, strategy, and realms.

Important note: Update fetchUserProfile with the below to update the version of Axios used:

function fetchUserProfile(accessToken, context, cb) {\n const axios = require(\"axios@1.2.1\");\n const userInfoEndpoint = \"https://kit.snapchat.com/v1/me\";\n const headers = { Authorization: `Bearer ${accessToken}` };\n const query = \"{me{displayName bitmoji{avatar} externalId}}\";\n\n axios\n .post(userInfoEndpoint, { query }, { headers })\n .then((res) => {\n if (res.status !== 200) {\n return cb(new Error(res.data));\n }\n\n const userData = res.data.data.me;\n\n const profile = {\n user_id: userData.externalId,\n nickname: userData.displayName,\n picture: userData.bitmoji ? userData.bitmoji.avatar : null\n };\n\n cb(null, profile);\n })\n .catch((err) => cb(err));\n}

The complete body will be something like the below (using the appropriate values for client_id, client_secret, and within enabled_clients, check other values line up with the GET otherwise amend accordingly)

{
  "options": {
    "scope": "https://auth.snapchat.com/oauth2/api/user.external_id https://auth.snapchat.com/oauth2/api/user.display_name https://auth.snapchat.com/oauth2/api/user.bitmoji.avatar"",
    "scripts": {
      "fetchUserProfile": "function fetchUserProfile(accessToken, context, cb) {\n  const axios = require(\"axios@1.2.1\");\n  const userInfoEndpoint = \"https://kit.snapchat.com/v1/me\";\n  const headers = { Authorization: `Bearer ${accessToken}` };\n  const query = \"{me{displayName bitmoji{avatar} externalId}}\";\n\n  axios\n    .post(userInfoEndpoint, { query }, { headers })\n    .then((res) => {\n      if (res.status !== 200) {\n        return cb(new Error(res.data));\n      }\n\n      const userData = res.data.data.me;\n\n      const profile = {\n        user_id: userData.externalId,\n        nickname: userData.displayName,\n        picture: userData.bitmoji ? userData.bitmoji.avatar : null\n      };\n\n      cb(null, profile);\n    })\n    .catch((err) => cb(err));\n}"
    },
    "icon_url": "https://cdn.auth0.com/marketplace/catalog/content/assets/creators/auth0/snapchat-avatar.png"",
    "tokenURL": "https://accounts.snapchat.com/accounts/oauth2/token"",
    "client_id": "CLIENT_ID",
    "client_secret": "CLIENT_SECRET",
    "authorizationURL": "https://accounts.snapchat.com/accounts/oauth2/auth"",
    "integration_name": "snapchat"
  },
  "is_domain_connection": false,
  "display_name": "Snapchat",
  "enabled_clients": [
    "SJYKZafXep7istjFfNM0fzyaSCIOf9BK"
  ]
}

Using the API Explorer from the above links should make this relatively straightforward, for info in case help is needed with getting Management API Access Tokens.