Ajax: JSONを中身を参照することができない

Question

ajaxをrailsで実現させようとしています。
サーバー側から受け取ったdataの中身を参照したいのですが、上手く取り出すことができません。。

data(長すぎるので冒頭のみ)

{body: "{"roles":{"1":{"settlor":{"generation":"1"},"trust…0:54:09.948+09:00","status":"free","family_id":1}"}
body: "{\"roles\":{\"1\":{\"settlor\":{\"generation\":\"1\"},\"trustee\":{\"generation\":\"1\"},\"beneficiary\":{\"generation\":\"1\"}},\"2\":{\"beneficiary\":{\"generation\":\"3\"}},\"3\":{\"beneficiary\":{\"generation\":\"4\"}}},\"id\":2,\"customer_id\":3,\"operator_id\":1,\"richmenu_id\":1,\"is_in_effect\":null,\"params_json\":null,\"trust_agreement_document_json\":null,\"created_at\":\"2021-04-22T12:05:21.589+09:00\",\"updated_at\":\"2021-05-04T10:54:09.948+09:00\",\"status\":\"free\",\"family_id\":1}"
__proto__:
constructor: ƒ Object()
hasOwnProperty: ƒ hasOwnProperty()
~

console.log(JSON.stringify(data));

{"body":"{\"roles\":{\"1\":{\"settlor\":{\"generation\":\"1\"},\"beneficiary\":{\"generation\":\"1\"}},\"2\":{\"beneficiary\":{\"generation\":\"3\"}},\"3\":{\"beneficiary\":{\"generation\":\"4\"}}},\"id\":2,\"customer_id\":3,\"operator_id\":1,\"richmenu_id\":1,\"is_in_effect\":null,\"params_json\":null,\"trust_agreement_document_json\":null,\"created_at\":\"2021-04-22T12:05:21.589+09:00\",\"updated_at\":\"2021-05-04T10:59:30.225+09:00\",\"status\":\"free\",\"family_id\":1}"}

railsでいうとhashのような感じだと思うのですが、
例えば上記のroles['1']['settlor']を取り出したい時はどうすれば取り出せますか？
$(data.body).find('roles')
data['roles']['1']['settlor']
等いろいろ試してみたのですがどれもエラーになってしまい。。。

controller

~
respond_to do |format|
        format.json { render status: status, json: { body: body } }
      end

Answer 1

これでどうでしょう。

data['body']['roles']['1']['settlor']

Comments

[tarotarotarotar]

ありがとうございます！
Uncaught TypeError: Cannot read property '1' of undefined
と怒られてしまいます。
'1'はたしかに存在しているのですが、なぜでしょう・・・

[tarotarotarotar]

dataはオブジェクト型のjson?かなと思い、
data.body.roles
などとしてもエラーでした。。。

Answer 2

var data={"body":"{\"roles\":{\"1\":{\"settlor\":{\"generation\":\"1\"},\"beneficiary\":{\"generation\":\"1\"}},\"2\":{\"beneficiary\":{\"generation\":\"3\"}},\"3\":{\"beneficiary\":{\"generation\":\"4\"}}},\"id\":2,\"customer_id\":3,\"operator_id\":1,\"richmenu_id\":1,\"is_in_effect\":null,\"params_json\":null,\"trust_agreement_document_json\":null,\"created_at\":\"2021-04-22T12:05:21.589+09:00\",\"updated_at\":\"2021-05-04T10:59:30.225+09:00\",\"status\":\"free\",\"family_id\":1}"}
console.log(JSON.parse(data.body).roles[1].settlor);

Comments

[tarotarotarotar]

ありがとうございます！参照できました！