node.js 建video server

1:   mkdir  nodejsvideoserver

2 :    进入目录 ,   npm init  , 这个命令会生成  package.json

3 :  新建  music 目录 , 放几个测试MP3

4: node.js 如何遍历目录, 得到所有文件名字和文件细节

https://flaviocopes.com/how-to-get-files-names/

 

5 : 生成包含这些文件的json 返回给 client

参考文章 : https://stackoverflow.com/questions/38104090/how-can-i-read-files-from-directory-and-send-as-json-to-client

 

可用的实现为 :

 

6: flutter app  如何根据这个api 生成可播放的listview

medium网站的参考文章 :   https://medium.com/nonstopio/flutter-future-builder-with-list-view-builder-d7212314e8c9

此文是生成一个future build listview  , 不涉及播放

 

7 :  如何用 node.js写一个只支持 mp3 的流媒体服务器

参考 https://github.com/DarkMannn/node-radio-mini

 

 

 

 

 

 

  • 参考文章 :

a) https://github.com/illuspas/Node-Media-Server

中国人写的 media server

centos 6 32bit 安装 node.js 最新版的方法

1   先清缓存

2 安装 工具 :  n

n 是一个node.js 的版本控制工具

 

3 : 用 n 来安装最新版

 

4  安装之后, 发现执行   node -v  显示的还是旧版 , 这是因为还需要关掉当前的  terminal, 新开一个

 

node.js 如何返回json

用这句代码

 


具体实现为:

执行 node  app.js

当访问 http://IP:3000/countrys ,  会返回正确的json字符串

 


 

参考文章

https://stackoverflow.com/questions/19696240/proper-way-to-return-json-using-node-or-express


https://www.youtube.com/watch?v=EwHMSxSWIvQ   

这个教程非常好+


图片都存在 imgbb,google 账号登陆

 

less 详解

  • how to compile

in opentok-rtc project ,  use grunt to compile less into css .

Grunt 是一个插件化的打包工具, 比如编译 less的插件就是  grunt-contrib-less,  安装方法是 :

安装之后还需要 Gruntfile.js 做配置文件 ,

Grunt的 get start 网址: https://gruntjs.com/getting-started

配置文件例子 : https://gruntjs.com/sample-gruntfile

从 opentok截取出来的一个简单的Gruntfile.js 例子 , 这里只用到了编译 less的插件

之后执行  grunt  clientBuild 即可把 less 文件 编译为 css ,clientBuild  是自定义的任务名


  • How to add bower lib

在 opentok-rtc项目中, 还包括了 bower lib的引用 ,

in Gruntfile.js , it figure out where to find source less  and where to store dest css  ,  by  :

  • use which less lib ?   in tokbox-rtc . it use bower lib

npm install bower –save

之后新建 bower.json

bower install

  • opentok-rtc  room page css 分析

a)

这个是 image  , 代码为:

以data 开头的是 html5 新增的自定义属性, 可以是 data-whatever ,  具体定义见 icons.less

b)

这个是相当于radio的按钮, 可通过点击 enable 或者 not ,   用 js 实现 ,给 click 事件加 eventlistener , 从而在 class 加 activate 或者 去掉 , 示例代码:

 

 

 

 

 

  • 参考文章 :

all  css selector explains

https://www.w3schools.com/cssref/css_selectors.asp


 

***** node.js server 的 hello world , 用 express.js , less , bower

来源网站 :  https://expressjs.com/en/starter/hello-world.html

    • 安装 express. js 

npm init     初始化项目

npm install express –save    下载 express.js

新建一个 app.js 文件 ,内容为 :

此时跟目录下只有 :  app.js ,  node_modeles 文件夹, package.json 文件 。


接着安装  express-generator: 

npm install express-generator –save   下载  express-generator

此时, package.json 的 dependence应该是这样的

接着执行 :  express -e myapp

意思是,  view用 ejs模板, 建立一个名为 myapp 的应用程序

之后:

install dependencies:
$ cd myapp && npm install

run the app:
$ DEBUG=my-application ./bin/www

照做, 之后访问 :   http://yourIP:3000/ , 会看到index 页面


CSS 

该项目在 /myapp/public/stylesheets/  目录会自动生成一个style.css文件 , 内容为 :

如果要使用 less , 可以先安装一个  less 中间件:

然后修改  myapp/app.js , 增加:

此方法来自 :  https://stackoverflow.com/questions/11219637/using-less-with-node-js

去掉原帖中的  app.configure() 是因为 :  app.configure() is no longer part of Express 4.

接着建立一个简单的less文件, 测试能不能正常转换

****   以上全部取消, 因为opentok-rtc用的不是这个方法 ,  用的是 grunt  ,方法是:

首先在 package.json 的 dependency 加上 :

这里说的 package.json 是跟目录的,而不是 myapp的

然后 npm install

grunt 安装完成后, 会在 网站根目录生成一个 名为: Gruntfile.js的配置文件

错, 这个文件需要自己创建

内容为:(此处的路径需要参考自己的情况)

 

可以看出来, 在这个配置文件中, less和 css 文件的路径都指定好了


因为less文件还要用到 bower component , 所以先 安装bower

首先

之后, 建立一个 bower.json 的文件,内容为

此文件显示了安装bower的目的, 因为bower是一个库管理程序,

这里 bower 安装了这个 lib  :  https://github.com/tef-components/theme

在执行

 

至此, 跟目录下出现了 bower_components 文件夹


Less 

在跟目录新建文件夹 less

/home/liuyang/learntokboxrtc/expressjshwNew/less

放入需要 bower 库支持的less文件

接着在网站跟目录执行: grunt clientBuild

即可生成 css 文件


至此所有准备工作均已完成

接下来转到 :  http://www.notesoflyang.com/?p=2390

room.ejs 及其 css分析

 

 

 

 

github 其他的tokbox项目

https://github.com/opentok/opentok-node

如何用 node.js 写一个server , 包括如何创建 session , token ,  work with archive


https://github.com/opentok/opentok-web-samples

各种 web client sample, 包括angular js , vue 等


https://github.com/opentok/learning-opentok-node

学习如何用 node.js 写 server

 

 

How to create a nodejs login app with session

 

  •   建立目录  NodeJSLogin , 进入目录

    之后,  执行

    意为:  用ejs 为引擎, 用 express-generator做脚手架工具 , 建立一个 名为 nodejslogin 的项目。

执行此命令之后 , express-genertator 会自动生成很多目录和文件


进入 nodejslogin 目录, 执行

如果是 linux 机器, 执行 :

之后, 在其他机器访问 :

http://IP:3000 即可看到初始网页

 


但是 , opentok程序明显没有用到 express-generator , 证明就是在 package.json 文件中, 没有 express-generator, 只有 “express”: “^4.0.0”,

也就是说, opentok没有用express脚手架 。

这是如何做到的 ?

答: 这是因为 opentok的 rest api 服务用的是 :

https://github.com/AntonioMA/swagger-boilerplate

在这个package 内部, 调用了 express . 和 express session

 

并且设置了例如

app.set(‘view engine’, ‘ejs’);  等 , 所以在 opentok-rtc主程序的server.js 没写这些


如何使用 ejs 模板 ,  见:

https://scotch.io/tutorials/use-ejs-to-template-your-node-application


可以把每一个页面都理解为 rest api request 的 response, 只不过有的 比如 serverhealth返回 json串, 有的返回 html