2

I tried to get the image from clipboard when I press ctrl+v on a page, with the code from a gist, which will console.log the image content it gets.

I found the image content is a long base64 string with a special prefix:

data:image/png;base64,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

How to decode it to binary? I tried to remove the prefix data:image/png;base64, and use a base64 library to decode the rest into binary, and save it to a image.png file. But the file can't be displayed, with invalid format error.

But if I paste the whole string to http://base64online.org/decode/, it can play the image as well.

The base64 library I used is https://github.com/wstrange/base64, and my code is:

import 'package:base64_codec/base64_codec.dart';

var body = /* the long str above */;

var prefix = "data:image/png;base64,";
var bStr = body.substring(prefix.length);
var bs = Base64Codec.codec.decodeList(bStr.codeUnits);
var file = new File("image.png");
file.writeAsBytesSync(bs);

I don't know where is wrong :(

4

3 回答 3

4

尝试使用cryptoDart SDK 中的包。这会创建一个可以正常打开的 image.png(我相信是这张图片... 在此处输入图像描述

library foo;

import 'package:crypto/crypto.dart';
import 'dart:io';

void main() {

  var body = "data:image/png;base64,iVBORw0KGgoAAAANSUh... snip"; 
  var prefix = "data:image/png;base64,";
  var bStr = body.substring(prefix.length);
  var bytes = CryptoUtils.base64StringToBytes(bStr); // using CryptoUtils from Dart SDK
  var file = new File("image.png");
  file.writeAsBytesSync(bytes);
}  

您需要添加crypto到您的pubspec.yaml

dependencies:
  crypto: any

链接在https://github.com/wstrange/base64的库,也在 README 中注明:

已弃用

注意:Dart SDK 现在包含一个带有 url 安全选项的 Base64 编解码器。除非您需要流式传输支持,否则您应该使用 SDK 方法,因为它们的速度稍快一些。

请参阅 CryptoUtils

另请参阅如何本地转换字符串 -> base64 和 base64 -> 字符串

于 2013-07-17T14:19:47.807 回答
3

解码为字符串然后写入字节有效:

var prefix = "data:image/png;base64,";
var bStr = body.substring(prefix.length);
var bs = Base64Codec.codec.decodeString(bStr);
var file = new File("image.png");
file.writeAsBytesSync(bs.codeUnits);
于 2013-07-17T14:27:40.890 回答
1

最简单的方法是:

import 'dart:convert';

final result = base64Decode(stringValue);
于 2020-05-05T10:49:25.500 回答