最近移动端界面给后台传数据时用到Blob,它可以看做是存放二进制数据的容器;

//上传图片数据封装
function uploadPhotoData(data,fileName){
var imgArray = new Array();
if(data == null || data == ""){
return null;
}
var img = {
fileName: encodeURI(fileName, "UTF-8"),
fileStr: data
};
imgArray[0] = img;
var blob = new Blob([JSON.stringify(imgArray).toString()], {
type: 'text/plain'
});
return blob;
}

其中encodeURI(fileName, "UTF-8")是将fileName转码为UTF-8,防止乱码;JSON.stringify(imgArray).toString()是将imgArray数组转化为json字符串。

前端Blob对象的使用的更多相关文章

  1. 【前端知乎系列】ArrayBuffer 和 Blob 对象

    本文首发在 个人博客 更多丰富的前端学习资料,可以查看我的 Github: <Leo-JavaScript>,内容涵盖数据结构与算法.HTTP.Hybrid.面试题.React.Angul ...

  2. 前端H5中JS用FileReader对象读取blob对象二进制数据,文件传输

    HTML5中的Blob对象只是二进制数据的容器,本身并不能操作二进制,故本篇将对其操作对象FileReader进行介绍. FileReader FileReader主要用于将文件内容读入内存,通过一系 ...

  3. 搞懂前端二进制系列(一):🍇 认识Blob对象

    参考资料: https://juejin.cn/post/6844904183661854727 [你不知道的Blob] https://juejin.cn/post/6844904144453517 ...

  4. [HTML5] Blob对象

    写在前面 本篇主要总结Blob对象属性及作用,通过DEMO介绍Blob对象的应用场景. Blob对象 一直以来,JS都没有比较好的可以直接处理二进制的方法.而Blob的存在,允许我们可以通过JS直接操 ...

  5. mybatis存取blob对象+@Cacheable实现数据缓存

    参考文档: http://www.ibm.com/developerworks/cn/opensource/os-cn-spring-cache/ 需求场景: 当前业务通过第三方接口查询一个业务数据, ...

  6. Vue通过Blob对象实现导出Excel功能

    不同的项目有不同的导出需求,有些只导出当前所显示结果页面的表格进入excel,这个时候就有很多插件,比如vue-json-excel或者是Blob.js+Export2Excel.js来实现导出Exc ...

  7. JavaScript 中 Blob对象的初步认识

    Blob Binary Large Object的缩写,二进制大对象 虽然在前端中开发并不常见,但是实际上MySql数据库中,可以通过设置一个Blob类型的数据来存储一个Blob对象的内容 语法 le ...

  8. JavaScript把项目本地的图片或者图片的绝对路径转为base64字符串、blob对象在上传

    主题: JavaScript把项目本地的图片或者图片的绝对路径转为base64字符串.blob对象在上传. 用处: 从本地选择图片上传,如项目规定只能选择本项目文件夹下的图像上传为头像等. 主要思想: ...

  9. JS 之Blob 对象类型

    原文 http://blog.csdn.net/oscar999/article/details/36373183 什么是Blob? Blob 是什么? 这里说的是一种Javascript的对象类型. ...

随机推荐

  1. 【2018.06.26NOIP模拟】T2号码bachelor 【数位DP】*

    [2018.06.26NOIP模拟]T2号码bachelor 题目描述 Mike 正在在忙碌地发着各种各样的的短信.旁边的同学 Tom 注意到,Mike 发出短信的接收方手机号码似乎都满足着特别的性质 ...

  2. Vim-Go环境搭建

    Vim-Go环境搭建 https://www.cnblogs.com/qcloud1001/p/10072325.html https://www.cnblogs.com/chris-cp/p/584 ...

  3. 51nod 1019 逆序数

    在一个排列中,如果一对数的前后位置与大小顺序相反,即前面的数大于后面的数,那么它们就称为一个逆序.一个排列中逆序的总数就称为这个排列的逆序数. 如2 4 3 1中,2 1,4 3,4 1,3 1是逆序 ...

  4. ThinkPHP5 使用create 获取表单所有字段

    TP5没有 TP3的那个create创建表单字段,如果字段太多,写起来是非常麻烦 只需要在 框架里面 think/db/Query.php 里面加上函数 public function create( ...

  5. CnetOS7使用yum方式安装nginx

    之前一直使用源码包安装,但是对于需要一直进行重新安装的测试环境来说安装起来还是过于麻烦了.今天搜索发现能够进行yum方式的安装,特此记录. 新建yum文件,yum源是nginx的官网. # vim / ...

  6. python read txt file

    refer to: http://www.jianshu.com/p/d8168034917c http://www.liaoxuefeng.com/wiki/001374738125095c955c ...

  7. python 有关引用的一些问题

    python 有关引用的一些问题 print id.__doc__ ​ id(object) -> integer Return the identity of an object. This ...

  8. 搭建一个IntelliJ的Spark项目

    之前发现创建一个新项目之后,无法添加scala class 创建新项目 选择maven项目,然后选择simple或者quickstart: 进入项目后,在Project Structure里面,在gl ...

  9. linux 下apache 停止、重启等操作

    基本的操作方法:本文假设你的apahce安装目录为/usr/local/apache2,这些方法适合任何情况 apahce启动命令:推荐/usr/local/apache2/bin/apachectl ...

  10. 与FPGA相关的独热码

    独热码在状态机里面使用比价广泛,这一块有些人爱用,有些人嫌烦,有时候可以用用格雷码跳转,不过格雷码只支持那种一步到底的,中间有分支就不好做了,所以后来还是回到了独热码的正道上. 说白了独热码的使用,在 ...