本文过程较为复杂，且部分内容已无法实现，建议点击这里查阅最新的操作方法！
前言：本文操作需要你具备浏览器安装和使用扩展插件的能力、以及简单的使用命令行的能力。
第一步：下载视频
首先我使用 Edge 浏览器（Chrome 操作类似，不过安装扩展需要科学上网）。
2023 年初的时候，用 FetchV 这个扩展是非常方便的，它会自动嗅到网页中的视频，即使没有嗅到也可以用录制的方式来保存。
但到了过了一两个月发现 FetchV（及其马甲）经常打不开，或者无法嗅到视频流，更别提录制了。
所以我找到了另一款专业视频下载神器：
当然它的马甲们用法也是大同小异，主界面是这样的：
开启捕获，同意下载多个文件，然后播放视频，耐心等待。
心急的朋友可以用修改播放速度的扩展（如 视频加速减速控制），例如用 16 倍速，那么一个 16 分钟的视频用 1 分钟就播放完成了。（或者在 F12 的控制台中使用 JS 代码加速：document.querySelector('video').playbackRate = 16; ）
等小浮框提示“捕获完成 点击下载”的时候就可以保存到磁盘上了。
第二步：音频修复
下载后它会有两个 .mp4 文件保存到电脑上，其中较大的是视频部分，较小的是音频部分。
但是有个小问题是，这个音频文件用 Windows 自带播放器播放正常，用 potplayer 等第三方播放器或者一些视频编辑软件播放就会有问题。
我在 Microsoft Store 中找了一款叫 Movie Maker - Video Editor 的应用，
在这个软件中添加刚才的只有音轨的视频文件会提示转码，转码后的 .mp4 文件音轨就正常了。
具体步骤是依次点击“Create New Project”，“Add clip”，“Photo/Video”，选择文件后“Transcode”，保存以后默认会在文件名后加上“ (Transcoded).mp4”。
第三步：音视频合成
接下来是合成视频和音频，将视频文件命名为 v.mp4，音频文件命名为 a.mp4。
在 FFmpeg 官网下载 Windows 版，然后使用这个命令从音频文件中提取音轨：
ffmpeg -i a.mp4 -vn -acodec copy a.aac再用这个命令将 v.mp4 的视频和 a.aac 的音频合成一个新的文件
ffmpeg -i v.mp4 -i a.aac -c:v copy -c:a copy -map 0:v:0 -map 1:a:0 output.mp4相比于其它的视频转换工具，ffmpeg 直接提取合并的速度是极快的。
Tips：
小鹅通中学习过的课程再次打开会从上次关闭的地方开始播放，这会导致捕获不全，可以将进度条手动拖到末尾，这样它会停止播放，再次刷新就会从头开始播放。
浮框中“点击下载”可能没反应，估计是在合成文件，过几秒钟多点几下，不会重复下载。
如果要下载的视频比较长或者比较多，可以像我一样在虚拟机里进行，把视频播放器的音量开到最大，把操作系统的声音关闭。
从朋友圈发布的视频时长限制30秒
从视频号发布的视频时长限制30分钟
视频号助手网址：https://channels.weixin.qq.com/platform，管理视频号创作内容，相当于抖音巨量百应达人工作台。
视频号小店网址：https://channels.weixin.qq.com/shop，管理商品和订单，相当于抖店。
视频号直播可会生成推流地址和密钥。
微博可选“拉流”或“推流”，推/拉是针对直播平台来说的，即此处的“拉流”是指微博从视频源（如阿里云视频直播）拉流，“推流”指视频源（如 OBS）往微博推流。
微博或抖音的“拉流”方式以及 OBS 软件的使用方式请参考文章：如何使用阿里云视频直播服务在抖音上直播监控摄像头画面，建议先了解一下流程，有助于进一步配置“推流”方式。
第一步，从微博直播的“推流”方式或微信视频号的创建直播页面中生成推流地址和密钥：
第二步，配置 OBS Studio 的推流服务：
服务选择“自定义”，填入服务器和串流密钥，“应用”。
点击“开始推流”。
在微博或视频号中预览直播并继续创建完成。
前提：
监控摄像头有推流功能
抖音有直播权限（粉丝数超过 1000）
一个已备案的域名
名词解释：
推流地址：由阿里云生成的接收摄像头视频流推送的地址。
播流地址：由阿里云生成可用于终端播放的视频流地址。
各环节功能解释：
摄像头：负责采集视频信息，并推送到阿里云。
阿里云视频直播服务：接收视频推流并分发到用户端（收费）。
OBS 软件：负责将视频流转化为可供直播伴侣调用的视频源。
直播伴侣：将视频源分发到短视频终端用户。
第一步：配置阿里云视频直播服务
1.1 在阿里云控制台中开通视频直播，在域名管理中添加域名。
这里需要添加两个域名，一个是推流域名，一个是播流域名。顾名思义，“推流”指从摄像头将流推送到阿里云，“播流”是用户播放视频流。
以添加域名推流域名“rtmp.xoyozo.net”和播流域名“live.xoyozo.net”为例：
然后按列表中的 CNAME 地址对域名作解析即可。
解析生效后，点击任意一个域名进行配置，将推流域名和播流域名相互绑定。成功后，可以在推流域名中的播流信息中看到播流域名，在播流域名的推流信息中也能看到推流域名。
1.2 生成推流地址/播流地址
在工具箱中点击地址生成器。
选择推流域名和播流域名，AppName 和 StreamName 任意填写，生成成功后获取以下地址：
注：鉴权串是按照鉴权规则生成的串，默认有效期 30 分钟，超出时间即中断推流。可以在域名管理中修改该值，或直接关闭 URL 鉴权。
第二步：在摄像机控制面板中配置推流域名
该步骤因摄像机的品牌和型号不同而有所差异。本文以 IP CAMERA 为例。
首先使用 IP 搜索工具在局域网上搜索摄像机，找到摄像机的 IP 地址。
在浏览器上打开，输入用户名和密码进入管理面板。
在“参数设置”-“网络设置”- RTMP Publish 中，将推流地址填入到“预定网址”中，点击“应用”。
刷新后查看“直播状态”和“直播网址”是否已生效。
若配置成功，可将播流地址在视频播放器中打开观看，或直接在 iPhone 或安卓手机中打开播流地址。
第三步：使用 OBS Studio 将直播流信号转换为虚拟摄像头信号
因抖音直播伴侣无法使用播流地址作为视频源进行直播输出，故使用 OBS 将播流信号转化为虚拟的本机摄像头信号源供直播伴侣调用。
下载安装 OBS Studio，添加一个“场景”：
然后添加一个“媒体源”：
去掉“本地文件”前面的勾，将播流地址填到“输入”框中：
确定后即可预览到直播内容：
拖动视频区域可调整输出范围。
点击“启动虚拟摄像机”。
提示：OBS 创建的虚拟摄像机默认会从物理麦克风和桌面系统音频拾音，请按需在“混音器”中配置。
第四步：OBS 使用 VLC 视频源（此步可略过）
若 OBS 直接添加媒体源不稳定，可以使用 VLC 视频源。
下载安装 VLC 播放器。
在 OBS Studio 中添加来源，选择“VLC 视频源”：
点击“播放列表”右侧的“+”，选择“添加路径 /URL”：
填写播流地址并确定。
第五步：配置抖音直播伴侣使用 OBS 的虚拟摄像机信号源
下载安装抖音直播伴侣，在任意场景中添加素材，选择“摄像头”：
摄像头选择“OBS Virtual Camera”：
点击“开始直播”：
nuget 安装组件：MetadataExtractor
从文件流读取文件信息：
public IActionResult UploadFile([FromForm(Name = "[]")]IFormFile file)
{
var md = ImageMetadataReader.ReadMetadata(file.OpenReadStream());
var dic = new Dictionary<string, string>();
foreach (var m in md)
{
foreach (var t in m.Tags)
{
dic.Add(m.Name + " - " + t.Name, t.Description);
}
}
return Ok(dic);
}结果演示：
从结果中可以看到计算的尺寸、拍摄设备、拍摄时间等信息。
MetadataExtractor 是一个简单而轻便的库，用于从图像和视频文件中读取元数据。
MetadataExtractor 从 JPEG、TIFF、WebP、PSD、PNG、BMP、GIF、ICO、PCX 和相机 RAW 文件读取 Exif、IPTC、XMP、ICC、Photoshop、WebP、PNG、BMP、GIF、ICO、PCX 元数据。
此外，还支持 MOV 和相关的 QuickTime 视频格式，例如 MP4、M4V、3G2、3GP。
相机制造商特定的支持包括爱克发，佳能，卡西欧，DJI，爱普生，富士胶片，柯达，京瓷，徕卡，美能达，尼康，奥林巴斯，松下，宾得，Recononyx，三洋，Sigma / Foveon 和索尼型号。
不支持当前所选音轨的文件格式，因此无法播放视频。请尝试播放其它音轨，确认其是否支持。
打开“套件中心”，打开右上角“设置”，添加“套件来源”：http://packages.synocommunity.com/，名称如：SynoCommunity，确定。
切换到“常规”选项卡，将“信任层级”改为至少“Synology Inc. 和信任的发行者”。否则会提示以下错误：
安装 [ffmpeg] 失败。此套件并非由 Synology Inc. 发布。
在“套件中心”左侧会出现“社群”，找到“ffmpeg”安装。
如遇下载失败，多尝试几次。
或直接从官方网站下载 .spk 包：https://synocommunity.com/package/ffmpeg
在“套件中心”“手动安装”即可。
| 小米电视 5 | 小米电视 5 Pro | |
| 亮点 | 全面屏、超薄金属机身、小爱同学、远场语音、PatchWall、4K、四单元喇叭、3GB+32GB | 量子点、MEMC运动补偿、4K+HDR10+、全面屏、小爱同学、远场语音、PatchWall、4GB+64GB |
| 分辨率 | 3840x2160（4K） | |
| 背光 | 侧入式 | |
| 可视角度 | 178° | |
| 刷新率 | 60Hz | |
| 广色域 | NTSC 85% | NTSC 108% |
| CPU | Cortex A55 | |
| GPU | Mali-G31 MP2 | |
| 内存 | 3GB | 4GB |
| 闪存 | 32GB | 64GB |
| 解码能力 | 8K 视频解码 | |
| 无线 | 2.4GHz/5GHz、蓝牙、红外 | |
| 尺寸 | 55 英寸 长 1227mm 高 717.8mm 含脚架高 773.2mm 65 英寸 长 1445.9mm 高 831.4mm 含脚架高 898mm 75 英寸 长 1676.5mm 宽 973.3mm 含脚架高 1037.7mm | |
| 首发价格 | 55" ¥2999 65" ¥3999 75" ¥7999 | 55" ¥3699 65" ¥4999 75" ¥9999 |
| 首发价格（舍入） | 55" ¥3000 65" ¥4000 75" ¥8000 | 55" ¥3700 65" ¥5000 75" ¥10000 |
本文讲述使用网页开发适用于宴会、活动、年会现场 LED 大屏幕显示抽奖、抢楼、游戏、视频等互动界面，通过在浏览器中打开后 F11 全屏投影到大银幕上。
设计思路：
为了保证最佳的显示效果，设计稿的尺寸按大屏幕的“宽高比”来做（本文以4米*3米的大银幕为例，设计稿以800*600像素为例）。
由于电脑的视频输出分辨率很有可能与大银幕的宽高比不同，那么我们全屏投影后会界面会有变形，但是投影设备接收到电脑视频信号后再全屏显示到大银幕时，界面又会变回正常。
按设计稿的尺寸开发网页，并使用 CSS3 的 scale 实现整体伸缩，目的是自适应窗口尺寸来全屏显示内容，无留白、无裁切。整体拉伸的要求是文字、图片、背景、间距、iframe 等所有元素以统一的比例拉伸，无错位。
网页上通过 JS 设置一些快捷键来实现页面展示内容的切换。
若投影设备功能有限或操作员水平有限等原因导致无法顺利设置输入输出分辨率时，网页可设置 x 轴和 y 轴两个方向的伸缩系数、定位偏移量等，更灵活地实现完美投影需求。
开发要点：
网页尺寸按设计稿来定（以 800x600 为例）。
使用 CSS3 的 transform 的 scale 来实现缩放，以电脑显示器分辨率 1920x1080，宽放大 1920/800 倍，高放大 1080/600 倍，即可将设计稿全屏展示到电脑显示器上。为了更灵活，我们使用窗口大小来代替显示器分辨率，这样不管怎么改变窗口大小或者全屏，设计稿都能完整地显示在窗口上。
在页面初始化和窗口尺寸变化时重新调整设置上述比例。
代码参考：
这是一个数据可视化项目，基于D3.js。能够将历史数据排名转化为动态柱状图图表。
先来看看效果：
https://xoyozo.net/Demo/BarGraph
作者 Jannchie 见齐还提供了官方视频教程：
https://www.bilibili.com/video/av28087807
不过由于开源项目的不断更新，该教程的部分内容已失效，本文针对 2018-12-25 版本总结了一些常用的配置说明，仅供参考。
从 GitHub 下载源代码，在 src 目录中可以看到 4 个文件：
bargraph.html --> 运行示例页面
config.js --> 配置文件
stylesheet.css --> 样式表
visual.js --> 核心文件
作者并没有将代码封装为插件的方式，所以我们是通过修改 config.js 配置文件的方式应用到自己的项目中的。
visual.js 虽然是核心文件，但作者将部分示例中的代码也包含其中，但并不影响我们直接在自己的项目中引用。
以下是 config.js 中的主要属性：
| 属性 | 说明 | 参考值 |
| encoding | 数据源（csv、json）等的文件编码 | GBK / UTF-8 等 |
| max_number | 每个时间节点最多显示的条目数 | 10 |
| showMessage | 控制是否显示顶部附加信息文字 | true / false |
| auto_sort | 时间自动排序（详细含义、作用及限制见代码中注释） | true / false |
| timeFormat | 时间格式，显示于图表右下角的时间 | %Y、%Y-%M-%D 等 |
| reverse | 是否倒序 | true / false |
| divide_by | 类型根据什么字段区分？如果是 name，则关闭类型显示 | |
| divide_color_by | 颜色根据什么字段区分？ 须要注意的是，如果配置成 name，则各条颜色不同（因为 name 值各异），如果配置成 type 等，那么相同 type 值的条颜色相同。 | 字段名 |
| color | 指定部分或所有条的颜色，该项与 divide_color_by 设置有关。 | 以 divide_color_by = 'name' 为例，"中国"是其中的一项 name 值，那么该项将显示 #D62728 色： color: { '中国': '#D62728' } |
| changeable_color | 若 true 则颜色的深浅将根据数据的增长率实时改变 | |
| itemLabel | 左边文字 | |
| typeLabel | 右边文字 | |
| item_x | ||
| interval_time | 时间点间隔时间 | 2 |
| text_y | ||
| text_x | ||
| offset | ||
| display_barInfo | 如果希望不显示，则可以设置较大的值，单位像素 | |
| use_counter | ||
| step | ||
| format | 格式化数值 | |
| left_margin | ||
| right_margin | ||
| top_margin | ||
| bottom_margin | ||
| dateLabel_x | ||
| dateLabel_y | ||
| allow_up | ||
| enter_from_0 | ||
| big_value | ||
| use_semilogarithmic_coordinate | ||
| long | ||
| wait | 数据加载完成后开始播放前的等待时间 | 0 |
| update_rate |
Access to XMLHttpRequest at '********' from origin '********' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
如果仅仅是在开发环境调试，可以安装 Chrome 插件；
也可以在 PHP、ASP.NET 等后端语言中设置 header；
当然还可以在 Web 服务器上设置，如在 IIS 中：
点击“IIS 响应标头”，添加 Access-Control-Allow-Origin
总之，是在资源端设置是否允许跨域访问。
譬如使用网页播放器播放阿里云直播流时，需要在阿里云视频点播控制台-域名管理-HTTP头配置 中设置。
更多信息：