How to hide secret keys from users?

@Saifylis In case you’re wondering, I found another solution.

You can generate signed jwt (json web token) inside the Figma Plugin API context. You can use secrets because this code is not visible to the user.

Example of code for generating a token:

import { addDays } from 'date-fns'
import jws from 'jws'

import { AUD, ISSUER, SECRET } from '../constants'

export async function generateToken() {
  const token = await signToken(
    {
      iss: ISSUER,
      sub: figma.currentUser?.id || null,
      aud: AUD,
      name: figma.currentUser?.name || null,
      // @NOTE: session id
      sid: figma.currentUser?.sessionId.toString() || null,
      // @NOTE: session color
      sc: figma.currentUser?.color || null,
      iat: Math.floor(new Date().getTime() / 1000),
      exp: Math.floor(addDays(new Date(), 1).getTime() / 1000),
    },
    SECRET
  )
  return token
}

function signToken<T>(payload: T, secret: string): Promise<string> {
  return new Promise<string>((resolve, reject) => {
    jws
      .createSign({
        header: {
          alg: 'HS256',
          typ: 'JWT',
        },
        privateKey: secret,
        payload,
        encoding: 'utf-8',
      })
      .once('error', reject)
      .once('done', resolve)
  })
}

And then you can include this information in all queries as a Bearer token within your UI context.

const token = await figmaService.generateToken()

await fetch(url, {
  method: 'POST',
  headers: {
    Authorization: `Bearer ${token}`
  }
})

Remember to verify the token on the backend with jws.verify(token).