nodejs,oss阿里云存储,vue实现图片上传

本博客主要内容为通过nodejs配合oss阿里云对象存储实现图片上传,先决条件需要有阿里云账号,并开通oss对象存储功能,具体代码如下:

nodejs:

var express = require('express');
var route = express.Router();
var fs = require('fs');
// 初始化Client
var co = require('co');
var OSS = require('ali-oss');
var client = new OSS({
  region: 'oss-cn-beijing',
  accessKeyId: '',// 阿里云获取
  accessKeySecret: '' // 阿里云获取
});

var ali_oss = {
    bucket: '',// 阿里云获取
    endPoint: 'oss-cn-beijing.aliyuncs.com',
}
// 微信小程序 图片上传
var multer  = require('multer')
var upload = multer({ dest: 'upload/' })
// 图片上传
route.post('/upload2', upload.single('file'), function(req, res, next){
    // 文件路径
    var filePath = './' + req.file.path;  
    // 文件类型
    var temp = req.file.originalname.split('.');
    var fileType = temp[temp.length - 1];
    var lastName = '.' + fileType;
    // 构建图片名
    var fileName = Date.now() + lastName;
    // 图片重命名
    fs.rename(filePath, fileName, (err) => {
        if (err) {
            res.end(JSON.stringify({status:'102',msg:'文件写入失败'}));   
        }else{
            var localFile = './' + fileName;  
            var key = fileName;

            // 阿里云 上传文件 
            co(function* () {
              client.useBucket(ali_oss.bucket);
              var result = yield client.put(key, localFile);
              var imageSrc = 'https://fu-images-container.oss-cn-beijing.aliyuncs.com/' + result.name;
              // 上传之后删除本地文件
              fs.unlinkSync(localFile);
              res.end(JSON.stringify({status:'100',msg:'上传成功',imageUrl:imageSrc})); 
            }).catch(function (err) {
              // 上传之后删除本地文件
              fs.unlinkSync(localFile);
              res.end(JSON.stringify({status:'101',msg:'上传失败',error:JSON.stringify(err)})); 
            });
        }
    });
})
module.exports = route;

 代码中的相应依赖自行安装。

将路由文件引入至app.js,并使用:

 

最后访问的接口地址即为:后端地址+"/api/file/upload2" 例:http://localhost:8000/api/file/upload2 

后端接口完成,只需要在前端调用即可:

调用成功:

 

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

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值