javascript - 获取对象中的 Base64 作为字符串

Question

我有一个问题，如何访问此对象数据并以 Base64 检索图像。我注意到它自己返回一个字符串

const data = {
  image:"{\"base64\":\"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\r\n\"}",
}

如果我这样做console.log(data.image)它会返回字符串本身，但我只想要base64字符串

Answer 1

(你必须要求后端开发人员最后删除\n\r，或者自己删除它)使用JSON.parse来解析data.image 并获取 base64 key :

const data = {
  image:"{\"base64\":\"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\"}",
}

const str = JSON.parse(data.image).base64

console.log(str);