js文件上传

你可以创建一个Formdata对象,然后通过调用它的append()方法添加字段,就像这样:

var formdata = new FormData()
formdata.append("username", "Groucho")
formdata.append("password", 123456) // 数字 123456 会被立即转换成字符串 "123456"
// HTML 文件类型input,由用户选择
formdata.append(“userfile", fileInputElement.files[0])
// JavaScript file-like 对象
var content = '<a id="a"><b id="b">hey!</b></a>'; // 新文件的正文...
var blob = new Blob([content], {type: "text/xml"})
formdata.append("webmasterfile", blob)
var request = new XMLHttpRequest()
request.open("POST", "http://foo.com/submitform")
request.send(formdata)
通过HTML表单创建FormData对象
var formElement = document.querySelector("form");
var request = new XMLHttpRequest();
request.open("POST", "submitform.php");
request.send(new FormData(formElement));
你也可以将base64转成blob,然后上传到服务器,后端一样可以得到图片

前端代码:

var _baseURL = "data:image/gif;base64,........" // 假设这个是图片的base64数据
var formdata = new FormData()
formdata.append("file_n", dataURLtoBlob(_baseURL))
formdata.append("name", nameEl.value)
formdata.append("pwd", pwdEl.value)
$.ajax({
    url: "/signupu",
    type: "POST",
    data: formdata,
    cache: false,
    contentType: false,  // 不可缺
    processData: false,  // 不可缺
    success: function (data) {
        console.log(data)
        // do something you want
    }   
})
function dataURLtoBlob(dataurl) {
    var arr = dataurl.split(","), mime = arr[0].match(/:(.*?);/)[1],
        bstr = atob(arr[1]), n = bstr.length, u8arr = new Uint8Array(n);
    while(n--){
        u8arr[n] = bstr.charCodeAt(n);
    }
    return new Blob([u8arr], {type:mime});
}

后端代码:(nodejs):(这里使用formidable中间件)

var form = new formidable.IncomingForm();
  //设置编辑
  form.encoding = 'utf-8';
  //保留后缀
  form.keepExtensions = true;
  //设置单文件大小限制
  form.maxFieldsSize = 1024 * 1024 * 1024;
  //form.maxFields = 1000;  设置所有文件的大小总和
  form.parse(req, function(err, fields, files) {
      var file = files.files
      var t = (new Date()).getTime();
      //生成随机数
      var ran = parseInt(Math.random() * 8999);
      var ran1 = parseInt(Math.random() * 8999);
      //拿到扩展名
      var extname = "." + file.type.split("/")[1]
      var oldpath = path.normalize(file.path);
      //新的路径
      let newfilename= t + "" + ran + "" + ran1 + extname;
      var newpath = "public/images/uploadImage/"+newfilename;
      console.log(newpath)
      fs.rename(oldpath, newpath, function(err){
        if(err){console.error("改名失败"+err); }
        res.send({test: "OK��"})
      })
  })
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值