Read property from a Json object in typescript/javascript

Question

I am working with an auth token with I receive from a third-party API. I have given a sample of the decoded token below,

{
    "nbf": 1564128888,
    "exp": 1564132488,
    "iss": "http://example.com:5002",
    "aud": "http://example.com:5002/resources",

    "http://schemas.xmlsoap.org/ws/2005/05/identity/claims/emailaddress": "Micky@gmail.com",
    "http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name": "Micky Mouse",    
    "amr": ["custom"]
}

I am struggling to read the "name" claim in javascript. How can I read that property in javascript or typescript?

Could you clarify what you're trying to read? Is it that you need to find any keys that end in `/claims/name` and do something with their value? — GenericUser, Jul 28 '19 at 15:41
@GenericUser yes I am. Trying to read the name and do something with it. — Joshua, Jul 28 '19 at 15:45

score 2 · Accepted Answer · answered Jul 28 '19 at 15:42

You can access complex property names like this:

const name = token["http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name"]

You could also abstract this away for reusability (like the ClaimTypes in C#)

const ClaimTypes = {
  name: "http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name",
  // other relevant claims
};

const name = token[ClaimTypes.name];

score 2 · Answer 2 · answered Jul 28 '19 at 16:04

You will get your data in form of a string, convert it to json

let jsonData = '{"nbf": 1564128888,"exp": 1564132488,"iss": "http://example.com:5002","aud": "http://example.com:5002/resources","http://schemas.xmlsoap.org/ws/2005/05/identity/claims/emailaddress": "Micky@gmail.com","http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name": "Micky Mouse","amr": ["custom"]}'
let parsedJSON = JSON.parse(jsonData)
console.log(parsedJSON["http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name"]) // Micky Mouse
console.log(parsedJSON["nbf"]) // 1564128888
console.log(parsedJSON["http://schemas.xmlsoap.org/ws/2005/05/identity/claims/emailaddress"]) // Micky@gmail.com

And then read it like parsedJSON["your key"]. Things on the left sides are property names or keys. You can retrive them by

let jsonData = '{"nbf": 1564128888,"exp": 1564132488,"iss": "http://example.com:5002","aud": "http://example.com:5002/resources","http://schemas.xmlsoap.org/ws/2005/05/identity/claims/emailaddress": "Micky@gmail.com","http://schemas.xmlsoap.org/ws/2005/05/identity/claims/name": "Micky Mouse","amr": ["custom"]}'
let parsedJSON = JSON.parse(jsonData)
console.log(Object.keys(parsedJSON))

score 0 · Answer 3 · answered Jul 28 '19 at 15:49

JSON.parse(yourData) - convert JSON to JS JSON.stringify(yourData) - from JS to JSON

so after JSON.parse you will get JS object and able to get yourData.name

Here you can read: MDN: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/parse

you can try for example: https://jsonformatter.org/json-parser

Read property from a Json object in typescript/javascript

3 Answers3