javascript直接把base64的字符串转换成图片显示在网页上的方法

最新推荐文章于 2023-06-12 18:57:10 发布
最新推荐文章于 2023-06-12 18:57:10 发布
阅读量3k 收藏 4
点赞数
分类专栏： JavaScript 文章标签： javascript ViewUI 
<!DOCTYPE html>
<html>
<head>
  <title></title>
  <script type="text/javascript" src="http://su.bdimg.com/static/superplus/js/lib/jquery-1.10.2_d88366fd.js"></script>
  <script type="text/javascript">
    $(function() {
      var img_str = "iVBORw0KGgoAAAANSUhEUgAAAAUAAAAFCAYAAACNbyblAAAAHElEQVQI12P4//8/w38GIAXDIBKE0DHxgljNBAAO9TXL0Y4OHwAAAABJRU5ErkJggg=="
      $("#img").attr("src", "data:image/png; base64," + img_str);
    });
  </script>
</head>
<body>
  <img id="img" src="">
</body>
</html>

 

wudixiaotie
关注
  • 0
    点赞
  • 踩
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
vue项目base64字符串转图片的实现代码
10-18
在Vue项目中，将Base64字符串转换为图片是一种常见的需求，这通常涉及到前端与后端的数据交互。本文将详细讲解如何实现这一功能，并提供相关的Vue代码示例以及后端处理Base64字符串的方法。 首先，让我们从Vue组件...
js通过base64编码显示图片
懒虫翻身的博客
06-27 3万+
js通过base64编码显示图片 base64简单地说，它把一些 8-bit 数据翻译成标准 ASCII 字符，我们把图像文件的内容直接写在了HTML 文件中，这样做的好处是，节省了一个HTTP 请求Data URI scheme。 Data URI scheme是在RFC2397中定义的，目的是将一些小的数据，直接嵌入到网页中，从而不用再从外部文件载入。 Data URI sche...
【Vue2 + HBuilder】Base64码转为图片，并预览
weixin_47375144的博客
03-16 6157
uni.previewImage参数为base64类型图片预览
js如何显示base64格式图片
MYG_G
06-18 4696
解决方法 // v.img是指base64格式的图片数据流 <img src={`data:;base64,${v.img}`} />
【JS】前端base64转图片File对象
最新发布
此人太懒，没有任何简介
06-12 1万+
【JS】前端base64转图片File对象
js将文件转为base64，base64转为图片显示
qq_43082438的博客
05-17 4888
看了其他人文章，没用的代码贴上一大堆，也是服了，我就想看个js将文件转base64。。。太难了，所以自己整个帖子做下笔记1. js文件转base64 let reader = new FileReader(); reader.readAsDataURL(file); //将文件读取为 DataURL,也就是base64编码 reader.onload = function(ev) { //文件读取成功完成时触发 var dataURL = ev.target.resu
js实现把图片的绝对路径转为base64字符串、blob对象再上传
01-19
JavaScript把项目本地的图片或者图片的绝对路径转为base64字符串、blob对象在上传。 用处： 从本地选择图片上传，如项目规定只能选择本项目文件夹下的图像上传为头像等。 主要思想： 使用canvas.toDataURL()方法将...
JavaScript将base64图片转换成formData并通过AJAX提交的实现方法
11-26
这些图片通常以Base64编码的形式存在，适合在HTML中直接显示。然而，当需要将这些图片上传到服务器时，服务器通常期望接收标准的文件形式，即通过`<form>`元素的`<input type="file">`字段提交的文件。为了解决这个...
js对图片base64编码字符串进行解码并输出图像示例
12-12
在本示例中，我们讨论的是如何使用JavaScript对基于Base64编码的图片进行解码并显示在网页上。Base64是一种用于将二进制数据编码为ASCII字符串的编码方式，它在传输或存储非文本数据时非常有用，例如图片。 在HTML...
Java将二进制流转Base64字符串并在页面显示（附Base64转二进制流）
热门推荐
QC班长的博客
08-12 3万+
Java将二进制流转Base64字符串并在页面显示（附Base64转二进制流）    java代码如下：  /**      * 二进制流转Base64字符串      *      * @param data 二进制流      * @return data      * @throws IOException 异常      */     public static Stri
js加载base64图片
08-12
js加载base64图片js加载base64图片js加载base64图片js加载base64图片
js实现base64格式编码图片（通俗，易懂）
m0_59722204的博客
01-27 2408
以base64编码图片格式
js显示byte[] 转 Base64 编码显示图片
weixin_44088274的博客
12-14 5209
背景 项目中经常会用到页面显示图片的功能，比如前端接收后台传输的数据是 byte[] 类型的数据，这时我们可以转成 Base64编码的图片再进行显示。 byte[] 转 Base64 编码 private arrayBufferToBase64(buffer) { let binary = ""; const bytes = new Uint8Array(buffer); const len = bytes.byteLength; for (let i = 0; i < len;
JS前端网页选择图片后，将其图片转换成Base64编码并展示预览
彭珂个人网的博客
07-27 1万+
这篇文章也是和以前一样哈，网上很多你可能试过了，那就看这篇啦！ 1.这是我前端的代码，有一个img标签，用来显示图片用的，还有一个 input type是file的输入框，其实就是选择图片的： <div class="layui-form-item"> <label class="layui-form-label">专题图片</label>...
JS 使用base64显示图片
这就是快乐嘛
05-23 1780
data:, 文本数据 data:text/plain, 文本数据 data:text/html, HTML代码 data:text/html;base64, base64编码的HTML代码 data:text/css, CSS代码 data:text/css;base64, base64编码的CSS代码 data:text/javascript, Javascript代码 data:text/javascript;base64, base64编码的Javascript代码 data:image/gif;b
base64格式图片直接显示
qq_34907249的博客
02-08 6786
<img :src="'data:image/png;base64,'+url"/>
java 图片Base64转成文件流，直接在浏览器访问图片
hengliang_的博客
04-25 1万+
因为业务，需要把图片base64转成文件流，然后直接在浏览器访问就可以看见图片 /** * 回显图片 * @author liuhengliang * @return ModelAndView */ @RequestMapping(value = "/image") private void getImageById(Htt...
javabase64图片转文件流输出
宇宙的黑洞
04-08 1万+
package com.wisesoft.cform.web.controller; import java.awt.image.BufferedImage; import java.io.FileInputStream; import java.io.IOException; import java.io.InputStream; import java.io.OutputStream; im...
nodejs base64字符串转成图片文件
06-07
将 base64 编码的字符串转换为图片文件需要先将其解码为二进制数据，然后再将二进制数据写入到文件中。以下是使用 Node.js 实现将 base64 编码的字符串转换为图片文件的示例代码： ```javascript const fs = ...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值