bilibili / flv.js Goto Github PK
View Code? Open in Web Editor NEWHTML5 FLV Player
License: Apache License 2.0
HTML5 FLV Player
License: Apache License 2.0
Hi I noticed there is a problem in README 'Getting Started' part.
When calling 'flvPlayer.attachMediaElement(videoElement);' , the videoElement is not initialized correctly.
The demo code can be changed to:
document.addEventListener("DOMContentLoaded", function(event) {
console.log("DOM fully loaded and parsed");
if (flvjs.isSupported()) {
var videoElement = document.getElementById('videoElement');
console.log(videoElement)
var flvPlayer = flvjs.createPlayer({
type: 'flv',
url: 'http://example.com/flv/video.flv'
});
flvPlayer.attachMediaElement(videoElement);
flvPlayer.load();
flvPlayer.play();
}
});
In doc ,the Enums item can't be clicked,and there is no info about the events.
flv.js可以播放swf格式吗,还是说在使用前需要转换一下。flv.js只支持H264 AAC格式吗?
请问 H5 播放器现在用的是flv.js么?
我用了 Video Speed Control 对视频进行小幅加速之后 可能会出现音画不同步问题?声音快于画面。推测是硬件太羸弱导致掉帧。但是貌似B站的视频源的校对也不足。油管没有这个问题
I create player like this:
flvjs.createPlayer(mediaDataSource, {
enableWorker: false,
lazyLoadMaxDuration: 3 * 60,
seekType: 'range',
cors: true,
isLive: true
});
but when i load flv stream, an error log print in console:
No 'Access-Control-Allow-Origin' header is present on the requested resource.
what can i do for this error?
注:此问题已通过主站渠道发送反馈 但由于发布的issue不可删除 只得就此保持原样
作为技术宅 我通过正则表达式用较少的条件尽可能多的屏蔽不喜欢的弹幕 今天更新了H5播放器之后终于能把我祖传的屏蔽列表导入进播放器啦 但是导入之后 出现了以下问题
<
)该符号在导出XML之后会转化成<
在将XML再次导入H5播放器时 转义符号并不会变为原来的符号=
) 在导入时等号及其后所有内容会丢失附XML屏蔽列表(部分)
<item enabled="true">t=(?<!被|教练.*)骂</item>
<item enabled="true">t=(?<!不|笑|雪)崩</item>
<item enabled="true">t=(?<=当|挡|档)字幕</item>
<item enabled="true">t=(?<!(?<=初|高|大).|.科|酷|搜|海外|黑喂|看门|卡成|上帝压|(日|哔)?=了)狗(?!眼|蛋)</item>
<item enabled="true">t=^(前|第)(?=[0-9一二三四五六七八九十百千万亿几两多少NW\W]*$)</item>
<item enabled="true">t=(?<=好|这么(靠?))前</item>
hey,
By using flv.min.js released version I have an issue only on Safari Version 10.0 (12602.1.50.0.10)
Resources type: XHR
and the initiator is es6-promise.js:2, where the issue is born
evry other browser is ok, Chrome, Firefox, doing the job, like a charm, but safari...
what gonna be the pitfall...
thx, in advance,
var mediaDataSource = {"type":"flv","url":"vedio2.flv"};
同目录下放了个vedio2.flv 的文件,运行demo里的index.html,
浏览器报错:
index.html:1 Not allowed to load local resource: blob:null/f50df6a4-3cd2-4297-8903-95a6ceef65f7
作者大大,这是什么原因?需要怎么改?同样的方法,播放mp4文件就可以
使用README.md里给的代码:
if (flvjs.isSupported()) {
var videoElement = document.getElementById('videoElement');
var flvPlayer = flvjs.createPlayer({
type: 'flv',
url: 'http://example.com/flv/video.flv'
});
flvPlayer.attachMediaElement(videoElement);
flvPlayer.load();
flvPlayer.play();
}
也是报同样的错误
测试了一下,点播flv一切正常,直播时用srs做服务器,obs推流一直没有成功,原因不详;
代码如下:
if (flvjs.isSupported()) {
var videoElement = document.getElementById('my-video');
var flvPlayer = flvjs.createPlayer({
type: 'flv',
isLive: true,
url: 'http://127.0.0.1:8088/hls/111111.flv'
});
flvPlayer.attachMediaElement(videoElement);
flvPlayer.load();
flvPlayer.play();
}
Unsupported audio codec idx: 2
Error: Cannot find module 'del'
at Function.Module._resolveFilename (module.js:337:15)
at Function.Module._load (module.js:287:25)
at Module.require (module.js:366:17)
at require (module.js:385:17)
at Object. (D:\Program Files\wamp\www\flv.js-master\gulpfile.js:21:13)
at Module._compile (module.js:435:26)
at Object.Module._extensions..js (module.js:442:10)
at Module.load (module.js:356:32)
at Function.Module._load (module.js:311:12)
at Module.require (module.js:366:17)
或者说, mp4 multipart playback 是否有意义?
我编译后用此播放srs2.0(http+flv)直播时,firefox等浏览器都可以,就是IE11不行
麻烦介绍下iOS和Android平台下在微信内置浏览器使用flv.js播放http-flv的可能性及兼容性,谢谢。
I tested the library on iOS (specifically iPhone 5s) and the plugin didn't work. Does the plugin support iOS devices?
我做了如下事情:
1.将flv.js目录放到/www目录下
2.用chrome或手机QQ浏览器打开http://x.x.x.x/flv.js/demo/index.html
3.在地址栏输入rtmp或hls测试地址
4.点击Load Start等,均不可播放
5.求解。。。。
有木有顶我的
https://github.com/Bilibili/flv.js/blob/5176f5d935c41a1ee8dbd9eca65b3a6fe7df6b9e/src/flv.js#L81
I think this code should only appearance in dist code and produced by “gulp build” or similar task.
use this: https://www.npmjs.com/package/babel-plugin-transform-es2015-modules-umd
作者大大,发现了这么个神奇的东西,初步弄了pc端没有问题,但是在移动端、微信、ios、安卓调试后发现是 window.MediaSource为undefined引起的,不知道作者大大有没有研究过。
the flv file i tested is this url: http://www.e0575.com/about/images/e0575.flv . when i execute the flvPlayer.load();
, it throws the exceptions below. how can i fix the problem?
flvjs.isSupported()
true
flvPlayer
FlvPlayer {TAG: "FlvPlayer", _type: "FlvPlayer", _emitter: EventEmitter, _config: Object, e: Object…}
flvPlayer.attachMediaElement(videoElement);
undefined
logger.js:99 [MSEController] > MediaSource onSourceOpen
flvPlayer.load();
undefined
FLVDemuxer] > Parsed onMetaData
logger.js:32 [TransmuxingController] > DemuxException: type = CodecUnsupported, info = Flv: Unsupported audio codec idx: 2e @ logger.js:32_onDemuxException @ transmuxing-controller.js:333_parseAudioData @ flv-demuxer.js:429parseChunks @ flv-demuxer.js:292_onInitChunkArrival @ transmuxing-controller.js:264_dispatchChunks @ io-controller.js:419_onLoaderChunkArrival @ io-controller.js:503(anonymous function) @ fetch-stream-loader.js:158
logger.js:32 [TransmuxingController] > DemuxException: type = CodecUnsupported, info = Flv: Unsupported codec in video frame: 2e @ logger.js:32_onDemuxException @ transmuxing-controller.js:333_parseVideoData @ flv-demuxer.js:647parseChunks @ flv-demuxer.js:295_onInitChunkArrival @ transmuxing-controller.js:264_dispatchChunks @ io-controller.js:419_onLoaderChunkArrival @ io-controller.js:503(anonymous function) @ fetch-stream-loader.js:158
2logger.js:32 [TransmuxingController] > DemuxException: type = CodecUnsupported, info = Flv: Unsupported audio codec idx: 2
And here is my html code:
<script src="/flv.js"></script>
<video id="videoElement"></video>
<script>
if (flvjs.isSupported()) {
var videoElement = document.getElementById('videoElement');
var flvPlayer = flvjs.createPlayer({
type: 'flv',
url: '/e0575.flv'
});
flvPlayer.attachMediaElement(videoElement);
flvPlayer.load();
}
</script>
Such an awesome plugin. Is there a way you can put the dist
package in a CDN or an open URL so it can be used without having to compile it?
Currently the player provides no support for Airplay control. I suggest display an airplay button when there is a Airplay device detected, like what dailymotion's player does.
Safari provides a event called WebKitPlaybackTargetAvailabilityEvent
and it's easy to use.
目录src/utils/exception.js 的RuntimeException类
get message() {
return this._message;
}
为undefined。如果不用的话,那可以忽略我的问题
作者你好,我之前没有做过类似视频的工作,所以有几个基础的问题想问一下
flv-demuxer.js对flv的封装格式有什么特殊要求么?
我试了下b站的flv的确可以转,但是我自己用flash做出来的flv是转换不了的
我用的flash cc 2015做的但是不支持直接导出flv,我就导出了avi再转flv..
这个flv放在你的代码里可以得到ArrayBuffer这一步,但是浏览器是没办法播放的
With Flash there's no issues, but is there a way to play an external FLV resource without facing the issues related to CORS?
As an example: http://www.mediacollege.com/video-gallery/testclips/20051210-w50s.flv
It should be in package.json, like:
"types": "./d.ts/flv.d.ts"
After that, typescript compiler can recognise the type definition file.
See https://pages.github.com, option "project site". Essentially:
demo/index.html
to gh-pages
branch. Say it will be demo.html
.gh-pages
branch, build a minified copy, etc. Consider using the stylesheets provided.README.md
. (https://bilibili.github.io/flv.js/demo.html
)Can you indicate a list of some FLV files that can actually be played with this package, please? I tried to play and with Flash worked but with the library didn't.
https://www.sit.auckland.ac.nz/wiki/images/9/9f/Sample.flv
http://techslides.com/demos/sample-videos/small.flv
请问是否支持IE8?
对于直播,时间越长,内存耗费越多,怀疑是送入解码器的视频流没有释放
我小白,不会写,希望有那位大牛能完善这个功能
拜读了你们的flv.js的代码.我也有一个类似的解决方案,关于html5播放flv的,读完你们的代码后,有一些mse方面的问题想交流下,能否加我qq,https://github.com/332065255这是我的github地址,qq也是结尾的数字
请问支持手机端h5页面flv格式直播吗?
It support rtmp protocal ?
if support how to config mediaDataSource ?
and i test file .flv in local get error
...............................................................
[e] > MediaSource onSourceOpen
[e] > Parsed onMetaData
[e] > DemuxException: type = CodecUnsupported, info = Flv: Unsupported audio codec idx: 2
[e] > DemuxException: type = CodecUnsupported, info = Flv: Unsupported codec in video frame: 2
..................
what happen?
Flv.js in safari causes the browser to die.
At the beginning of the buffer flow will cause playback to pause and the browser page to stop working.
我想将视频流实时的在浏览器中播放出来,视频流是H264格式的,已经研究了两天但现在还是不知该如何进行,不知是否有例子可供参考?
When play in Safari, the player controller will always display "Loading". From the Network panel, we can see the flv file is continue downloading, but no video is displayed.
我通过websocket将h264的视频流(一帧一帧传递的)传到了前台的js文件中,但是在播放该视频流的时候没有找到合适的解决方案!应该是将h264的裸流转换为flv格式的文件,但是这个转换过程是怎样进行的,是把传递过来的每一针转换为一个flv的文件还是将一段时间内的所有帧转化为flv的视频文件?转换为flv是该如何在js中进行的?研究了几天,都没有进展,希望大家能给个好一点的解决方案!
demo 不能运行啊
Hello,
Thanks for your work, I tested a HTTP FLV livestream and it's working great !
Now I'm focusing on live low latency, Do you have more informations about HTTP FLV low latency or WebSocket FLV livestreaming ?
I didn't find anything about that except this repo : https://github.com/winlinvip/videojs-flow
Thanks
A declarative, efficient, and flexible JavaScript library for building user interfaces.
🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.
TypeScript is a superset of JavaScript that compiles to clean JavaScript output.
An Open Source Machine Learning Framework for Everyone
The Web framework for perfectionists with deadlines.
A PHP framework for web artisans
Bring data to life with SVG, Canvas and HTML. 📊📈🎉
JavaScript (JS) is a lightweight interpreted programming language with first-class functions.
Some thing interesting about web. New door for the world.
A server is a program made to process requests and deliver data to clients.
Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.
Some thing interesting about visualization, use data art
Some thing interesting about game, make everyone happy.
We are working to build community through open source technology. NB: members must have two-factor auth.
Open source projects and samples from Microsoft.
Google ❤️ Open Source for everyone.
Alibaba Open Source for everyone
Data-Driven Documents codes.
China tencent open source team.