Nodejs入门基础（上传及查看图片demo）

shouye.ejs--首页页面，用于跳转上传页面和查看图片的页面
upload.ejs--上传页面，用于用户上传图片使用
allPhoto.ejs--查看页面，用于用户查看图片信息
baocuo.ejs--报错页面，当用户输入错误的地址会访问到该页面
shouye.js--主路由
router2.js--提供给主路由相应的方法，处理逻辑判断




shouye.ejs参考代码：

    
    


    上传
    查看图片

 

upload.ejs参考代码：
 

    
    


    
    

        请选择图片

        

        名字：

        年龄：
        提交
    

 

 

allPhoto.ejs

 

    


    
    
    <%for(var i=0;i
        
    <%}%>

 

 

baocuo.js

 

shouye.js

var express = require("express");//导入express
var app = express();//实例化express
var router2 = require("./router2.js");//引入router2.js，用于处理逻辑

app.set("view engine", "ejs");//配置ejs
app.set("views");//配置访问ejs的文件夹


app.all('*', function (req, res, next) {//跨域问题
    res.setHeader("Access-Control-Allow-Origin", "*");
    next();
});

//加载静态信息，开启服务后可以直接拼该地址的文件信息
app.use(express.static("./upload"));
app.use(express.static("./public"));

app.get("/", router2.shouyePage);//调用router2.js里面的shouyePage方法，用于设置默认页面

app.get("/upload",router2.upload);//用于首页跳转到upload.ejs，上传图片的界面
app.post("/postImg",router2.postImg);//当上传图片页面提交的时候调用该方法

app.get("/allPhoto",router2.allPhoto);//用于首页跳转allPhoto.js，查看图片的界面

app.listen(3000);//设置服务器

app.use(function (req, res) {//过滤器，如果不是进入首页则进入400报错的页面
    res.render("baocuo");
    console.log("进入过滤器报错");
});

 

router2.js

var fs = require("fs");//文件读取
var formidable = require("formidable");//第三方插件，用于上传图片，要在Node服务器下载


exports.shouyePage = function (req, res) {//该方法用于进入默认首页，shouye.js调用
    res.render("shouye");
};
exports.upload = function (req, res) {//该方法用于进入上传页面，shouye.js调用
    res.render("upload");
};

exports.postImg = function (req, res) {
    var form  = new formidable.IncomingForm();//实例化上传文件的插件
    form.uploadDir=__dirname+"/upload";//设置文件上传后保存的路径
    form.parse(req,function (err,fields,files,next) {
        //以下可以打印上传的信息测试
      /*  console.log(fields);*/
      /*  console.log(files);*/
      /*  console.log(form);*/

        //修改上传文件名的名字
        fs.rename(files.picture.path,form.uploadDir+'/'+files.picture.name,(err)=>{
            if (err){
                return;
            }
        });

        if (err){
            return;
        }

        var size=parseInt(files.picture.size);//获取上传的图片的大小，用作判断必须先转换成Int
        if (size>100000){//判断图片是否过大
            res.send("图片过大");
            fs.unlink(files.picture.path);//删除图片
            return;
        }
    });
    res.render("shouye");//判断完毕后跳转回首页
};

exports.allPhoto=function(req,res){//循环遍历图片方法
    fs.readdir("upload",function (err,files) {
        if (err){
            return;
        }
        var allPhotoAll=[];//声明一个数组

        files.forEach(function (photo,index) {
            fs.stat("./upload/"+photo,function (err,stats) {//查到./upload文档下的信息
                if (stats.isFile()){//如是文件
                    allPhotoAll.push(photo);//将文件添加到数组中
                }
                if (index==files.length-1){//图片数量==数组-1（数组是0开始算）
                    res.render("allPhoto",{allPhotoAll});//把集合传递过去给页面
                }
            })
        })
    })
};