node.js文件图片上传

在公益给学校写跳蚤市场网站时遇到一个问题,node.js如何将前端ajax过来的图片存到本地,结合度娘搞了好久终于有一个简单易用的办法,下面我直接贴源代码:

前端代码【html】

  <center>       
    <form name='form1' id='form1'>
      <!-- 发布者姓名 -->
      <span class='lead'>您的姓名:
      <input type="text" id='user_name' name='user_name'>
      <hr/>
      <!-- 图片上传 -->
      <span class='lead muted'>物品图片:
      <input type='file' id='user_picture' name='user_picture'>
      <hr/>

      <!-- 物品名称 -->
      <span class='lead text-info'>物品名称:
      <input type="text"id='user_goods' name='user_goods'>
      <hr/>
      <!-- 物品类别 -->
      <span class='lead text-warning'>物品类别:
      <select id='user_class' name='user_class'>
      <option>电子产品</option>
      <option>书籍</option>
      <option>文体用品</option>
      <option>电脑装备</option>
      <option>关乎游戏</option>
      <option>其他</option>
      </select>
      <hr/>
      <!-- 物品描述述 -->
      <span class='lead text-success'>物品描述:
      <textarea row='3'id='user_intro' name='user_intro'></textarea>
      <hr/>
      <!-- 出售理由 -->
      <span class='lead muted'>出售理由:
      <textarea row='3' id='user_reason' name='user_reason'></textarea>
      <hr/>

      <!-- 联系电话 -->
      <span class='lead text-error'>联系电话:
      <input type='text'id='user_tel' name='user_tel'>
      <hr/>
      <!-- 物品价格 -->
      <span class='lead muted'>物品价格:
      <div class='input-append'>
      <input class='span2' type='text' id='user_price' name='user_price'>
      <span class='add-on'></span>
      </div>
      <hr/>

      <!-- 提交按钮 -->
      <button class='btn btn-block btn-large btn-warning'>重置</button>
      <button class='btn btn-block btn-large btn-primary' id='submit' onclick="fsubmit()">提交</button>
    </form>

前端代码【js】

function fsubmit(){

    var data = new FormData($('#form1')[0]);

    $.ajax({  
        url: '/user_goods',  
        type: 'POST',  
        data: data,
        dataType: 'JSON',  
        cache: false,  
        processData: false,  
        contentType: false,
        success:function(data){

          alert(data);
    },
    error:function(data){

          alert(JSON.stringify(data));
    }
  });

后端代码【node.js】

var formidable = require('formidable');
var fs = require('fs');

//这个模块是我将数据插入数据库的,可以不用理会
var form_info_to_db = require('./form_info_to_db.js');

module.exports.form_process=function(req, res){

    var form = new formidable.IncomingForm();   //创建上传表单
    form.encoding = 'utf-8';        //设置编辑
    form.uploadDir = 'mazheFile/' +'user_photo/';     //设置上传目录
    form.keepExtensions = true;     //保留后缀
    form.maxFieldsSize = 2 * 1024 * 1024;   //文件大小   

    form.parse(req, function(err, fields, files) {

        if (err) {

            res.send('失败');    
        }  

        var extName = '';  //后缀名
        switch (files.user_picture.type) {
            case 'image/pjpeg':
                extName = 'jpg';
                break;
            case 'image/jpeg':
                extName = 'jpg';
                break;         
            case 'image/png':
                extName = 'png';
                break;
            case 'image/x-png':
                extName = 'png';
                break;         
        }
        //没有图片直接return
        if(extName.length == 0){

            return;
        }

        var avatarName = Math.random() + '.' + extName;
        var newPath = 'user_photo/' + avatarName;

        var emitter = new events.EventEmitter();

        emitter.on('event2',function(){

                fs.renameSync(files.user_picture.path, form.uploadDir+avatarName);
            res.send('录入成功');
        });

       //将数据插入到数据库中
       form_info_to_db.form_info_to_db(fields, newPath);
       fs.renameSync(files.user_picture.path, form.uploadDir+avatarName);
    });       
}

*下面链接是为了测试web聊天室的demo,大家可以体验一下node的即时通讯:
*http://115.28.200.138:3000/

  • 0
    点赞
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值