node实战——koa实现文件下载和图片/pdf/视频预览(node后端储备知识)

文章目录

    • ⭐前言
    • ⭐koa-send库实现下载
    • ⭐mime-types库实现图片预览
      • 💖 渲染图片
      • 💖渲染404
      • 💖预览pdf
      • 💖预览视频
    • ⭐总结
    • ⭐结束

yma16-logo

⭐前言

大家好,我是yma16,本文分享关于node实战——koa实现文件下载和图片预览。
本文适用对象:前端初学者转node方向,在校大学生,即将毕业的同学,计算机爱好者。
node系列往期文章
node_windows环境变量配置
node_npm发布包
linux_配置node
node_nvm安装配置
node笔记_http服务搭建(渲染html、json)
node笔记_读文件
node笔记_写文件
node笔记_连接mysql实现crud
node笔记_formidable实现前后端联调的文件上传
node笔记_koa框架介绍
node_koa路由
node_生成目录
node_读写excel
node笔记_读取目录的文件
node笔记——调用免费qq的smtp发送html格式邮箱
node实战——搭建带swagger接口文档的后端koa项目(node后端就业储备知识)
node实战——后端koa结合jwt连接mysql实现权限登录(node后端就业储备知识)
node实战——koa给邮件发送验证码并缓存到redis服务(node后端储备知识)
http下载
HTTP下载是通过HTTP协议从Internet上下载(或上传)文件的过程。它是一种通过网页浏览器下载文件的常见方式。

通常,HTTP下载发生在以下情形下:

  1. 用户在网页浏览器中单击下载链接时,浏览器自动使用HTTP协议向服务器请求文件并将其下载到本地计算机。

  2. 用户使用特殊的下载管理器程序(如IDM,迅雷等)来下载文件,这些下载管理器也使用HTTP协议从服务器下载文件。

无论使用哪种方式,HTTP下载的基本过程都是相同的:客户端向服务器请求文件并接收响应,然后将文件下载到本地计算机。

⭐koa-send库实现下载

koa-send is a middleware for the Koa web framework that simplifies
sending static files as responses to HTTP requests. It allows you to
serve files from a directory and optionally apply cache-control
headers, send files as attachments, and handle range requests (partial
content). It is commonly used to serve CSS, JavaScript, images, and
other types of static assets.

koa-send 是 Koa Web 框架的中间件,它简化了发送静态文件作为对 HTTP 请求的响应的过程。它允许您从目录中提供文件,并选择性地应用缓存控制标头、将文件作为附件发送以及处理范围请求(部分内容)。它通常用于提供 CSS、JavaScript、图像和其他类型的静态资产。
MIME 类型(多用途 Internet 邮件扩展类型)是一种根据其性质和格式对 Internet 上的文件进行分类的方法。Web 服务器和浏览器使用它们来识别所请求或传输的文档的文件类型。MIME 类型的示例包括:

  • text/plain:纯文本文件
  • text/html:HTML(超文本标记语言)文件
  • image/jpeg:JPEG图像文件
  • image/png:PNG 图像文件
  • application/pdf: PDF(便携式文件格式)文件
  • application/vnd.ms-excel:Microsoft Excel 文件
  • application/vnd.openxmlformats-officedocument.spreadsheetml.sheet:Microsoft Excel OpenXML 文件
  • application/vnd.ms-powerpoint:Microsoft PowerPoint 文件
  • application/vnd.openxmlformats-officedocument.presentationml.presentation:Microsoft
  • PowerPoint OpenXML 文件
  • audio/mpeg:MP3 音频文件
  • video/mp4:MPEG-4 视频文件。
    对于不同类型的文件,还有许多其他 MIME 类型,并且随着新文件格式的出现,会添加新的 MIME 类型。
    安装

$ npm install koa-send

封装一个下载exe的功能

const Router = require('koa-router');
const router = new Router();
const send = require('koa-send');

// down exe
router.get('/down/exe', async (ctx) => {
    try{
        const file_path='./db/exe/tools/cat-tools-setup.exe'
        ctx.attachment(file_path);
        await send(ctx, file_path);
    }
    catch(e){
        ctx.body = { code: 0, data:e,msg: 'get label fail'};
    }
});

module.exports=router

下载 ./db/exe/tools/cat-tools-setup.exe对应的文件
实现效果 https://yongma16.xyz/cat-web/#/
download

⭐mime-types库实现图片预览

MIME types (Multipurpose Internet Mail Extensions types) are a way to
classify files on the Internet according to their nature and format.
They are used by web servers and browsers to recognize the file type
of a document being requested or transmitted. Examples of MIME types
include:

  • text/plain: plain text file
  • text/html: HTML (Hypertext Markup Language) file
  • image/jpeg: JPEG image file
  • image/png: PNG image file
  • application/pdf: PDF (Portable Document Format) file
  • application/vnd.ms-excel: Microsoft Excel file
  • application/vnd.openxmlformats-officedocument.spreadsheetml.sheet: Microsoft Excel OpenXML file
  • application/vnd.ms-powerpoint: Microsoft PowerPoint file
  • application/vnd.openxmlformats-officedocument.presentationml.presentation:
    Microsoft PowerPoint OpenXML file
  • audio/mpeg: MP3 audio file
  • video/mp4: MPEG-4 video file. There are many other MIME types for different types of files, and new ones are added as new file formats
    emerge.

安装mime-types

$ npm install mime-types

封装渲染的api

const Router = require('koa-router');
const router = new Router();
const mime = require('mime-types');
const fs=require('fs')
// down exe
router.get('/media/view', async (ctx) => {
    try{
        const {path}=ctx.query
        const filePath='./media/static/'+path
        let file = null;
        try {
            file = fs.readFileSync(filePath); //读取文件
        } catch (error) {
            //如果服务器不存在请求的图片,返回默认图片
            file = fs.readFileSync('./media/static/404.png'); //读取文件
        }

        let mimeType = mime.lookup(filePath); //读取图片文件类型
        ctx.set('content-type', mimeType); //设置返回类型
        ctx.body = file; //返回图片
    }
    catch(e){
        ctx.body = { code: 0, data:e,msg: 'view media fail'};
    }
});

module.exports=router

渲染成功!

💖 渲染图片

render-img

💖渲染404

404-render

💖预览pdf

pdf-render

💖预览视频

MP4-render

⭐总结

Koa 是一个 Node.js Web 框架,它提供了一组 API,用于构建 Web 应用程序和 API。在使用 Koa 进行 Web 开发时,通常需要下载和安装 Koa,然后编写代码来定义路由、处理请求和响应、以及渲染视图等。

以下是使用 Koa 进行 Web 开发时需要掌握的主要内容:

  1. 下载和安装 Koa:可以使用 npm 命令来下载和安装 Koa,如:npm install koa。

  2. 定义路由:可以使用 Koa-router 模块来定义路由,将请求映射到处理程序上。

  3. 处理请求和响应:可以使用 Koa 中间件来处理请求和响应,例如:koa-bodyparser 中间件用于解析请求体,koa-static 中间件用于提供静态文件服务等。

  4. 渲染视图:可以使用第三方模板引擎来渲染视图,例如:koa-views 中间件用于集成模板引擎,例如 ejs、pug、handlebars 等。

使用 Koa 进行 Web 开发,需要具备一定的 Node.js 基础、HTTP 知识、异步编程和中间件等方面的技能。同时,需要熟练掌握 Koa 的 API 和相关的第三方模块,以便快速开发高效的 Web 应用程序和 API。

下载使用 koa-send
预览使用 mime-types

⭐结束

本文分享到这结束,如有错误或者不足之处欢迎指出!
blue-sky

👍 点赞,是我创作的动力!
⭐️ 收藏,是我努力的方向!
✏️ 评论,是我进步的财富!
💖 最后,感谢你的阅读!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:/a/137771.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈qq邮箱809451989@qq.com,一经查实,立即删除!

相关文章

单链表(6)

删除第一个val的值(考试重点) 思路:例如删除val值为3的数据,直接让数据2的p->next指向数据4就可以了。 所以删除必须依赖前驱。也就是要写删除函数,则先要完成返回key的前驱地址的函数 也就是先知道前驱地址&#…

kubenetes-容器运行时接口CRI

一、CRI 容器运行时(Container Runtime),运行于Kubernetes(K8s) 集群的每个节点中,负责容器的整个生命周期。其中Docker是目前应用最广的。随着容器云的发展,越来越多的容器运行时涌现。 为了解…

sqli-labs关卡12(基于post提交的双引号闭合的字符型注入)通关思路

文章目录 前言一、回顾第十一关知识点二、靶场第十二关通关思路1、判断注入点2、爆显位个数3、爆显位位置4、爆数据库名5、爆数据库表名6、爆数据库列名7、爆数据库数据 总结 前言 此文章只用于学习和反思巩固sql注入知识,禁止用于做非法攻击。注意靶场是可以练习的…

从0到0.01入门React | 003.精选 React 面试题

🤍 前端开发工程师(主业)、技术博主(副业)、已过CET6 🍨 阿珊和她的猫_CSDN个人主页 🕠 牛客高级专题作者、在牛客打造高质量专栏《前端面试必备》 🍚 蓝桥云课签约作者、已在蓝桥云课上架的前后端实战课程《Vue.js 和 Egg.js 开发企业级健康管理项目》、《带你从入…

深度解析CompletableFuture:Java 异步世界的奇迹

目录 概述 介绍 上文我们可知:CompletableFuture 是 Java 8 引入用于支持异步编程和非阻塞操作的类。对于没有使用过CompletableFuture通过它这么长的名字就感觉到一头雾水,那么现在我们来一起解读一下它的名字。 Completable:可完成Futur…

工厂设计模式

1、简单工厂模式 package com.jmj.pattern.factory.simple_factory;public class SimpleCoffeeFactory {public Coffee createCoffee(String type) throws Exception {//声明Coffee类型的变量,根据不同类型创建不同的coffee子类对象Coffee coffee null;if ("a…

Netty入门指南之NIO Selector写操作

作者简介:☕️大家好,我是Aomsir,一个爱折腾的开发者! 个人主页:Aomsir_Spring5应用专栏,Netty应用专栏,RPC应用专栏-CSDN博客 当前专栏:Netty应用专栏_Aomsir的博客-CSDN博客 文章目录 参考文献前言操作演…

06-解决Spirng中的循环依赖问题

Bean的循环依赖问题 循环依赖: A对象中有B属性 , B对象中有A属性(丈夫类Husband中有Wife的引用, 妻子类Wife中有Husband的引用) toString()方法重写时直接输出wife/husband会出现递归导致的栈内存溢出错误 直接输出wife/husband会调用它们的toString()方法, 在toString()方法…

小黑子—springMVC:第二章

springMVC入门2.0 4、小黑子的springMVC拦截器4.1 Interceptor简介4.2 拦截器快速入门4.3 拦截器执行顺序4.4 拦截器执行原理 5、小黑子的springMVC全注解开发5.1 spring-mvc.xml中组件转化为注解形式5.1.1 消除spring-mvc.xml一二三 5.1.2 消除web.xml 6、小黑子的springMVC组…

新的开始吧

项目答辩终于结束了: 学习规划 下面先对自己的目前的情况来说: 学长学姐让我先把vue和boot学完,所以我打算先把vue3和boot学一下,但是每天还要花一点时间在六级的听力和阅读上面,还有就是算法; 下面进行…

数据结构----链式栈的操作

链式栈的定义其实和链表的定义是一样的,只不过在进行链式栈的操作时要遵循栈的规则----即“先进后出”。 1.链式栈的定义 typedef struct StackNode {SElemType data;struct StackNode *next; }StackNode,*LinkStack; 2.链式栈的初始化 Status InitStack(LinkSta…

Python---字典的增、删、改、查操作

字典的增操作 基本语法: 字典名称[key] value 注:如果key存在则修改这个key对应的值;如果key不存在则新增此键值对。 案例:定义一个空字典,然后添加name、age以及address这样的3个key # 1、定义一个空字典 person {…

RT-DETR算法改进:更换损失函数DIoU损失函数,提升RT-DETR检测精度

💡本篇内容:RT-DETR算法改进:更换损失函数DIoU损失函数 💡本博客 改进源代码改进 适用于 RT-DETR目标检测算法(ultralytics项目版本) 按步骤操作运行改进后的代码即可🚀🚀🚀 💡改进 RT-DETR 目标检测算法专属 文章目录 一、DIoU理论部分 + 最新 RT-DETR算法…

实验一 Anaconda安装和使用(上机Python程序设计实验指导书)

实验一 Anaconda安装和使用 一、实验目的和要求 (一)掌握Windows下Anaconda的安装和配置。 (二)掌握Windows下Anaconda的简单使用,包括IDLE、Jupyter Notebook、Spyder工具的使用。 (三)掌…

基于蚁狮算法优化概率神经网络PNN的分类预测 - 附代码

基于蚁狮算法优化概率神经网络PNN的分类预测 - 附代码 文章目录 基于蚁狮算法优化概率神经网络PNN的分类预测 - 附代码1.PNN网络概述2.变压器故障诊街系统相关背景2.1 模型建立 3.基于蚁狮优化的PNN网络5.测试结果6.参考文献7.Matlab代码 摘要:针对PNN神经网络的光滑…

数据结构 栈(C语言实现)

目录 1.栈的概念及结构2.栈的代码实现 1.栈的概念及结构 栈:一种特殊的线性表,其只允许在固定的一端进行插入和删除元素操作。进行数据插入和删除操作的一端 称为栈顶,另一端称为栈底。栈中的数据元素遵守后进先出LIFO(Last In F…

【Qt】撤销/恢复的快捷键

使用Qt的时候,有时需要撤销修改的代码,但可能回撤过头了。 下面提供2个快捷键,当撤销过头时,可恢复撤销内容。 撤销的快捷键是 CtrlZ 恢复/向前的快捷键是 CtrlShiftZ 我们可以自定义快捷键。 点击【工具】->【选项】 点击…

并发安全问题之--事物失效问题

并发安全问题之–事物失效问题 事物失效常见的6种原因: 1、事物方法非public修饰 2、非事物方法调用事物方法 3、事物方法抛出的异常被捕获了 4、事物方法抛出的异常类型不对 5、事物传播行为不对(事物发生嵌套时有事物传播) 6、事物锁属类没…

【Java】定时任务 - Timer/TimerTask 源码原理解析

一、背景及使用 日常实现各种服务端系统时,我们一定会有一些定时任务的需求。比如会议提前半小时自动提醒,异步任务定时/周期执行等。那么如何去实现这样的一个定时任务系统呢? Java JDK提供的Timer类就是一个很好的工具,通过简单…

C++二分查找算法:132 模式

说明 本篇是视频课程的讲义,可以看直接查看视频。也可以下载源码,包括空源码。 题目 给你一个整数数组 nums ,数组中共有 n 个整数。132 模式的子序列 由三个整数 nums[i]、nums[j] 和 nums[k] 组成,并同时满足:i &l…