Encoding JWT token with public and private keys

I am trying to get encoded JWT (https://jwt.io/) token from the decoded inputs (RS256 algorithm) from https://jwt.io/. Issue is that I have public and private keys but I am not sure how to use them in javascript for encoding. I am using crypto.js along with base64, but how do I add the public and private keys while encoding so that I get the encoded token?

<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/crypto-js.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/hmac-sha256.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/crypto-js/3.1.9-1/enc-base64.min.js"></script>

<script>

    // The header typically consists of two parts: 
    // the type of the token, which is JWT, and the signing algorithm being used, 
    // such as HMAC SHA256 or RSA.
    const header = {
        "alg": "RS256",
        "kid": "vpaas-magic-cookie-SecretKey/da330b",
        "typ": "JWT"
    }
    const encodedHeaders = btoa(JSON.stringify(header))


    // The second part of the token is the payload, which contains the claims.
    // Claims are statements about an entity (typically, the user) and 
    // additional data. There are three types of claims: 
    // registered, public, and private claims.
    const claims = {
        "aud": "jitsi",
        "exp": 1620649654,
        "nbf": 1620642449,
        "iss": "chat",
        "room": "*",
        "sub": "vpaas-magic-cookie-SecretKey",
        "context": {
            "features": {
                "livestreaming": true,
                "outbound-call": true,
                "transcription": true,
                "recording": true
            },
            "user": {
                "moderator": true,
                "name": "userName",
                "id": "AuthenticationID",
                "avatar": "",
                "email": "userEmail"
            }
        }
    }

const encodedPlayload = btoa(JSON.stringify(claims))

var privateKey = "./privateKey.pk";
var publicKey = "./publicKey.pub";

</script>

That should be happening on server-side, signing tokens on the client side means that everyone has access to your private key, which is not the goal of jwt.

@damencho then how do I get the encoded token? Since the token expires every 2 hours. I would like to generate it in the code itself.

You need a serverside logic that does that and pass it to the client.