如何提取base64图片的图像数据进行修改并还原为base64格式？

方案1：修改后拼接回标准base64图片格式 #

修改完剥离前缀的图像数据后，把原图片的类型前缀拼接回去即可生成合法的base64图片链接，可选择直接覆盖原变量实现originalImage的更新，示例代码：

let originalImage = myBase64Image
// 匹配前缀同时保留前缀完整内容
const imgPrefix = originalImage.match(/^data:image\/[a-z]+;base64,/)[0]
let strImage = originalImage.replace(/^data:image\/[a-z]+;base64,/, "")

// 此处添加你对strImage的修改逻辑
// strImage = 处理后的图像base64数据

// 拼接回完整格式并覆盖原变量
originalImage = imgPrefix + strImage

方案2：直接替换原字符串的图像数据部分 #

不需要单独拆分变量，直接替换原base64字符串中前缀后的内容即可：

let originalImage = myBase64Image
// 拆分前缀和原数据
const [prefix, rawData] = originalImage.split(',')
let modifiedRawData = rawData

// 此处添加你对modifiedRawData的修改逻辑
// modifiedRawData = 处理后的图像base64数据

// 直接覆盖原变量
originalImage = `${prefix},${modifiedRawData}`

注意事项 #

• 修改后的图像数据必须是合法的base64格式字符串，否则最终生成的图片无法正常解析
• 如果需要调整图片格式，只需修改前缀中的类型标识即可，例如把data:image/png;base64,改为data:image/jpeg;base64,，对应使用jpeg格式的base64数据即可

内容的提问来源于stack exchange，提问作者Jip Helsen