当前位置：文江博客话题详情

数据 uri's - Base 64 编码。你能用 javascript 自动完成吗？

发布于 2024-12-05 05:16:28 字数 179 浏览 1 评论 0原文

我有一个关于图像的 Base64 编码的问题。我使用 base64 来处理小背景图像。我用在线base64工具转换它。并直接放入CSS文件中。

但有没有办法。 Base64 编码自动进行。当我将文件上传到服务器或运行网站时。然后是CSS中的小背景图片。自动转换为 base64 编码。你明白吗？？

感谢您的帮助！

原文

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

多情出卖 2024-12-12 05:16:28

嗯，我不确定我是否完全理解你的问题。但是，元素提供了一个名为 的函数。 toDataURL()^help，它将节点中的内容转换为 Base64 编码的字符串。但我想这对你的情况来说没有多大意义。

window.btoa() 的情况相同。您需要将图像传输到客户端，然后进行转换，这没有任何意义。因此，您需要一个在服务器上运行并将图像作为 base64 传输的工具/脚本。你猜怎么着，它确实存在。

supplyJS

使用 SupplyJS，您可以创建一个类似的调用，

supply.listen('image/jpg', function(payload, filename) {
    jQuery('<img>', {
        src: 'data:image/jpeg;base64,' + payload
    }).appendTo(document.body);
});

supply.setDealer('/cgi-bin/supply.pl').files({
    images: [
        '/images/foo.jpg',
        '/images/bar.jpg',
        '/images/another.jpg'
    ]
});

它会将所有图像本机转换为 Base64 来传输它们。

示例： http://www.typeofnan.com/lab/mxhr-stream/

Well, I'm not sure if I exactly understand your question. However, the <canvas> element offers a function named .toDataURL()^help, which converts the contents from the <canvas> node into a Base64 encoded string. But that does not make much sense in your case anyway I guess.

Same story for window.btoa(). You would need to ordinary transfer the images to the client and then converting them, which does not make any sense. So you would need a tool/script which runs on the server and transfers images as base64. And guess what, it exists.

supplyJS

Using supplyJS, you could create a call like

supply.listen('image/jpg', function(payload, filename) {
    jQuery('<img>', {
        src: 'data:image/jpeg;base64,' + payload
    }).appendTo(document.body);
});

supply.setDealer('/cgi-bin/supply.pl').files({
    images: [
        '/images/foo.jpg',
        '/images/bar.jpg',
        '/images/another.jpg'
    ]
});

It will natively convert all images into base64 to transfer them.

Example: http://www.typeofnan.com/lab/mxhr-stream/

回复收藏 0 原文

~没有更多了~