JWT Cannot read Property 'split' of undefined

New post

April 15, 2020 06:40

Hi Everyone,

I'm trying to use the Node SDK for JWT Authentication in a React App (and using Webpack). I'm running into the exact same issue as described here:

https://github.com/box/box-node-sdk/issues/288

Since it looks like the Node SDK isn't supported running in a browser via webpack, I tried to do the auth without the sdk:

https://developer.box.com/guides/authentication/jwt/without-sdk/

However, I'm running into the same issue.

Any thoughts on how to resolve?

Comments

3 comments

jcleblanc

April 15, 2020 10:19
Hi ,

I would recommend taking a look at the community JavaScript SDK that's available, that might provide a solution for what you're trying to do.

Other than that, if you can supply the code for what you're trying to do and where you're getting the error then we can take a look to see what the issue might be.

Thanks,

Jon
0

Comment actions Permalink

andrewk26

April 18, 2020 12:24

Here is my code. First, I have my async function since we are using await:

async function authServiceCredentials(config_json)  {
        
    const config = config_json;
    let key = {
        key: config.boxAppSettings.appAuth.privateKey,
        passphrase: config.boxAppSettings.appAuth.passphrase
    };
    
    const crypto = require("crypto");

    const authenticationUrl = "https://api.box.com/oauth2/token";

    let claims = {
    iss: config.boxAppSettings.clientID,
    sub: config.enterpriseID,
    box_sub_type: "enterprise",
    aud: authenticationUrl,
    jti: crypto.randomBytes(64).toString("hex"),
    exp: Math.floor(Date.now() / 1000) + 45
    };

    const jwt = require('jsonwebtoken')

    let keyId = config.boxAppSettings.appAuth.publicKeyID

    let headers = {
    'algorithm': 'RS512',
    'keyid': keyId,
    }

    let assertion = jwt.sign(claims, key, headers)

    const axios = require('axios')
    const querystring = require('querystring');

    let accessToken = await axios.post(
    authenticationUrl,
    querystring.stringify({
        grant_type: 'urn:ietf:params:oauth:grant-type:jwt-bearer',
        assertion: assertion,
        client_id: config.boxAppSettings.clientID,
        client_secret: config.boxAppSettings.clientSecret
    })
    ).then(response => {return response.data.access_token})
    return accessToken

}

From there, parse my JSON credentials and call the function:

const config = JSON.parse(this.props.serviceCredsJSONStr);
return authServiceCredentials(config).then(response =>{                                                     console.log(response)}).catch(err =>console.log(err))

The error I am getting is as follows. It is getting tripped up at jwt.sign

TypeError: Cannot read property 'split' of undefined
    at decrypt (index.js:100)
    at parseKeys (index.js:53)
    at sign (sign.js:10)
    at Sign.signMethod [as sign] (index.js:41)
    at Object.sign (index.js:152)
    at Object.jwsSign [as sign] (sign-stream.js:32)
    at Object.JWT.sign (index.js:137)
    at _callee$ (BoxFileExplorer.js:167)
    at tryCatch (runtime.js:62)
    at Generator.invoke [as _invoke] (runtime.js:296)
    at Generator.prototype. [as next] (runtime.js:114)
    at step (BoxAuthServices.js:2)
    at BoxAuthServices.js:2
    at new Promise ()
    at BoxAuthServices.js:2
    at authServiceCredentials (BoxFileExplorer.js:131)
    at BoxFileExplorer.loadChildren (BoxFileExplorer.js:190)
    at loadChildren (index.js:64276)
    at TreeNode.onToggleClick (index.js:19859)
    at Object../node_modules/react-dom/lib/ReactErrorUtils.js.ReactErrorUtils.invokeGuardedCallback (ReactErrorUtils.js:70)

With the node sdk, the following is my code. I get the same error as above

var BoxSDK = require('box-node-sdk');                                      
var sdk = BoxSDK.getPreconfiguredInstance(JSON.parse(this.props.serviceCredsJSONStr)) 
var client = sdk.getAppAuthClient('enterprise')
client.folders.getItems('0').then(response => 
           {console.log(response)}).catch(err =>{console.log(err)})

Any thoughts? Both of these options work outside of my react app in a normal Node environment on my desktop.

jcleblanc

April 20, 2020 14:25
Hi ,

From the code sample that you posted it looks like you're using the crypto package, which is the problem that the issue you referenced referred to. If the issue is accurate what you can try first is to replace the crypto requirement with one that supports running in a browser via Webpack.

Here's a list of alternative crypto libraries. Specifically it looks like this library was built to specifically solve this issue, so give that a shot as a crypto replacement.

- Jon
0

Comment actions Permalink

Please sign in to leave a comment.