1.前段代码

<el-form-item label="证件照片" prop="idImage">
<input @change='ss' type="file">
</el-form-item>

2.script代码

ss(event){
var reader =new FileReader();//创建读取文件的方法
var img1=event.target.files[];
reader.readAsDataURL(img1);//将文件已url的形式读入页面
var that=this;
reader.onload=function(e){
that.ruleForm.idImage= reader.result; //把图片的二进制流付给表单ruleForm里面的idImage }
// console.log();
},

3.我的后端用的是koa2

用的是fs模块写入

var base64Data = (ctx.request.body.idImage).replace("data:image/jpeg;base64,", " ");//如果是express框架的话只需要换成req.body.idImage
console.log(base64Data);
var binaryData = new Buffer(base64Data, "base64").toString("binary");
fs.writeFile("out.png", binaryData, "binary", function(err) {
if (err) {
console.log(err);
}
});

vue 上传二进制图片的更多相关文章

  1. 基于vue上传base64图片,通过canvas压缩base64

    其实和vue关系不大,和我们之前做上传压缩性质是一样的 当然下面的代码是没有处理ios横屏拍照的bug的 有兴趣的可以多搜一下  网上都有相应的解答 .. var that = this if (e. ...

  2. 上传base64图片到七牛云前端遇到的坑

    介意前端普通引入七牛云SDk上传图片到七牛云需要多个js,所以才有了base64的上传方式,简化操作,(懒.) 七牛云官方文档如下 https://developer.qiniu.com/kodo/k ...

  3. vue中el-upload上传多图片且携带参数,批量而不是一张一张的解决方案

    现在前端基本不是vue技术栈就是react技术栈. vue技术栈最常用的就是element-ui的ui框架了. 在项目中,我们经常会碰到这种需求:批量上传文件 element-ui 确实也为我们提供了 ...

  4. vue : 检测用户上传的图片的宽高

    需求: 用户可上传3-6张图片(第 1 2 3 张必须传),上传的图片必须是540 * 330 像素. 第一步,获取上传的图片的宽高. 初始化一个对象数组,宽高均设为0. 如果用户上传的图片没有上限, ...

  5. ASP.NET、JAVA跨服务器远程上传文件(图片)的相关解决方案整合

    一.图片提交例: A端--提交图片 protected void Page_Load(object sender, EventArgs e) { if (!IsPostBack) { string u ...

  6. 如何预览将要上传的图片-使用H5的FileAPI

    这篇将要说的东西已经不新鲜了. 参考资料: Reading files in JavaScript using the File APIs (鉴于作者在美国, 我姑且认为作者母语是英语, 当然链接中有 ...

  7. js如何展示上传的图片

    前言:本文章主要讲的是上传的图片如何展示在页面上. 一般来说,我们会先将本地图片上传到服务器,上传成功后,由后台返回图片的网络地址再在前端显示.但是,我今天讲的是不通过前面说的过程,而是直接使用js将 ...

  8. 海康NVR设备上传人脸图片到人脸库

    海康开放平台--海康文档链接--海康开发包和文档下载链接 硬件:海康超脑NVR(全称Network Video Recorder,即网络视频录像机).人脸摄像机. 环境:JDK_1.8 Windows ...

  9. thinkphp 3.2.3整合ueditor 1.4,给上传的图片加水印

    今天分享一下thinkphp 3.2.3整合ueditor 1.4,给上传的图片加水印.博主是新手,在这里卡住了很久(>_<) thinkphp 3.2.3整合ueditor 1.4 下载 ...

随机推荐

  1. Centos下MySQL数据库主从双向同步配置

    MYSQL支持单向.异步复制,复制过程中一个服务器充当主服务器,而一个或多个其它服务器充当从服务器.主服务器将更新写入二进制日志文件,并维护日志文件的一个索引以跟踪日志循环.当一个从服务器连接到主服务 ...

  2. CentOS7 + Python3 + Django(rest_framework) + MySQL + nginx + uwsgi 部署 API 开发环境, 记坑篇

    CentOS7 + Python3 + Django(rest_framework) + MySQL + nginx + uwsgi 部署 API 开发环境 CentOS7 + Python3 + D ...

  3. HDU 4123 Bob's Race:树的直径 + 单调队列 + st表

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=4123 题意: 给你一棵树,n个节点,每条边有长度. 然后有m个询问,每个询问给定一个q值. 设dis[ ...

  4. 分享知识-快乐自己:Java常用API总结

    1):java.io.BufferedReader类(用于从文件中读入一段字符:所属套件:java.io) 1. 构造函数BufferedReader(java.io.FileReader FileR ...

  5. IDEA 安装完码云插件,运行报“Cannot run program "xxx":CreateProcess error=2,系统找不到指定的文件”

    错误:Cannot run program "E:\Program Files\Git\bin\git.exe":CreateProcess error=2,系统找不到指定的文件 ...

  6. 重拾安卓_01_安卓开发环境搭建(eclipse)

    一.下载安装Android SDK 1.下载地址 (1)官网(可FQ选择):http://developer.android.com/sdk/index.html (2)不可FQ选择:http://w ...

  7. mysql字符串的隐式转换导致查询异常

    如果mysql某个字段(name)类型为varchar, 加了索引,在执行where查询的时候,传入了int的值,这样就会全表扫描,把每一条的值都转换成int(会出现"中国"-&g ...

  8. MFC工程名称与所包含文件名称的关系(工程名可以更改,输出的.dll.exe.lib都以最后工程名命名为准)

    创建MFC应用程序时,可以规定MFC程序的工程名称,假设初始为MFCApp,则此后该应用程序的资源文件名称,继承自CWinApp的那个类,包括.def文件,.odl文件等都会以MFCApp打头. 但是 ...

  9. STL stl_uninitialized.h

    stl_uninitialized.h // Filename: stl_uninitialized.h // Comment By: 凝霜 // E-mail: mdl2009@vip.qq.com ...

  10. Struts2 - 通过 ActionContext 访问 Web 资源

    public String execute(){ //0. 获取 ActionContext 对象 //ActionContext 是 Action 的上下文对象. 可以从中获取到当往 Action ...