1.需求说明
做一个H5视频播放页面，根据手机扫不同的二维码进行播放对应的视频。
2.实现思路
用nodejs做后端服务，根据url传入的参数查找对应的视频，并且把设计好的网页返回给浏览器显示出来。
3.建立nodejs项目
安装好node之后，在D盘新建一个文件夹，命名为WebVideo，按着shift键点击右键，选择【在此处打开命令窗口】
下载 npm install express --save
下载 express 框架并全局安装 npm install express-generator -g
下载中间件 npm install express-static --save
下载完后，在项目根目录下新建一个文件夹，命名为mp4用于存放视频。
再在项目根目录下新建一个文件夹，命名为www用于存放H5网页 。
(H5开发请看这里：https://blog.csdn.net/weixin_38946164/article/details/116134231)
重点是这里，创建主文件 app.js
app.js代码
const express = require("express");
const fs = require('fs');
const path=require('path');
const app = express();
//域名,***要修改成自己的
var domainName = 'http://127.0.0.1:8080/';
//js文件路径，此文件保存有需要替换的网址，文件名pages-index-index.3ac195ae.js ***要修改为实际名称
var jsPath ='./www/static/js/pages-index-index.3ac195ae.js';
//主页文件路径
var htmlPath ='./www/index.html';
//新网址
var newUrl = '';
//设置www，mp4文件夹下的文件能够访问
app.use(express.static(path.join(__dirname,'www')));
app.use(express.static(path.join(__dirname,'mp4')));
app.get('/video',function (req,res) {
var no = req.query.no; //req.query 解析前端传递过来的数据
var filePath = './mp4/' + no +'.mp4'; //拼接成视频在本地的路径
//判断视频文件是否存在
fs.exists(filePath,function(exists){
if(exists){
console.log("文件存在")
newUrl = domainName + no +'.mp4'; //拼接成视频网址 -- http://127.0.0.1:8080/1001.mp4
wei() //调用方法
}
if(!exists){
console.log("文件不存在")
//前端请求的视频文件不存在的时候播放默认视频
newUrl = 'https://vkceyugu.cdn.bspapp.com/VKCEYUGU-a450e3eb-029c-4568-83af-cd4160c8852e/18c07633-05da-4b3e-8f4d-d586cbfd5b1b.mp4';
wei()
}
});
//把旧网址替换成新网址之后，再把整个网页返回给前端显示出来
function wei(){
fs.readFile(htmlPath, function (err, data) {
if (err) {
return console.log(err);
} else {
fs.readFile(jsPath, function (err, data) {
if (err) {
return console.log(err);
} else {
//console.log("js读取成功: " + data.toString());
let str = data.toString();
//newUrl不为空才执行
if (newUrl.trim()!=="") {
//用正则表达式查找原网址并替换成新网址
str = str.replace(/(http|https):\/\/[\w\-_]+(\.[\w\-_]+)+([\w\-\.,@?^=%&:/~\+#]*[\w\-\@?^=%&/~\+#])?/g,newUrl);
fs.writeFile(jsPath,str,function(err){
if (err) {
return console.log(err)
} else {
return console.log('url替换成功')
};
});
};
};
});
res.sendFile( __dirname + "/www/index.html" ) //把index.html返回给浏览器, 用这个方法加载页面会更快
//res.writeHead(200,{"Content-Type":"text/html"});
//res.write(data.toString()); //把index.html返回给浏览器
}
//res.end();
});
};
});
app.listen(8080,'127.0.0.1');
console.log('服务开启成功：127.0.0.1:8080');
4.启动服务
5.浏览器输入网址测试
http://127.0.0.1:8080/video/?no=1002
6.生成二维码
用草料二维码生成器把域名生成二维码，手机浏览器或者微信扫码就能打开视频。
