zoukankan      html  css  js  c++  java
  • express上传图片

    var express = require('express')
    var app = express()
    var proxy = require('http-proxy-middleware')
    const path = require('path');
    var fs = require("fs");

    var formidable = require('formidable');

    app.all('*', function (req, res, next) {
    res.header('Access-Control-Allow-Origin', '*');
    //Access-Control-Allow-Headers ,可根据浏览器的F12查看,把对应的粘贴在这里就行
    // res.header('Access-Control-Allow-Headers', 'Content-Type');
    // res.header('Access-Control-Allow-Methods', '*');
    // res.header('Content-Type', 'application/json;charset=utf-8');
    next();
    });



    // 改为:
    app.use(express.json());
    app.use(express.urlencoded());


    var options = {
    target: 'http://10.254.222.170',
    //target: 'http://10.214.69.242:8080',
    changeOrigin: true,
    ws: true,
    pathRewrite: {
    '^/IDSJTVersion': '/IDSJTVersion'
    }
    }

    var options1 = {
    //target: 'http://10.254.201.218:8090',
    target: 'http://10.254.222.170:8080',
    changeOrigin: true,
    ws: true,
    pathRewrite: {
    '^/AtmosphericWeb': '/AtmosphericWeb'
    }
    }

    //var exampleProxy = proxy(options)
    //app.use('/api', exampleProxy)
    app.get('/liuhao', function (req, res) {
    res.send('我是服务端来的数据')
    })

    /**
    * 读取路径信息
    * @param {string} path 路径
    */
    function getStat(path){
    return new Promise((resolve, reject) => {
    fs.stat(path, (err, stats) => {
    if(err){
    resolve(false);
    }else{
    resolve(stats);
    }
    })
    })
    }

    /**
    * 创建路径
    * @param {string} dir 路径
    */
    function mkdir(dir){
    return new Promise((resolve, reject) => {
    fs.mkdir(dir, err => {
    if(err){
    resolve(false);
    }else{
    resolve(true);
    }
    })
    })
    }

    /**
    * 路径是否存在,不存在则创建
    * @param {string} dir 路径
    */
    async function dirExists(dir){
    let isExists = await getStat(dir);
    //如果该路径且不是文件,返回true
    if(isExists && isExists.isDirectory()){
    return true;
    }else if(isExists){ //如果该路径存在但是文件,返回false
    return false;
    }
    //如果该路径不存在
    let tempDir = path.parse(dir).dir; //拿到上级路径
    //递归判断,如果上级目录也不存在,则会代码会在此处继续循环执行,直到目录存在
    let status = await dirExists(tempDir);
    let mkdirStatus;
    if(status){
    mkdirStatus = await mkdir(dir);
    }
    return mkdirStatus;
    }



    app.post('/upload', function(req,res){
    var form = new formidable.IncomingForm();
    console.log('about to parse');
    form.parse(req, function(error, fields, files){
    console.log('parse done',files.upload.name)
    console.log(files.upload.path);
    // 读取文件流并写入到public/test.png
    var end=(files.upload.name).split(".")
    var endstr=end[end.length-1]
    var time=new Date().getTime()+""+Math.floor(Math.random()*100000000000)+'.'+endstr
    fs.writeFileSync('./public/uploadImg/'+time, fs.readFileSync(files.upload.path));
    //重定向到结果页
    res.send('http://localhost:3000/uploadImg/'+time)
    })
    });




    app.use(express.static('public'))
    app.listen(3000, () => console.log('Example app listening on port 3000!'))
     
     
    <form target="frame" action="/upload" method="POST" enctype="multipart/form-data">

    <input type="file" name="upload" id="upload" multiple="multiple" value="" />
    <button type="submit">提交</button>
    </form>
    <iframe name="frame" id="iframe" style="display: none"></iframe>
    <script>

     
    document.getElementById("iframe").onload=function(){
    alert(document.getElementById("iframe").contentWindow.document.body.innerText)
    }
    </script>
     
  • 相关阅读:
    Javascript FP-ramdajs
    微信小程序开发
    SPA for HTML5
    One Liners to Impress Your Friends
    Sass (Syntactically Awesome StyleSheets)
    iOS App Icon Template 5.0
    React Native Life Cycle and Communication
    Meteor framework
    RESTful Mongodb
    Server-sent Events
  • 原文地址:https://www.cnblogs.com/liuhao-web/p/11551063.html
Copyright © 2011-2022 走看看