Html5
lengye7
这个作者很懒,什么都没留下…
展开
-
一些与音视频开发相关的前端插件
hls.jshttps://github.com/video-dev/hls.js/ 这是一个用于解析hls协议的前端插件,可以通过hls.js插件实现前端播放hls相关资源flv.js b站播放器的核心,开源,可以用于直播的播放器...原创 2019-02-17 01:01:02 · 872 阅读 · 0 评论 -
看完让你彻底搞懂Websocket原理
偶然在知乎上看到一篇回帖,瞬间觉得之前看的那么多资料都不及这一篇回帖让我对 websocket 的认识深刻有木有。所以转到我博客里,分享一下。比较喜欢看这种博客,读起来很轻松,不枯燥,没有布道师的阵仗,纯粹为分享。废话这么多了,最后再赞一个~一、websocket与httpWebSocket是HTML5出的东西(协议),也就是说HTTP协议没有变化,或者说没关系,但HTTP是不支持持久连接...转载 2019-02-17 00:54:26 · 533 阅读 · 0 评论 -
WEB通信交互的几种方式
WEB通信交互的几种方式 - 实时通信发展过程简介 简单介绍一下现在的WEB通信有以下几种方式:最基本的http请求方式,Ajax轮询,Ajax长轮询,HTML5推送事件,HTML5的WebSocket。最基本的http请求方式: 客户端向服务器端发起一个请求 服务器端接收到请求后会在服务器端进行业务逻辑处理运算 服务器端返回结果到客户端 一个很实在的例子...转载 2019-02-17 00:40:32 · 5179 阅读 · 0 评论 -
关于HLS直播流HTML页面播放解决
在最近的项目开发中,涉及了HLS直播音频流的播放,关于网上的资料较多,各种混杂,因此对此在问题解决尝试以及结果进行总结。什么是HLS首先,什么是HLS?HTTP Live Streaming(缩写是HLS)是一个由苹果公司提出的基于HTTP的流媒体网络传输协议。是苹果公司QuickTime X和iPhone软件系统的一部分。它的工作原理是把整个流分成一个个小的基于HTTP的文件来下载...转载 2019-02-17 00:17:55 · 14221 阅读 · 3 评论 -
利用h5标签video来播放视频
电脑端和手机端都可以用: //webm视频格式是稳定支持的,格式工厂提前转码标签:<video id="player" controls="true" preload="auto" loop="loop" style="margin-left:9px"/>设置好标签还要初始化一下视频屏幕大小,可以参考:js获取手机屏幕宽度、高度网页可见区域宽:document.body转载 2019-02-17 00:14:46 · 1887 阅读 · 0 评论 -
使用flv.js做直播
为什么要在这个时候探索flv.js做直播呢?原因在于各大浏览器厂商已经默认禁用Flash,之前常见的Flash直播方案需要用户同意使用Flash后才可以正常使用直播功能,这样的用户体验很致命。在介绍flv.js之前先介绍下常见的直播协议以及给出我对它们的延迟与性能所做的测试得出的数据。如果你看的很吃力可以先了解下音视频技术的一些基础概念。常见直播协议 RTMP: 底层基于TCP,在...转载 2019-02-17 00:10:45 · 3391 阅读 · 0 评论 -
HTML5视频直播及H5直播扫盲
文章来源:http://geek.csdn.net/news/detail/95188分享内容简介: 目前视频直播,尤其是移动端的视频直播已经火到不行了,基本上各大互联网公司都有了自己的直播产品,所以对于直播的一些基本知识和主要技术点也要有所了解,本次分享就向大家介绍一下其中的奥秘。内容大体框架: 1. 怎样利用 HTML5 来播放直播视频 2. 怎样录制直播视频 3. 怎样实时上...转载 2019-02-16 23:33:13 · 12147 阅读 · 2 评论 -
关于直防盗链的一些想法
关于防盗链,有许多的方法,基本都是只能防住比较低级的盗链。为了提高盗链的对抗等级,采用私有协议,私有编码或者进行加密才能阻断一些协议级的盗播。当然这种方法仍然可以利用带着客户端跑的这种方法来进行对抗,所以,如果是在电脑进行盗播,就毫无办法了。但是却有效防止了移动端的盗播,毕竟每次安装APP带着一个大体积进行盗播,也不是很方便。关于私有协议和加密或者私有编码的方式实现方法:私有编码有些不现实...原创 2019-02-16 23:18:51 · 236 阅读 · 0 评论 -
流媒体点播/直播服务架构设计,类HLS协议
有一个关于通信网络的冷笑话:2G时代,你可以看苍井空.txt3G时代,你可以看苍井空.jpg4G时代,你可以看苍井空.avi于是可以看到,如今的网络时代已经进入了流媒体时代,了解如何搭建一个流媒体服务器,是十分有意义的。最近,我们简单实现了一个流媒体点播&直播服务,采用了类似HLS协议的方法,给大家分享一下。什么是HLS?关于HLS介绍的文章,随便搜一下就可以搜...转载 2019-02-16 21:48:51 · 2381 阅读 · 0 评论 -
Flash视频播放器开发经验总结
HTTP协议更优目前几乎所有的视频点播网站全部采用HTTP协议传输数据。因为相对于诸如RTMP等协议来说,HTTP协议是无状态的,数据传输完毕就断开连接,这样服务器就可以腾出资源来服务更多的用户。而RTMP则会在用户播放期间一直维护一个连接,这样服务器的负载就非常有限。而且HTTP服务器,CDN等都已经是非常成熟的技术,成本低性能好。另外HTTP的请求可以直接使用浏览器Cookie,容易和网站...转载 2019-02-16 21:09:46 · 658 阅读 · 0 评论 -
转载:常见的15种音频格式
音频格式即音乐格式。音频格式是指要在计算机内播放或是处理音频文件,是对声音文件进行数、模转换的过程。音频格式最大带宽是20KHZ,速率介于40~50KHZ之间,采用线性脉冲编码调制PCM,每一量化步长都具有相等的长度。 目前音乐文件播放格式分为有损压缩和无损压缩两种。使用不同的格式的音乐文件,在音质的表现上有差很大的差异。有损压缩顾名思义就是降低音频采样频率与比特率,输出的音频文件会...转载 2019-02-10 20:38:31 · 16589 阅读 · 0 评论 -
7款很棒的 HTML5 视频播放器
作为下一代的网页语言,HTML5 拥有很多让人期待已久的新特性,其中之一就是 video 标签,让开发者可以在网页中和添加图片一样简单的方式添加视频。在这篇文章中,我收集了7个很棒的HTML5视频播放器,你可以很容易的应用到你的网站中,文章最后还将与大家分享使用 CSS3 和 jQuery 开发一个自定义 HTML5 视频播放器的教程。VideoJSVideoJS 是最流行的 HTML...转载 2019-02-16 15:54:53 · 24273 阅读 · 1 评论 -
什么是BLOB URL,为什么要使用它?
我有非常多的blob URL问题。我src在YouTube上搜索视频标签,发现视频src如下所示:src="blob:https://crap.crap"我打开了src视频中的blob网址,它给出了一个错误,我无法打开,但正在使用该src标记。这怎么可能?要求:什么是blob网址? 为什么使用它? 我可以在服务器上创建自己的Blob URL吗? 如果你有任何额外的细节...转载 2019-02-17 01:05:43 · 17558 阅读 · 0 评论 -
Flash 加密和破解
关于Flash(swf),我们需要明确一点:***Flash字节码的意义都是公开的 所以如果cracker真的有足够的耐心他最终还是可以破解掉你的Flash。我们能做的只是尽量提高Flash被破解的门槛让cracker破解它需要消耗的时间大于自己更新版本的间隔就好了。一般而言,对于游戏,无非是为了防止cracker修改游戏数据,制作外挂,当然也有人为了破解游戏,提取素材,提取音频,提取音乐...转载 2019-02-13 21:15:42 · 5652 阅读 · 3 评论 -
视频加密
视频加密数字版权管理(Digital Rights Management,DRM),对于在线教育、行业培训等领域都是十分重要的。视频文件的泄露,有可能造成十分严重的经济损失。传统的视频服务提供商大多是通过各种各样的防盗链机制来实现视频内容保护。该方案的基本原理是:App 服务端给客户派发专属的视频 URL,CDN 服务对请求 URL、请求 IP、HTTP 头等参数进行校验,如果校验通过,则...转载 2019-02-13 19:48:48 · 4615 阅读 · 0 评论 -
转载:flash加密解密的相关知识
转自:http://www.jz123.cn/text/0527317.html希望大家了解一些解密方面的东西,对自己的心血好好保护。最好的方法就是完全不给,一旦作品发布,必须做好被人破解的准备。另外,无论何时,不是技术相当人之间的交流性质的话,不要发论坛短消息或邮件和我讨论这一话题。 Q1:为什么要破解flash文件 我认为目前有五种性质: 一 是通过破解别人的文件,了解别...转载 2019-02-13 16:51:35 · 811 阅读 · 0 评论 -
转载:当你写爬虫时遇上Flash+加密时?教你一个方法很靠谱
今天在摸鱼(划掉)逛V2EX的时候,有个帖子引起了我的注意,求助一个网站视频加密方式, 已排除是 base64 加密 - V2EXhttps://www.v2ex.com/t/493201帖子内容:视频链接加密之后是这样的:lxxt6jIID2Byq541xEB6F3u71bYaE5A/A-1dMFS4o9mx8uzpm81KxH25u1E29:Cl7Wg|lxxt4hGGB...转载 2019-02-13 16:49:00 · 281 阅读 · 0 评论 -
记一次视频加密播放以及适配问题
最近公司要做一个卖视频的产品,既然是卖视频,那视频当然得加个密,不让别人随便下载咯。而且是课程类的视频,一个视频长度都在一个小时左右,那就也得考虑流量问题。如果是使用普通的mp4视频格式,既容易被下走,又非常浪费流量,如果用户看了前百分之十的视频内容就不想看或者想下次再看,但是以2018年的网速,说不定就已经把所有视频全都下好了,既浪费了用户的流量,也浪费了公司的流量,钱从两边都哗哗的流到了电信...转载 2019-02-13 02:32:15 · 5504 阅读 · 0 评论 -
转载:Flash视频的编码格式
SWF有5种编码格式1. Sorenson H.2632. Screen video 3. VP6 4. VP6 video with alpha channel 5. Screen video v2FLV有7种编码格式1: JPEG (currently unused)2: Sorenson H.2633: Screen video4: On2 VP65: On2 VP6...转载 2019-02-11 20:52:42 · 901 阅读 · 0 评论 -
浏览器缓存机制详解
对于浏览器缓存,相信很多开发者对它真的是又爱又恨。一方面极大地提升了用户体验,而另一方面有时会因为读取了缓存而展示了“错误”的东西,而在开发过程中千方百计地想把缓存禁掉。那么浏览器缓存究竟是个什么样的神奇玩意呢?什么是浏览器缓存:简单来说,浏览器缓存就是把一个已经请求过的Web资源(如html页面,图片,js,数据等)拷贝一份副本储存在浏览器中。缓存会根据进来的请求保存输出内容的副本。当下...转载 2019-02-08 14:08:12 · 385 阅读 · 0 评论 -
浏览器渲染页面过程与页面优化
由一道面试题引发的思考:从用户输入浏览器输入url到页面最后呈现 有哪些过程?一道很常规的题目,考的是基本网络原理,和浏览器加载css,js过程。答案大致如下: 用户输入URL地址 浏览器解析URL解析出主机名 浏览器将主机名转换成服务器ip地址(浏览器先查找本地DNS缓存列表 没有的话 再向浏览器默认的DNS服务器发送查询请求 同时缓存) 浏览器将端...转载 2019-02-08 13:53:33 · 250 阅读 · 0 评论 -
转载:音频采样
http://blog.csdn.net/l_yangliu/article/details/7372458http://wenku.baidu.com/view/527f778c6529647d2728527f.html 一、音频信号为什么要进行采集音频信号是一种连续变化的模拟信号,但计算机只能处理和记录二进制的数字信号,由自然音源得到的音频信号必须经过A/D转换器转换,成为数字...转载 2019-01-26 14:45:07 · 2439 阅读 · 0 评论 -
声音采样
声音其实是一种能量波,因此也有频率和振幅的特征,频率对应于时间轴线,振幅对应于电平轴线。波是无限光滑的,弦线可以看成由无数点组成,由于存储空间是相对有限的,数字编码过程中,必须对弦线的点进行采样。采样的过程就是抽取某点的频率值,很显然,在一秒中内抽取的点越多,获取得频率信息更丰富,为了复原波形,一次振动中,必须有2个点的采样,人耳能够感觉到的最高频率为20kHz,因此要满足人耳的听觉要求,则...转载 2019-01-26 14:44:26 · 3197 阅读 · 0 评论 -
转载:windows录音程序原理
依赖条件:1 #pragma comment ( lib, "winmm.lib" )音频的输入大体分三步1 打开设备 -----waveInOpen(打开一个音频输入设备)、2 开始录音------waveInStart开始录音3关闭设备-------waveInClose关闭录音。之前调用一下waveInReset,这样可以清掉尚在等待录音的缓冲区常用的相关API为:w...转载 2019-01-26 14:13:37 · 715 阅读 · 0 评论 -
转载:视频播放器开发 - 基本原理
在做视频播放器之前,我们先了解一些基本定义。基本定义视频连续的图像变化每秒超过24帧画面以上时,根据视觉暂留原理,人眼无法辨别单幅的静态画面;看上去是平滑连续的视觉效果,这样连续的画面叫做视频。帧率指的是视频格式每秒钟播放的静态画面数量。典型的画面更新率由早期的每秒6或8张(frame per second,简称fps)至现今的每秒120张不等。编解码我们知道,其实视频就...转载 2019-01-26 14:10:31 · 517 阅读 · 0 评论 -
转载:播放器基本原理(播放四步法)
简述播放视频前得知道要播放的视频是什么格式的,所以第一步是数据接收。接受完数据后,需要对视频做一个解复用(demux)的处理,分解为图像轨道(track)、音频轨道、字幕轨道。分解完之后,则需要进行解码,图像解码、音频解码,解码完才是输出,调用显示设备播放。一、数据接收播放器的模型其实就是输入输出模型,输入的是视频文件,如MP4文件,或者http/httpLiveStream(http...转载 2019-01-26 14:09:28 · 535 阅读 · 0 评论 -
M3U8文件
M3U本质上说不是音频文件,它是音频文件的列表文件,是纯文本文件。你下载下来打开它,播放软件并不是播放它,而是根据它的记录找到网络地址进行在线播放。 M3U文件的大小很小,也就是因为它里面没有任何音频数据。把M3U文件直接转换为音频文件是不可能的,除非你把它指向的音频文件下载下来再作处理。m3u格式的文件只是存储多媒体播放列表,提供了一个指向其他位置的音频视频文件的索引,你播放的还是那些被指向的...转载 2019-01-26 14:05:39 · 5046 阅读 · 0 评论 -
转载:python爬取网站m3u8视频,将ts解密成mp4,合并成整体视频
转载自:https://blog.csdn.net/a33445621/article/details/80377424一些网站会提供m3u8视频地址,以供下载观看。或者一些网站经过分析后发现是使用m3u8格式进行播放的,这时使用m3u8的地址链接就可以下载到相应的视频。一、关于m3u8:(https://blog.csdn.net/baidu_34418350/article/detai...转载 2019-01-25 19:46:13 · 3956 阅读 · 1 评论 -
转载:视频网站中video标签中的视频资源以blob:http呈现的探索
一、问题场景 想下载知乎视频资源,却发现视频链接是这个样子的blob:https://v.vzuu.com/b6146956-6e52-406d-8909-f3f1b81ae461当时一脸懵比啊 ~难道blob:https是什么牛逼的新协议?于是进行了一番探索二、探寻结论 结论就是blob:https并不是一种协议,而是html5中blob对象在赋给video标...转载 2019-01-25 19:42:47 · 5764 阅读 · 0 评论 -
转载:爬虫,关于 video 标签 src 带有blob:http的 一些想法
转载自:https://blog.csdn.net/Angry_Mills/article/details/82705595大家好,我是烤鸭: 之前玩爬虫的时候,看到过video标签中src属性引入的blob:http:xxxx,当时没找到解决思路,今天又遇到类似问题,就试着找了一下。这是有人问过 https://vimeo.com/ 这个网站的视频怎么下载。 htt...转载 2019-01-25 18:15:24 · 4707 阅读 · 0 评论 -
转载:抓取前端渲染的页面
随着AJAX技术不断的普及,以及现在AngularJS这种Single-page application框架的出现,现在js渲染出的页面越来越多。对于爬虫来说,这种页面是比较讨厌的:仅仅提取HTML内容,往往无法拿到有效的信息。那么如何处理这种页面呢?总的来说有两种做法:在抓取阶段,在爬虫中内置一个浏览器内核,执行js渲染页面后,再抓取。这方面对应的工具有Selenium、HtmlUnit或者...转载 2019-01-25 17:15:18 · 544 阅读 · 0 评论 -
转载:使用chrom调试
转载自:https://www.cnblogs.com/hongmaju/p/5115801.html首先我们打开开发者工具,你可以直接在页面上点击右键,然后选择审查元素或者在Chrome的工具中找到或者你直接记住这个快捷方式: Ctrl+Shift+I (或者Ctrl+Shift+J直接打开控制台),或者直接按F12。1、Elements标签页这个就是查看、编辑页面上的元素,包括...转载 2019-01-25 16:00:42 · 425 阅读 · 0 评论 -
OBS (Open Broadcaster Software)
Open Broadcaster Software是一个免费的开源的视频录制和视频实时流软件。其有多种功能并广泛使用在视频采集,直播等领域。 Open Broadcaster Software 它支持和包含以下功能: [1] 支持H264(X264)和 AAC 编码。 支持Intel Quick Sync Video (QSV) 和 NVENC。 无限量的场景和...转载 2019-01-26 14:46:41 · 1590 阅读 · 0 评论 -
HTML5浏览器嵌入窗口程序解决方案 | Hoverlees' Blog
September 22, 2012 分类: ASM/C/C++ 作者: hoverlees 浏览器嵌入窗口程序一直以来就是WEB应用程序的首选方案,这种方案只需要实现一个主窗口,并提供一些接口供脚本调用,内部的界面和逻辑处理全部用html,css,javascript去实现。我最早看到的相关应用是四五年前的新浪聊天室。我本人在后来的一些项目中也多次用到这种基于IE...转载 2019-01-26 14:52:45 · 831 阅读 · 0 评论 -
转载:浏览器渲染原理及流程
我们可能都知道浏览器含有一个渲染引擎,用来渲染窗口所展示的内容。默认情况下,渲染引擎可以显示html、xml文档及图片,它也可以借助插件(一种浏览器扩展)显示其他类型数据,例如使用PDF阅读器插件,用于显示PDF格式。但是其具体的渲染原理和流程估计也有很多人都不知道或者不清楚吧。这些天研究了一下浏览器的渲染原理,有了些心得,在这里跟大家分享一下,这里只讨论渲染引擎最主要的用途——显示应用了CSS之...转载 2019-02-07 23:54:07 · 170 阅读 · 0 评论 -
link标签的主要用法
link的rel属性有很多的值,不同的值代表了外部资源与本html文档的关系。rel属性的值可以是:alternate author canonical dns-prefetch external help icon licence manifest modulepreload next pingback prefetch preload prev searc...原创 2019-02-07 22:40:50 · 28956 阅读 · 1 评论 -
转载:五大主流浏览器内核的源起以及国内各大浏览器内核总结
下面是来自百度统计流量研究院的浏览器市场份额报告(2016年1月至今)可以看到chrome和IE依然占据了国内浏览器份额的大多半江山,尤其是chrome浏览器,近几年来发展迅速,抢走IE不少份额。另外国内一些浏览器也有不错的成绩,比如QQ、2345还有搜狗等等。下面主要总结一下,五大主流浏览器以及国内一些浏览器所使用的内核。捋一下内核的概念: 浏览器内核又可以分成两部分:渲染...转载 2019-02-06 17:26:47 · 493 阅读 · 0 评论 -
探析浏览器执行JavaScript脚本加载与代码执行顺序
本文主要基于向HTML页面引入JavaScript的几种方式,分析HTML中JavaScript脚本的执行顺序问题1. 关于JavaScript脚本执行的阻塞性JavaScript在浏览器中被解析和执行时具有阻塞的特性,也就是说,当JavaScript代码执行时,页面的解析、渲染以及其他资源的下载都要停下来等待脚本执行完毕①。这一点是没有争议的,并且在所有浏览器中的行为都是一致的,原因也不...转载 2019-01-29 00:05:58 · 625 阅读 · 0 评论 -
浏览器中JavaScript执行原理
本章我们讨论javascript在浏览器中是如果工作的,包括:下载、解析、执行的全过程。javascript的这些讨人嫌的地方我们是知道的:i.需要串行下载ii.需要解析iii.需要串行执行而在chrchromium中,js是这样解析的:(其实第一章末尾已经有了)至于一些步骤的解释,这里就不再复述了,不懂的请戳:浏览器渲染过程 拉至末尾。简直就是大魔王有木有?心中可有一...转载 2019-01-28 23:03:48 · 2444 阅读 · 0 评论 -
转载:浏览器渲染过程
转载自:http://www.cnblogs.com/inJS/p/4893434.html最近工作闲下来了,恰巧最近在研究前端性能优化相关的问题。读到很多书籍、以及以前公司分享的一些相关资料。这里将它们总结起来,以便大家学习。我们的目标是:没有白屏,对!没有白屏。以下是在同一台机器,相同网络环境的一个测试:大家都知道,浏览器产生白屏。是因为UI在渲染过程中被阻塞了。那么问题来了,...转载 2019-01-28 21:08:37 · 158 阅读 · 0 评论