file对象转blob对象进行预览的实例代码

2022-10-22实例代码
204

file对象转blob对象进行预览的实例代码:
//获取到 file文件
var reader = new FileReader();
reader.readAsArrayBuffer(file);
reader.onload = function (event) {
  let blob = new Blob([event.target.result], { type: file.type });
   //{ type: file.type } 预览blob发现乱码可能是type不对  要获取file文件的type
  window.URL = window.URL || window.webkitURL;
  let blobURL = window.URL.createObjectURL(blob);
  //blobURL 就是需要的blob预览路径
  //下面是获取图片的大小
  var img = new Image(); 
  img.src = blobURL;
  if (img.complete) {
	console.log(img, img.width, img.height)
  } else {        
	img.onload = function () {
	  console.log(img, img.width, img.height)
	}
 }
}
 
The End
预览 file

相关推荐

input file上传图片设置的实例代码
input file上传图片设置的实例代码 div纯input与type/div input type="file" div指明需要图片/div input type="file" accept='image/*' div指明需要多张图片/div input type="file" multiple accept='image/*' div指明调用摄像头获取图片/div input type="fil...
2024-12-30 实例代码
133

php将base64编码转换为图片保存至指定位置
$base64为图片的编码字符串 preg_match('/^(data:\s*image\/(\w+);base64,)/', $base64, $result);$type = $result[2]; //获取图片的类型jpg png等$name = ”xxxx".".$type; //图片重命名$savepath = ‘C:/'.$name; //图片保存目录file_put_contents($savepat...
2024-12-28 实例代码
152

php使用curl模拟post传输文件的实例代码
文件发送的代码如下: ?$url = 'http://127.0.0.1/fujian/jieshou.php'; // 目标URL$filePath2 = iconv("utf-8","gb2312",'D:/MYOA/webroot/fujian/1/副本.txt'); // 文件路$filePath1 = iconv("utf-8","gb2312",'D:/MYOA/webroot/fujian/1/1.txt'); // 文件...
2024-11-01 实例代码
212

php读写json文件及修改json方法
本文主要和大家分享一篇php 读写json文件及修改json的方法,具有很好的参考价值,希望能帮助到大家。实例代码如下: //追加写入用户名下文件$code="001";//动态数据$json_string=file_get_contents("text.json");//从文件中读取数据到PHP变量$data=json_decod...
2024-10-17 实例代码
84

layui使用tips鼠标悬停提示语的实例代码
layui使用tips鼠标悬停提示语的实例代码,具体代码如下,有三种方式: !DOCTYPE htmlhtml lang="zh" head meta charset="UTF-8" title测试-liu 劉/title/headscript src="https://cdn.staticfile.org/layui/2.7.6/layui.js"/scriptscript src="https://code.j...
2024-08-02 实例代码
258

layui点击图片实现预览功能
layui点击图片实现预览功能,要怎么实现呢? HTML内使用代码: img src="..." alt="..." width="200px" height="200px" class="layui-upload-img" onclick="previewImg(this)" JS代码部分: function previewImg(obj) { var img = new Image(); img.src = obj...
2024-07-18 实例代码
678