前言

我们程序员日常都会用到图片压缩,面对这么常用的功能,肯定要尝试实现一番。
第一步,node基本配置

这里我们用到的是koa框架,它可是继express框架之后又一个更富有表现力、更健壮的web框架。
1、引入基本配置

const Koa = require(‘koa’);// koa框架
const Router = require(‘koa-router’);// 接口必备
const cors = require(‘koa2-cors’); // 跨域必备
const tinify = require(‘tinify’); // 图片压缩
const serve = require(‘koa-static’); // 引入静态文件处理
const fs = require(‘fs’); // 文件系统
const koaBody = require(‘koa-body’); //文件保存库
const path = require(‘path’); // 路径

2、使用基本配置

let app = new Koa();
let router = new Router();
tinify.key = ‘’; // 这里需要用到tinify官网的KEY,要用自己的哦,下面有获取key的教程。

//跨域
app.use(cors({
origin: function (ctx) {
return ctx.header.origin;
},
exposeHeaders: [‘WWW-Authenticate’, ‘Server-Authorization’],
maxAge: 5,
credentials: true,
withCredentials: true,
allowMethods: [‘GET’, ‘POST’, ‘DELETE’],
allowHeaders: [‘Content-Type’, ‘Authorization’, ‘Accept’],
}));
// 静态处理器配置
const home = serve(path.join(__dirname) + ‘/public/’);
app.use(home);

//上传文件限制
app.use(koaBody({
multipart: true,
formidable: {
maxFileSize: 200 * 1024 * 1024 // 设置上传文件大小最大限制,默认2M
}
}));

3、tinify官网的key获取方式

获取链接

输入你名字跟邮箱,点击 Get your API key , 就可以了。
注意: 这个API一个月只能有500次免费的机会,不过我觉得应该够了。
第二步,详细接口配置

我们要实现图片上传以及压缩,下面我们将要实现。
1、上传图片

更多内容请见原文,原文转载自:https://blog.csdn.net/weixin_44519496/article/details/119816193

Nodejs实现图片的上传、压缩预览、定时删除的更多相关文章

  1. layui文件单文件和多文件的上传、预览以及删除和修改

    活不多说,直接上代码 单文件上传 1.HTML <blockquote class="layui-elem-quote layui-quote-nm" style=" ...

  2. plupload简易应用 多图片上传显示预览以及删除

    <script> var uploader = new plupload.Uploader({ //实例化一个plupload上传对象 browse_button: 'btnBrowse' ...

  3. 微信小程序实现图片是上传、预览功能

    本文实例讲述了微信小程序实现图片上传.删除和预览功能的方法,分享给大家供大家参考,具体如下: 这里主要介绍一下微信小程序的图片上传图片删除和图片预览 1.可以调用相机也可以从本地相册选择 2.本地实现 ...

  4. 微信小程序实现图片上传,预览,删除

    wxml: <view class='imgBox'> <image class='imgList' wx:for="{{imgs}}" wx:for-item= ...

  5. ASP.NET MVC图片管理(上传,预览与显示)

    先看看效果(下面gif动画制作有点大,5.71MB): 题外话:上面选择图片来源于Insus.NET的新浪微博:http://weibo.com/104325017 也是昨晚(2015-07-03)I ...

  6. JavaScript 图片的上传前预览(兼容所有浏览器)

    功能描述 通过 JavaScript 实现图片的本地预览(无需上传至服务器),兼容所有浏览器(IE6&IE6+.Chrome.Firefox). 实现要点   ● 对于 Chrome.Fire ...

  7. 基于HTML5和JSP实现的图片Ajax上传和预览

    本文对如何实现使用Ajax提交"multipart/form"格式的表单数据,已经如何在图片上传之前,在浏览器上进行预览.使用的主要相关技术HTML5的FILE API,XMLHt ...

  8. JAVA图片批量上传JS-带预览功能

    这篇文章就简单的介绍一个很好用的文件上传工具,批量带预览功能.直接贴代码吧,都有注释,很好理解. HTML页面 <!DOCTYPE html> <%@ taglib prefix=& ...

  9. 基于HTML5多图片Ajax上传可预览

    html5多图控件<input id="fileImage" type="file" size="30" name="fil ...

  10. JQ图片文件上传之前预览功能

    1.先准备一个div onchange触发事件 <input  type="file" onchange="preview(this)" >< ...

随机推荐

  1. k8s pod故障分类与排查

    一.Pod故障状态基本有几种Pod状态 处于PendingPod状态 处于WaitingPod状态 处于ContainerCreatingPod状态 ImagePullBackOffPod状态 Cra ...

  2. Lumia1520 手机刷 Windows10 arm双系统

    注意问题 升级到Windows 10 Mobile 的需重新刷回WP8.1,否则解锁会失败 部分手机刷机win10arm后出现屏幕卡死现象,目前除了换屏或重新焊接暂无其他解决方案,请谨慎刷机(当然如果 ...

  3. Java的源码执行(建议结合Javase语法学习来加深印象)

    一.源码执行时的先后顺序: 父类的静态属性和静态块(按照声明顺序) 本类的静态属性和静态块(按照声明顺序) main方法 父类的成员属性和成员块(按照声明顺序) 父类构造器 本类成员属性和块(按照声明 ...

  4. 技术管理进阶——一线Leader怎么做?经理的速成宝典

    原创不易,求分享.求一键三连 本期培训材料关注公众号后回复:经理培训,获得 前段时间有个同学问我有没有一线Leader的速成培训课程,很好的问题,首先我们需要定义一下什么是小Leader: 所谓小Le ...

  5. CVPR 2022数据集汇总|包含目标检测、多模态等方向

    前言 本文收集汇总了目前CVPR 2022已放出的一些数据集资源. 转载自极市平台 欢迎关注公众号CV技术指南,专注于计算机视觉的技术总结.最新技术跟踪.经典论文解读.CV招聘信息. M5Produc ...

  6. C语言超全学习路线(收藏让你少走弯路)

    刚入门是否觉得C语言很难?那可能是你还没找到正确的C语言学习路线,收藏以防找不到,让你少走弯路. 基本语法 选择控制语句 if,swith 循环控制语句 while,for 控制语句相关关键字分析 变 ...

  7. 【问题解决】'Access-Control-Allow-Origin' header contains multiple values '*, *', but only one is allowed.

    问题复述 今天项目组有人找我说之前部署的程序在测试环境没问题,到生产环境出现了奇怪的问题,点按钮没反应. 我通过腾讯会议发现他们的浏览器控制台上打出了如下错误: Access to XMLHttpRe ...

  8. 【译】defer-panic-and-recover

    Go 有通用的控制流程:if,for,switch,goto.它也有go语句用于让代码运行在单独的协程.这里我将讨论一些不常见的问题:defer,panic 和 recover. defer语句将函数 ...

  9. [笔记] $f(i)$ 为 $k$ 次多项式,$\sum_{i=0}^nf(i)\cdot q^i$ 的 $O(k\log k)$ 求法

    \(f(i)\) 为 \(k\) 次多项式,\(\sum_{i=0}^nf(i)\cdot q^i\) 的 \(O(k\log k)\) 求法 令 \(S(n)=\sum_{i=0}^{n-1}f(i ...

  10. mmsegmentation中构造自己的数据集和数据加载部分,跑现有demo

    在mmsegmentation中训练自己的数据集 先在mmse/dataset下创建一个python文件,我的名字是my_thermal_dataset.py 在其中填写下面内容 这里要注意,在设置s ...