简单实现node.js图片上传

本文实例为大家分享了node.js图片上传的具体代码,供大家参考,具体内容如下

1.node-formidable

对文件上传提供帮助的组件

2.app.js

var formidable = require('formidable');
var http = require( 'http' );
var sys = require('sys');

http.createServer(function( request ,response ){
  if( request.url == '/upload' && request.method.toLowerCase() == 'post' )
  {
    console.log( 'upload requet ' )
    uploadRequest(request,response);
    return;
  }
  enterRequest(request,response)
}).listen(3000);

function enterRequest( request, response )
{
  response.writeHead( 200, { 'Content-type' : 'text/html' });
  response.end(
    '<form action = "/upload" enctype="multipart/form-data" method="post" >' +
    '<input type = "text" name = "title" /> <br>' +
    '<input type = "file" name="upload" multiple="multiple"/> <br/>'+
    '<input type="submit" value="Upload Now"/>' +
    '</form>'
  );
}

/**
 * 处理上传的逻辑
 * @param request
 * @param response
 */
function uploadRequest( request,response )
{
  var form = new formidable.IncomingForm();
  form.parse( request, function ( err, fields, files ) {
    response.writeHead(200, {'Content-type' : 'text/plain'});
    response.write('reviced upload file');
    response.end( sys.inspect(
      {
        fields : fields,
        files : files
      }) );
  });
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

(0)

相关推荐

  • node.js中实现kindEditor图片上传功能的方法教程

    前言 最近由于工作需要使用在线编辑器,找了几个对比了下KindEditor还是不错的,国产的但文档还是不全,还好能参考官方插件,kindEditor官网上中提供了ASP,ASP.NET,JSP相关的整合应用 可以参照官方文档实现nodejs的kindEditor上传功能:http://kindeditor.net/docs/upload.html 在线下载kindEditor编辑器:http://www.jb51.net/codes/36131.html 实现方法: 1.在客户端js中定义upl

  • node.js实现多图片上传实例

    先上效果图: 这是我当时做多图片的代码,拿出来给大家借鉴一下(有些地方需要亲们自己改一下,大方向是对的) 总共涉及到三处文件(常规来说) 1.路由入口文件(我这里是/routes.js,很多时候会在/app.js) 复制代码 代码如下: //添加美食  app.all('/add', users.add); 2.路由控制器文件(我这里是/routes/users.js) 复制代码 代码如下: //添加美食exports.add = function (req, res) {   if (req.

  • nodejs 整合kindEditor实现图片上传

    kindEditor官网上中提供了ASP,ASP.NET,JSP相关的整合应用,http://kindeditor.net/docs/upload.html可以参照实现nodejs的整合,发现实用nodejs更简单 环境: unbuntu 14.10 nodejs 0.10.35 express 4.11.2 formidable 1.0.16 kindEditor 4.1.10 webStorm 8 1.通过IDE或终端创建一个名称为test的工程 2.编辑package.json添加form

  • 轻松创建nodejs服务器(10):处理上传图片

    本节我们将实现,用户上传图片,并将该图片在浏览器中显示出来. 这里我们要用到的外部模块是Felix Geisendörfer开发的node-formidable模块.它对解析上传的文件数据做了很好的抽象. 要安装这个外部模块,需在cmd下执行命令: 复制代码 代码如下: npm install formidable 如果输出类似的信息就代表安装成功了: 复制代码 代码如下: npm info build Success: formidable@1.0.14 安装成功后我们用request将其引入

  • angular2+nodejs实现图片上传功能

    在使用angular2进行图片上传的时候,遇到了各种各样的问题.在多番尝试之后最终成功上传图片,下面将我的方法分享给大家: nodejs 后台代码 var express = require("express"); //网络请求模块 var request = require("request"); //引入nodejs文件系统模块 const fs = require('fs'); //引入body-parser //包含在请求正文中提交的键/值对数据. //默认

  • 从零开始学习Node.js系列教程三:图片上传和显示方法示例

    本文实例讲述了Node.js图片上传和显示方法.分享给大家供大家参考,具体如下: index.js var server = require("./server"); var router = require("./router"); var requestHandlers = require("./requestHandlers"); var handle = {} handle["/"] = requestHandlers

  • 简单实现node.js图片上传

    本文实例为大家分享了node.js图片上传的具体代码,供大家参考,具体内容如下 1.node-formidable 对文件上传提供帮助的组件 2.app.js var formidable = require('formidable'); var http = require( 'http' ); var sys = require('sys'); http.createServer(function( request ,response ){ if( request.url == '/uplo

  • vue.js 图片上传并预览及图片更换功能的实现代码

    这里讲解是图片上传和图片预览.主要是围绕我们常用功能的列子做讲解 ,并且没有格外引入其他js 所以你复制过去做简单修改便可以看到效果 效果图: 样式以及效果图一并展示 1.HTML <div class="rz-picter"> <img :src="avatar" class="img-avatar"> <input type="file" name="avatar" id=

  • vue+node实现图片上传及预览的示例方法

    本文介绍了vue+node实现图片上传及预览的示例方法,分享给大家,具体如下: 先上效果图 上代码 html部分主要是借助了weui的样式 <template> <div> <myheader :title="'发布动态'"> <i class="iconfont icon-fanhui1 left" slot="left" @click="goback"></i>

  • js图片上传的封装代码

    本文实例为大家分享了js图片上传的具体代码,供大家参考,具体内容如下 js封装的方法 function uploadImages(picker, url, callback) { var img_uploader = WebUploader.create({ auto: true, server: url, pick: picker, fileNumLimit: 1, fileSingleSizeLimit: 2097152, // 2M accept: { title: 'Images', e

  • js图片上传中file、bolb、base64图片之间的相互转化

    JS上传图片 我们要清楚,图片的展示方式有三种:分别为file(文件流).bolb(本地流).base64(二进制流) file File 接口提供有关文件的信息,并允许网页中的 JavaScript 访问其内容. 通常情况下, File 对象是来自用户在一个 元素上选择文件后返回的 FileList 对象,也可以是来自由拖放操作生成的 DataTransfer 对象,或者来自 HTMLCanvasElement 上的 mozGetAsFile() API.在Gecko中,特权代码可以创建代表任

  • node.js文件上传处理示例

    直入主题,在Node.js web 开发基本框架的前提下,我们来做一个文件上传功能 上传的handler比较简单,网上都能找到 var url=require('url'); var exec=require('child_process').exec; var querystring=require('querystring'); /********************************文件上传 第3方模块测试*************************/ function f

  • node.js文件上传重命名以及移动位置的示例代码

    一个关于node上传文件的例子,下面是前端代码, doUpload() { var formData = new FormData($("#uploadForm")[0]); $.ajax({ url: 'http://localhost:3011/upload', type: 'POST', data: formData, async: false, cache: false, contentType: false, processData: false, success: func

  • node.js实现上传文件功能

    最近刚开始弄nond,写得不好见谅,有什么错误请指出: 首先安装node,安装步骤 这里以上传图片为例: 1.在该文件夹下生成package.json文件: 在本文件夹下打开命令行窗口(window系统,进入该文件夹按住shift然后点击鼠标右键,就可以直接选择在本文件夹中打开命令行窗口)输入:npm init 然后等有提示出来,一路Enter(懂的请无视,不懂且不想懂的一路Enter就是了),然后你就可以发现文件夹下有一个package.json文件,下面是刚生成的package.json文件

  • js图片上传前预览功能(兼容所有浏览器)

    网上找到的一份文件上传前预览的代码,转自JavaScript 图片的上传前预览(兼容所有浏览器) <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html;charset=utf-8" /> <style type="text/css"> #preview, .img, img { w

  • js 图片上传前大小长宽验证代码

    脚本如下: function getimginfo() { var img=new Image(); img.src=document.all.file.value; var sInfo="Width:"+img.width+ "px Height:"+img.height+ "px Size:"+getsizestring(img.fileSize); alert(sInfo); } function getsizestring(len) {

随机推荐