node express.static 读取所有目录
node express.static to read all directory
我正在从事一个视频门户项目。 server.I 上午使用 nodejs 技术将视频分类到不同的文件夹中。我的 objective 是一个读取文件夹的函数,提供文件夹中的所有视频内容。
目前,下面的代码服务于特定文件而不是文件夹。我将会
感谢您的贡献。谢谢
let express = require('express');
let bodyParser = require('body-parser');
let path = require('path');
let fs = require('fs');
var ejs=require('ejs');
let port = process.env.PORT || 4000;
let videosPath = './videos/';
let app = express();
/*let logger = function(req, res, next){
console.log("logging...");
}
app.use(logger);*/
//view engine
app.set('view engine', 'ejs');
app.set('views', path.join( __dirname, 'views'));
//routing alternative
//app.use(express.static('public'));
// using body parser
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.get('/videos/:id',function(req,res){
fs.readdir(`./videos/${req.params.id}`, (err, files) => {
console.log(files);
res.render('pages/index',{videos:files,cateogry_id:req.params.id});
});
});
app.get('/',function(req,res){
res.render('index');});
app.listen(port, function(){
console.log("server runnung on 4000");
});
使用EJS进行模板渲染:
参考此 link 教程,
在项目的根目录中创建 views 文件夹,我们在其中创建用于渲染的 ejs 页面
现在在 projectName/views/
中创建 index.ejs
文件
在您的 index.ejs
文件中
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</head>
<body>
<h3><%=videos.length+'total videos'%><h3>
<div class="row">
<% videos.forEach(function(video)){ %>
<div class="col-lg-4 my-2">
<video width="320" height="240" autoplay>
<source src="<%= '/videos/'+category_id+'/'+video%>" type="video/mp4">
</video>
</div>
<%})%>
</div>
</body>
</html>
我们将使用fs
读取视频文件夹内容
在您的视频文件夹中,通过 category_id 创建文件夹,在其中放置您的视频
喜欢videos/1/myvideo.mp4
将此添加到您的 app.js 文件中
var fs = require('fs');
var ejs=require('ejs');
// set the view engine to ejs
app.set('view engine', 'ejs');
app.get('/category/:id',function(req,res){
fs.readdir(`./videos/${req.params.id}`, (err, files) => {
console.log(files);
res.render('pages/index',{videos:files,cateogry_id:req.params.id});
});
});
我正在从事一个视频门户项目。 server.I 上午使用 nodejs 技术将视频分类到不同的文件夹中。我的 objective 是一个读取文件夹的函数,提供文件夹中的所有视频内容。 目前,下面的代码服务于特定文件而不是文件夹。我将会 感谢您的贡献。谢谢
let express = require('express');
let bodyParser = require('body-parser');
let path = require('path');
let fs = require('fs');
var ejs=require('ejs');
let port = process.env.PORT || 4000;
let videosPath = './videos/';
let app = express();
/*let logger = function(req, res, next){
console.log("logging...");
}
app.use(logger);*/
//view engine
app.set('view engine', 'ejs');
app.set('views', path.join( __dirname, 'views'));
//routing alternative
//app.use(express.static('public'));
// using body parser
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({extended: false}));
app.get('/videos/:id',function(req,res){
fs.readdir(`./videos/${req.params.id}`, (err, files) => {
console.log(files);
res.render('pages/index',{videos:files,cateogry_id:req.params.id});
});
});
app.get('/',function(req,res){
res.render('index');});
app.listen(port, function(){
console.log("server runnung on 4000");
});
使用EJS进行模板渲染:
参考此 link 教程,
在项目的根目录中创建 views 文件夹,我们在其中创建用于渲染的 ejs 页面
现在在 projectName/views/
中创建index.ejs
文件
在您的 index.ejs
文件中
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" integrity="sha384-MCw98/SFnGE8fJT3GXwEOngsV7Zt27NXFoaoApmYm81iuXoPkFOJwJ8ERdknLPMO" crossorigin="anonymous">
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
</head>
<body>
<h3><%=videos.length+'total videos'%><h3>
<div class="row">
<% videos.forEach(function(video)){ %>
<div class="col-lg-4 my-2">
<video width="320" height="240" autoplay>
<source src="<%= '/videos/'+category_id+'/'+video%>" type="video/mp4">
</video>
</div>
<%})%>
</div>
</body>
</html>
我们将使用fs
读取视频文件夹内容
在您的视频文件夹中,通过 category_id 创建文件夹,在其中放置您的视频
喜欢videos/1/myvideo.mp4
将此添加到您的 app.js 文件中
var fs = require('fs');
var ejs=require('ejs');
// set the view engine to ejs
app.set('view engine', 'ejs');
app.get('/category/:id',function(req,res){
fs.readdir(`./videos/${req.params.id}`, (err, files) => {
console.log(files);
res.render('pages/index',{videos:files,cateogry_id:req.params.id});
});
});