Unable to Get Data from Tableau embedding v3 with JWT token

[saadbahir]

Hello

I am using tableau embedding v3 in JS with a generated JWT token but I am unable to retrieve the worksheet data. I pull the data using this piece of code

const worksheets = viz.workbook.activeSheet.worksheets
for (const worksheet of worksheets) {
  const tables = await worksheet.getUnderlyingTablesAsync()
  for (const table of tables) {
    const tableId = table.id
    console.log('table id', tableId)
    const dataTable = await worksheet.getUnderlyingTableDataAsync(
      tableId,
      options
    )
    console.log(dataTable)
  }
  break
}

But I encounter this error

WebCommandHandler: Command 'api-get-worksheet-logical-table-ids' (namespace: 'tabdoc') encountered error: 'api-get-worksheet-logical-table-ids: , status: 401, textStatus: error'

I generated the token using this method ​

export function getTableauToken(userName) {
  const header = {
    alg: 'HS256',
    kid: process.env.REACT_APP_CONNECTED_APP_SECRET_ID, // Tableau require it in header. Ref: https://help.tableau.com/current/online/en-us/connected_apps.htm
    // @ts-expect-error `iss` is needed as per Tableau docs but there is type mismatch as per `jsonwebtoken` library
    iss: process.env.REACT_APP_CONNECTED_APP_CLIENT_ID
  }
  console.log(header)
  const uuid = window.crypto.randomUUID()
  const token = sign(
    {
      scp: [
        'tableau:views:embed',
        'tableau:metrics:embed',
        'tableau:content:read',
        'tableau:views:embed_authoring'
        // 'tableau:workbooks:read',
        // 'tableau:datasources:*',
        // 'tableau:tasks:run'
      ] // scope
    },
    process.env.REACT_APP_CONNECTED_APP_SECRET_VALUE,
    {
      audience: 'tableau', // must be 'tableau'
      subject: userName, // Username as per Tableau platform
      issuer: process.env.REACT_APP_CONNECTED_APP_CLIENT_ID, // Tableau require it in header, but there is no attribute in header for 'issuer', so added here.
      jwtid: uuid, // The JWT ID claim provides a unique identifier for the JWT
      expiresIn: 600, // 10 minutes (max limit set by Tableau)
      header
    }
  )
  return token
}

​I added a connected app with unrestricted embedding and I have generated the token associated with the admin user.

When I disable the token prop from the tableau-viz container, I complete the authentication using the Tableau sign-in prompt and I am able to get the data with the same JS code above

Am I missing any specific scope?

Thank you

Saad