Javascript对象中的访问键

Question

我有一个iframe，我正在向其中发送一个包含id_token和access_token的数据对象。数据对象可以正常到达，我可以使用事件侦听器拉出对象。示例代码如下。但是，当我收到对象时，我尝试访问该对象中的项目并得到未定义的信息。我已经在JavaScript控制台中收到了该对象的模糊图像。

我收录了我尝试过的各种尝试的片段，但无济于事。

显示iframe

const data = {
    id_token: idToken,
    access_token: accessToken
};

iframe中正在显示的应用程序

useEffect(() => {
  window.addEventListener('message', receiveMessage, false);

  function receiveMessage(event) {
    if (event.origin !== 'https://example.com") {
      return;
    }

    let eventData = event.data;
    console.log(eventData); // The response is the object that is returned in the image below
    console.log(eventData.id_token) // The response is undefined
    console.log(eventData[id_token]) // undefined
    console.log(eventData["id_token"] // undefined
    console.log(eventData['"id_token"'] // undefined

    // All three of these displayed each individual character of the object.
    Object.keys(eventData).forEach(key => console.log(key, eventData[key]));

    Object.getOwnPropertyNames(eventData).forEach(key =>
      console.log(key, eventData[key])
    );

    for (let key in eventData) console.log(key, eventData[key]);
  }
}, []);

基本上，我需要提取访问和ID令牌进行身份验证。如果有更好的方法可以做到这一点，那么我会不知所措。

正在返回的对象的屏幕快照：

Answer 1

从Java的请求或事件接收“对象”时，很容易将JSON表示法中的对象的字符串序列化形式的实际对象弄错。

如示例所示，很难确定登录到控制台时哪个是哪个，但如图所示，浏览器工具会更有用。

如果您需要将JSON转换回对象，请使用JSON.parse()并处理所有异常。

obj = {a:100}
json = JSON.stringify(obj);

// print an object
console.log('Printing an Object:')
console.log(obj)

// print json
console.log('Printing a JSON string:')
console.log(json)