如何在Javascript中从任何图像类型的base64字符串中去除"data:image"部分?

27

我目前正在使用以下方法在Javascript中解码base64图像:

    var strImage = "";
    strImage = strToReplace.replace("data:image/jpeg;base64,", "");
    strImage = strToReplace.replace("data:image/png;base64,", "");
    strImage = strToReplace.replace("data:image/gif;base64,", "");
    strImage = strToReplace.replace("data:image/bmp;base64,", "");

如上所述,我们正在接受四种最常见的图像类型(jpeg、png、gif、bmp);

但是,其中一些图像非常大,在每个图像上执行4-5次替换似乎是一种可怕的浪费和极其低效的做法。

是否有一种方法可以在单次处理中可靠地剥离base64图像字符串的"data:image"部分?

也许通过检测字符串中的第一个逗号?

提前感谢。

7个回答

72
您可以使用正则表达式:

您可以使用正则表达式:

var strImage = strToReplace.replace(/^data:image\/[a-z]+;base64,/, "");

  • ^ 表示 字符串的开头
  • data:image 表示 data:image
  • \/ 表示 /
  • [a-z]+ 表示 a到z之间一个或多个字符
  • ;base64, 表示 ;base64,

2
我不知道这是否更有利于性能,但从逻辑上讲,我会说“是的”(replace和正则表达式在整个字符串中搜索匹配项,而indexof在第一个等于其参数的字符处中断),也许我会进行一些性能测试:var strImage = strToReplace.Substring(strToReplace.IndexOf(',')+1); - Sycraw
strToReplace.replace(/^data:image\/\w+;base64,/, "") - Anthony Awuley

34
var solution = string.split("base64,")[1];

将变量字符串在“base64,”处分割,然后取第二部分。


1
我不明白为什么这么多被接受的答案都有奇怪的正则表达式解决方案。这个很容易理解并且执行非常快。有什么缺点吗? - Joshua Ohana
5
如果编码字符串中还有另一个"base64"的话,那么是有的......否则我不知道了。 - Jonas Wilms
这是不可能的。, 不是一个有效的 base64 编码字符。 - undefined

6
这对我有用:

这对我有用:

var strImage = strToReplace.split(',')[1];

1

我在寻找一种去除任何标题的方法时遇到了这个问题。所以想分享一下:

Regex.Replace(strToReplace, @"^.+?(;base64),", string.Empty))

我从一个优秀的答案中得到了这个内容,它描述了如何:

匹配任意字符,尽可能少地匹配,直到找到“abc”,但不计算“abc”。


我喜欢这个替换答案,因为它不仅可以处理任何文件类型,而且如果你传递的是没有以"data:"为前缀的base64字符串,它也不会出错:file.base64.replace(/^.+?(;base64),/, '') - Titan

0
使用这个正则表达式。
/[data:image\/[a-z]*;[a-z0-9]*,.*]/gm

-1

你可以使用startWith,这样就不必扫描所有对象。它的性能应该会更好。


-1

这对我在Swift 5中有效:

let ourBase64String:String = "base64 string"
let base64StringArray:[String] = ourBase64String.components(separatedBy: "base64,")
if(attachmentArray.count > 0){
   print(attachmentArray[1])
}

网页内容由stack overflow 提供, 点击上面的
可以查看英文原文,
原文链接