【学习Koa】原生koa2 静态资源服务器例子
实现思路
- 首先读取当前路径下所有的文件和文件夹
- 当去点击某个列表项时判断其实文件还是文件夹,文件的话直接读取,文件夹则再次利用上一个步骤读取并展示
文件结构
代码
index.js 入口文件
const Koa = require('koa')
const path = require('path')
const getContent = require('./util/content')
const mimes = require('./util/mimes')
const app = new Koa()
const staticPath = './static'
function parseMime(url) {
let extName = path.extname(url)
extName = extName ? extName.slice(1) : 'unknown'
return mimes[extName]
}
app.use(async (ctx) => {
if (ctx.path === '/favicon.ico') return;
let absoluteStaicPath = path.join(__dirname, staticPath)
let content = await getContent(ctx, absoluteStaicPath)
let mime = parseMime(ctx.url)
if (mime) {
ctx.type = mime
}
if (mime && (mime.includes('image/') || mime.includes('video/'))) {
ctx.res.writeHead(200)
ctx.res.write(content, 'binary')
ctx.res.end()
} else {
ctx.body = content
}
})
app.listen(3000, function (params) {
console.log('running at 127.0.0.1:3000')
})
content.js 获取内容
const fs = require('fs')
const path = require('path')
const dir = require('./dir')
const file = require('./file')
function getContent(ctx, absoluteStaticPath) {
let reqPath = path.join(absoluteStaticPath, ctx.url)
const exist = fs.existsSync(reqPath)
let content = ''
if (!exist) {
content = '404 not found'
} else {
let status = fs.statSync(reqPath)
if (status.isDirectory()) {
content = dir(ctx.path, reqPath)
} else {
content = file(reqPath)
}
}
return content
}
module.exports = getContent
file.js 读取文件
const fs = require('fs')
function file(reqPath) {
return fs.readFileSync(reqPath, 'binary')
}
module.exports = file
dir.js 读取文件夹
const walk = require('./walk')
function dir(path, reqPath) {
let {
dirList,
fileList
} = walk(reqPath)
let html = ''
function category(path, type, list) {
html += `<h2>${type}: </h2>`
html += '<ul>'
for (const item of list) {
html += `<li><a href="${path === '/' ? '' : path}/${item}">${item}</a></li>`
}
html += '</ul>'
}
dirList.length && category(path, '文件夹', dirList)
fileList.length && category(path, '文件', fileList)
return html
}
module.exports = dir
walk.js 遍历目录,归类文件和文件夹
const fs = require('fs')
const mimes = require('./mimes')
function walk(reqPath) {
const dirList = [], fileList = []
const files = fs.readdirSync(reqPath)
for (const file of files) {
// 判断文件是文件夹还是文件
let file_split = file.split('.')
// 根据mime类型判断, 因为文件夹的名字也中也是可以带有.的
let mimeType = file_split.length > 1 ? file_split[file_split.length-1] : ''
if (mimes[mimeType] === void 0) {
dirList.push(file)
} else {
fileList.push(file)
}
}
return { dirList, fileList }
}
module.exports = walk
mimes.js
const mimes = {
'css': 'text/css',
'less': 'text/css',
'txt': 'text/plain',
'html': 'text/html',
'xml': 'text/xml',
'js': 'text/javascript',
'json': 'application/json',
'pdf': 'application/pdf',
'wav': 'audio/x-wav',
'wmv': 'video/x-mx-wmv',
'gif': 'image/gif',
'jpeg': 'image/jpeg',
'jpg': 'image/jpeg',
'png': 'image/png',
'svg': 'image/svg+xml',
'tiff': 'image/tiff',
'icon': 'image/x-icon',
'mp4': 'video/mp4'
}
module.exports = mimes
结果
来源
【学习Koa】原生koa2 静态资源服务器例子的更多相关文章
- 原生node写一个静态资源服务器
myanywhere 用原生node做一个简易阉割版的anywhere静态资源服务器,以提升对node与http的理解. 相关知识 es6及es7语法 http的相关网络知识 响应头 缓存相关 压缩相 ...
- 初始nginx(启动运行) 使用nginx做一个简单的静态资源服务器
第一次接触nginx的时候,那时候公司还是用的一些不知名的小技术,后来公司发展问题,重新招了人,然后接触到nginx,公司 使用nginx用来做代理服务器,所有请求 都先经过nginx服务器,然后交由 ...
- 使用Node.js搭建静态资源服务器
对于Node.js新手,搭建一个静态资源服务器是个不错的锻炼,从最简单的返回文件或错误开始,渐进增强,还可以逐步加深对http的理解.那就开始吧,让我们的双手沾满网络请求! Note: 当然在项目中如 ...
- 使用 Express 实现一个简单的 SPA 静态资源服务器
背景 限制 SPA 应用已经成为主流,在项目开发阶段产品经理和后端开发同学经常要查看前端页面,下面就是我们团队常用的使用 express 搭建的 SPA 静态资源服务器方案. 为 SPA 应用添加入口 ...
- Nginx——静态资源服务器(一)
java web的项目中,我们经常将项目部署到Tomcat或者jetty上,可以通过Tomcat或者jetty启动的服务来访问静态资源.但是随着Nginx的普及,用Nginx来作为静态资源服务器,似乎 ...
- 【原创】分布式之缓存击穿 【原创】自己动手实现静态资源服务器 【原创】自己动手实现JDK动态代理
[原创]分布式之缓存击穿 什么是缓存击穿 在谈论缓存击穿之前,我们先来回忆下从缓存中加载数据的逻辑,如下图所示 因此,如果黑客每次故意查询一个在缓存内必然不存在的数据,导致每次请求都要去存储层去查 ...
- NodeJS4-8静态资源服务器实战_构建cli工具
Cli(command-line interface),中文是 命令行界面,简单来说就是可以通过命令行快速生成自己的项目模板等功能(比较熟悉的是vue-cli脚手架这些),把上述写的包做成Cli工具. ...
- node静态资源服务器的搭建----访问本地文件夹(搭建可访问静态文件的服务器)
我们的目标是实现一个可访问静态文件的服务器,即可以在浏览器访问文件夹和文件,通过点击来查看文件. 1.先创建一个文件夹anydoor,然后在该文件夹里npm init一个package.json文件, ...
- 使用node搭建静态资源服务器
安装 npm install yumu-static-server -g 使用 shift+鼠标右键 在此处打开Powershell 窗口 server # 会在当前目录下启动一个静态资源服务器,默 ...
随机推荐
- 全球定位IP位置 2018(离线版)
球定位IP位置 2018(离线版) 这次写的软件使用Python写的,所以体积可能有点大 我特地写了GUI打包成了Exe可执行文件,方便小白使用== 只要输入目标ip就能显示目标所在的国家城市和经纬度 ...
- importlib 与__import__的区别
importlib 与__import__的区别 importlib import importlib name = "lib.test" # lib.test指的是lib路劲下的 ...
- Linux CentOS7 VMware usermod命令、用户密码管理、mkpasswd命令
一. usermod命令 usermod可用来修改用户帐号的各项设定 -c, --comment 注释 GECOS 字段的新值 -d, --home HOME_DIR 用户的新主目录 -e, --ex ...
- JDBC原理及常见错误分析
1.JDBC:Java DataBase Connectivity 可以为多种关系型数据库DBMS 提供统一的访问方式,用Java来操作数据库 2.JDBC API 主要功能: 三件事,具体是通过以下 ...
- 「NOIP2011」观光公交
传送门 Luogu 解题思路 有点麻烦,幸好 \(O(n^2)\) 能过... 贪心地想一想,我们如果要用加速器,肯定是要选择车上人数最多的时段加速. 但是我们就会面临这样的情况: 加速了,带来了增益 ...
- extract()和extact_first()的区别
extract()和extact_first()都是提取Selector的data部分.但现在你要先知道什么是Selector. Selector是选择器的意思.具体定义我不知道,但通过下面的例子,你 ...
- loadrunner-11安装+破解+汉化
一.loadrunner-11安装下载地址:链接:https://pan.baidu.com/s/10meUz5DfkS8WleLSOalCtQ 提取码:iw0p 由于LR11安装包三个多G,没办法上 ...
- CRM:异步加载下拉列表,三个列表出现同样的下拉框
异步加载下拉列表,三个列表出现同样的下拉框,原因如下: Spring默认单例,如果Action是单例,那么上一次查询的结果就可能被下一次的查询所调用.所以必须配置action为多例, 如果采用单例模式 ...
- NO25 三剑客之SED行天下
功能说明 Sed是Stream Editor(流编辑器)缩写,是操作.过滤和转换文本内容的强大工具.常用功能有增删改查,过滤,取行. [root@oldboy ~]# sed --version #→ ...
- zabbix proxy配置实战案例
zabbix proxy配置实战案例 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.zabbix proxy概述 上一篇博客我们分享了zabbix agent有两种工作模式,即 ...