js-获取flv流文件二进制数据并分析

最新推荐文章于 2024-02-27 16:09:11 发布

莫兮是我

最新推荐文章于 2024-02-27 16:09:11 发布

阅读量828

点赞数

分类专栏： JS 多媒体文章标签： flv

本文链接：https://blog.csdn.net/u013362192/article/details/115461427

版权

JS 同时被 2 个专栏收录

59 篇文章 0 订阅

订阅专栏

多媒体

3 篇文章 0 订阅

订阅专栏

js-获取flv流文件二进制数据并分析目录

文章目录

前言
效果展示
代码实现
- `index.html`

前言

对flv流文件，进行16进制转换，并用js解析

效果展示

在这里插入图片描述

代码实现

`index.html`

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Video</title>
    <style>
        body{
            max-width: 90%;
        }
        #hex{
            background-color: #acf5ff;
            width: 40%;
            float: left;
        }
        #string{
            background-color: #ffcabf;
            width: 40%;
            float: right;
            word-wrap: break-word;
        }

    </style>
</head>
<body>
<input type="file" id="file">
<div id="hex">Hex:</div>
<div id="string">String:</div>
</body>
<script>
    const reader = new FileReader();
    const fileDom = document.getElementById('file');
    fileDom.addEventListener('change', event=>{
        const file = event.target.files[0];

            // console.log(file);
            reader.readAsArrayBuffer(file);
            reader.onload = function () {
                console.log(reader.result);
                const view = new DataView(reader.result);
                let arr = [];
                if (String.fromCharCode(view.getInt8(0)).toLowerCase() == 'f' &&
                    String.fromCharCode(view.getInt8(1)).toLowerCase() == 'l' &&
                    String.fromCharCode(view.getInt8(2)).toLowerCase() == 'v' ) {

                    console.log(view.getUint8(0).toString(16));
                    for (let i = 0, tmp = ''; i < view.byteLength; i++){
                        let str = view.getInt8(i).toString(16);
                        str = str.length < 2 ? '0x0' + str : '0x' + str;
                        tmp += str + ' ';
                        if (i < 9){
                            if (i == 8) {
                                tmp = 'Header:<br>' + tmp;
                                arr.push(tmp);
                                tmp = '';
                                arr.push('Flv Body: ');
                            }
                        }else if(i >= 9) {
                            if (i%16 == 0){
                                // console.log(view.getInt8(i+6),view.getInt8(i+7),view.getInt8(i+8));
                                arr.push(tmp);
                                tmp = '';
                            }
                        }
                    }
                }

                document.getElementById('hex').innerHTML = arr.join("<br />");

                reader.readAsBinaryString(file);
                reader.onload = function () {
                    document.getElementById('string').innerHTML = reader.result;
                }
            }
    });
</script>
</html>

莫兮是我

关注

0
点赞
踩
1

收藏

觉得还不错? 一键收藏
0
评论
js-获取flv流文件二进制数据并分析

js-获取flv流文件二进制数据并分析目录文章目录前言效果展示代码实现`index.html`前言对flv流文件，进行16进制转换，并用js解析效果展示代码实现index.html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Video</title> <style>
复制链接

扫一扫