在从 Base64 字符串 javascript 创建的图像文件中添加元数据

use*_*475 5 javascript base64 file amazon-s3 angularjs

我有一个现有代码,可将 base64 字符串转换为相应的图像文件。现在,我想添加一些元数据,例如上次修改日期、摄影师、版权、学分等。下面尝试过,但没有成功。有没有办法添加元数据?

这里的base64Source是我从中获取base 64内容的dataUri。

function (base64Source, name) {
        var base64Content = base64Source.substr(base64Source.indexOf(',') + 1);

        var byteString = window.atob(base64Content);
        var ia = new Uint8Array(byteString.length);
        for (var i = 0; i < byteString.length; i++) {
            ia[i] = byteString.charCodeAt(i);
        }

        var file = new Blob([ia], {type: 'image/jpeg'});
        return new File([the_file], name);
    };
Run Code Online (Sandbox Code Playgroud)

我将这段代码修改为

function (base64Source, name) {
        var base64Content = base64Source.substr(base64Source.indexOf(',') + 1);

        var byteString = window.atob(base64Content);
        var ia = new Uint8Array(byteString.length);
        for (var i = 0; i < byteString.length; i++) {
            ia[i] = byteString.charCodeAt(i);
        }

        var file = new Blob([ia], {type: 'image/jpeg'});
        return new File([the_file], name,{
            lastModified: new Date().getTime(), 
            tooltip : 'test tooltip',
            caption : 'test caption',
            copyright : 'Test',
            credits : 'Test'
        });
    };
Run Code Online (Sandbox Code Playgroud)

Kai*_*ido 1

这些元数据应该是文件数据本身的一部分。

javascript File 对象不会更改文件的数据(除了File 继承的Blob 构造endings函数的 EOL 选项) 。

因此,您必须实际修改文件的数据(即iaArrayBuffer 中包含的字节)。

您执行此操作的方式取决于您正在处理的图像类型。不同的图像格式对于它们可以接受哪些元数据以及如何将其存储在文件中具有不同的规则。

例如,对于 JPEG 文件、TIFF 和 webp 格式,通常将其放在EXIF数据中,存储在应用程序段中,可通过0xFFE1JPEG 标记进行识别。webpchunkHeader('EXIF'). 他们也都支持XMP
PNG 还允许一些文本信息元数据。

其他文件格式可能支持其他元数据格式,并且为您编写通用编码器将是......一项非常艰巨的工作。

但确实存在一些适用于最常见格式的库(使用您最喜欢的网络搜索工具可以轻松找到 JPEG 的 EXIF 库)。