Creating JWT within the survey flow | XM Community
Skip to main content

I am trying to use Punchh’s dynamic code generation to create a coupon for users. The problem is, the API uses JWT.IO to create a JSON web token and this doesn’t seem to be a common practice within Qualtrics. Any ideas on how to go about accomplishing this? I assume I would need to use JS to create the JWT and concatenate the pieces of the URL in the survey flow, but creating the JWT is the biggest hurdle… 

An alternative would be to create your own web service that handles both JWT and Punchh API interaction.

There are JWT.IO libraries listed for a variety of languages at  https://jwt.io/libraries


Thanks, Tom! That would definitely be the preferred solution but the client wants this to be contained within Q. 


Here’s a working solution for anyone else that finds themselves in a similar situation. Enjoy & GL! 
 

Qualtrics.SurveyEngine.addOnload(function () {
  /*Place your JavaScript here to run when the page loads*/
  const HMACSHA256 = (stringToSign, secret) => "not_implemented"
  const header = {
    "typ": "JWT",
    "alg": "HS256"
  }
  const encodedHeaders = btoa(JSON.stringify(header))
  const claims = {
    "iss": "title",
    "iat": 1692899630,
    "exp": 1724437103,
    "aud": "www.example.com",
    "sub": "name of coupon",
    "email": "${e://Field/email_user}",
    "first_name": "${e://Field/first_name}",
    "last_name": "${e://Field/last_name}",
    "campaign_id": "XXXXX" //GENERATED TOKEN
  }

  const encodedPlayload = btoa(JSON.stringify(claims))
  const signature = HMACSHA256(`${encodedHeaders}.${encodedPlayload}`, "${e://Field/Code}")
  const encodedSignature = btoa(signature)

  const jwt_1 = encodedHeaders + '.' + encodedPlayload + '.' + encodedSignature;
  Qualtrics.SurveyEngine.setEmbeddedData('JWT', jwt);

});


Leave a Reply