node学习(2)-路由读取图片
通常我们开发项目的时候都要用到图片,那么nodejs是如何读取图片的呢?
我们来看一下,因为一个网页中图片的数量是不确定的,而我们不能每一张图片都去写它的src路径,这时候最好的方法就是写一个专门读取图片的路由,通过路由加载图片,这样既快捷又方便我们的理解。
文件目录:

我要加载的图片在index页面

注:问号?前面部分表示路由,问号后面才是图片的路径(相对于服务器文件),我的是first_server.js文件
1、在自己定义的目录下新建服务器文件
我的是:
first_server.js
var http=require('http');
var url=require('url');
var router=require('./module/router');
http.createServer(function (request,response) {
response.writeHead(200, {'Content-Type': 'text/html;charset=utf-8'});
if (request.url!=='/favicon.ico'){//清除二次访问
var path=url.parse(request.url).pathname;//获取当前路径
if(path==='/')path='/index';
path=path.substr(1);//获取去掉根符号‘/’的当前路径
router[path](request,response);//路由,path是一个变量,如login、register、index
}
}).listen(5200);//端口号为5200
解释:两次path的值不一样,

if(path==='/')path='/index'的作用是如果访问的时候没有输入路径,则默认进入index页面

注: router[path]必须是在路由模块里面定义过的才行,不然会出现找不到报错

2、编写路由模块(router.js)
var url = require('url');
var optfile=require('./optfile');//导入自定义模块要加路径'./'
module.exports={
readImg:function(req,res){
optfile.readImg(req,res);
},
index:function(req,res){
optfile.index('./file/index.html',res);
}
}
3、编写操作文件(optfile.js)
var fs = require('fs');
function recall(res,data,ext){
if (!ext)ext='html';//默认输出格式为HTML
res.writeHead(200, {'Content-Type': 'text/'+ext+';charset=utf-8'});
res.end(data);//向浏览器输出取得的数据
}
module.exports={
readImg:function (req,res) {
var path=req.url.split('?')[1];
var data = fs.readFile(path,'binary',function (err,data) {
if (!err){
res.writeHead(200, {'Content-Type': 'image/jpeg'});//输出类型
res.write(data,'binary');//二进制方式
}else {
res.end('err');
}
})
},
index:function (path,res) {
var data = fs.readFile(path,function (err,data) {
if (!err){
data=data.toString();
recall(res,data);
}else {
res.end('err');
}
})
}
};
因为图片在nodejs中是以二进制的形式传输的,所以文件输出要加‘binnary’表示二进制输出.
req.url相当于request.url表示取得当前请求的路径,这里表示图片的全部路径,
req.url.split('?')表示将取得的路径字符串用?拆分成数组,
req.url.split('?')[1]表示取字符串的?号后面部分,即图片的相对路径
不明白的可以看下面,我console一下:

运行结果:

node学习(2)-路由读取图片的更多相关文章
- 【学习笔记】tensorflow图片读取
目录 图像基本概念 图像基本操作 图像基本操作API 图像读取API 狗图片读取 CIFAR-10二进制数据读取 TFRecords TFRecords存储 TFRecords读取方法 图像基本概念 ...
- opencv学习之路(3)、批量读取图片、视频分解、视频合成
一.批量有序读取图片 #include<opencv2/opencv.hpp> using namespace cv; void main() { //批量读取图片(有序) ]; ]; M ...
- Node学习(二) --使用http和fs模块实现一个简单的服务器
1.创建一个www目录,存储静态文件1.html.1.jpg. * html文件内容如下: 12345678910111213 <html lang="en">< ...
- nodejs进阶(4)—读取图片到页面
我们先实现从指定路径读取图片然后输出到页面的功能. 先准备一张图片imgs/dog.jpg. file.js里面继续添加readImg方法,在这里注意读写的时候都需要声明'binary'.(file. ...
- nodeJS基础08:读取图片
1.读取图片 //server.js var http = require("http"); var readImage = require("./readImage&q ...
- C#(WinForm)上传图片保存到数据库和从数据库读取图片显示到窗体
//浏览图片 private void btnUp_Click(object sender, EventArgs e) { OpenFileDialog ofd = new OpenFileDialo ...
- [python3.6+opencv] 01 完成读取图片操作
学习一下opencv3 奈何vs2017配的云里雾里,还是使用python吧 --人生苦短,python来凑 --使用Pycharm操作,面向界面的Pycharm好一些吧(我猜的) 新建Project ...
- Node学习HTTP模块(HTTP 服务器与客户端)
Node学习HTTP模块(HTTP 服务器与客户端) Node.js 标准库提供了 http 模块,其中封装了一个高效的 HTTP 服务器和一个简易的HTTP 客户端.http.Server 是一个基 ...
- opencv图像处理时使用stringstream批量读取图片,处理后并保存
简介: 同文件输入输出流一样,使用stringstream可以批量读取图片,处理后并进行保存.因为C++中头文件 stringstream既可以从string读数据也可向string写数据,利于其这个 ...
随机推荐
- SDUT OJ 河床
河床 Time Limit: 3000ms Memory limit: 65536K 有疑问?点这里^_^ 题目描述 地理学家们经常要对一段河流进行测量分析.他们从上游开始向下游方向等距离地选择 ...
- 本地Ubuntu16搭建Seafile
本地搭建Seafile 1.下载 2.解压 3.创建目录 mySeafile 4.将解压包放入mySeafile中 5.创建installed 将压缩包放入installed 安装准备工作 pytho ...
- JAVA- 成员变量与局部变量的区别
成员变量与局部变量的区别 成员变量是定义在方法之外,类之内的局部变量是定义在方法之内的. 作用上的区别: 1.成员变量的作用是用于描述一类事物的公共属性的. 2.局部变量的作用就是提供一个变量给方法内 ...
- 单页导航菜单视觉设计HTML模板
单页导航菜单视觉设计HTML模板,视觉,企业,html,单页,单页导航菜单视觉设计HTML模板是一款磨砂背景的大气时尚HTML设计网页模板 http://www.huiyi8.com/moban/
- Es6 学习笔记(一)数组扩展
扩展运算符 ... 1.数组的扩展运算符将一个数组转换成一个逗号分隔的参数序列 console.log(...[1,2,3]) //1,2,3 ['a', 'b',...[1,3]] //a, ...
- python 3 - 写一个注册的程序,账号和密码都存在文件里面
choice = input('请输入你的选择:1,注册2.删除用户3.登录') #注册 输入 账号 密码 密码确认 # #需要校验用户是否存在,两次输入的密码,是否一致,为空的情况 #账号和密码都存 ...
- 【LeetCode】Find Minimum in Rotated Sorted Array 在旋转数组中找最小数
Add Date 2014-10-15 Find Minimum in Rotated Sorted Array Suppose a sorted array is rotated at some p ...
- HDU6118:度度熊的交易计划(入门级最小费用可行流)
度度熊参与了喵哈哈村的商业大会,但是这次商业大会遇到了一个难题: 喵哈哈村以及周围的村庄可以看做是一共由n个片区,m条公路组成的地区. 由于生产能力的区别,第i个片区能够花费a[i]元生产1个商品,但 ...
- AtCoder Beginner Contest 100 2018/06/16
A - Happy Birthday! Time limit : 2sec / Memory limit : 1000MB Score: 100 points Problem Statement E8 ...
- EMQ开启mysql认证
规定通过mqtt_user表格验证过的用户才能连接EMQ服务器,我们需要开启mysql插件认证.EMQ2.0自带mysql插件,下面开始配置. 新建mqtt_user表格 要想控制用户登录EMQ,肯定 ...