Asp.Net Core下使用blob隐藏视频真实路径

作者 the7
发布于 2020年03月27日
评论 0
浏览 129

BLOB,全称为big binary large object,二进制大对象。服务端生成二进制对象返回给前端,浏览器拿到blog对象后,通过URL.createObjectURL生成临时地址,形如 blob:https://www.xx.com/xsdf-sdf-...。我们再将其赋值给video标签的src就可以了。

服务端创建对象

HomeController中添加方法

[HttpPost]
public FileStreamResult Play()
{
    var mp4 = Path.Combine(_webHostEnvironment.WebRootPath, "SampleVideo_1280x720_2mb.mp4");
    var fs = new FileStream(mp4, FileMode.Open);
    return File(fs,"video/mp4");
}

前台页面生成blob对象

<div class="text-center">
    <video id="sound" width="720" height="480" controls="controls"></video>
</div>
<script>
//创建XMLHttpRequest对象
var xhr = new XMLHttpRequest();
//配置请求方式、请求地址以及是否同步
xhr.open('POST', '/home/play', true);
//设置请求结果类型为blob
xhr.responseType = 'blob';
//请求成功回调函数
xhr.onload = function(e) {
    if (this.status === 200) {//请求成功
        //获取blob对象
        var blob = this.response;
        //获取blob对象地址,并把值赋给容器
        $("#sound").attr("src", URL.createObjectURL(blob));
    }
};
xhr.send();
</script>

浏览看看效果

再看看源码,已被转为blob方式了

总结

blob方式确实可以隐藏真实路径,但不代表视频就不能被下载了,只是下载要稍微麻烦些。我看有些视频网站在用 blob + m3u8 + ts 这种方式,做视频站点的可以尝试一下。

4条评论

  • 念往昔丶繁华竞逐

    2019年5月20日

    最后一个五官很漂亮,虽然脸稍微大了一点点,但也算普通人里漂亮的
  • Eleven

    2019年5月20日

    念往昔丶繁华竞逐:
    最后一个五官很漂亮,虽然脸稍微大了一点点,但也算普通人里漂亮的...
    这帖子真的是精品。美中不足的是,为什么要用繁体,虽然能看懂,但有些麻烦呀。
  • SukiU

    2019年5月20日

    我曾在某外企互联网公司工作过一段时间,他们就是那种工作时间聊天摸鱼,下班时间拼命工作,然后加班蹭加班费和补贴😂
微信公众号
站长帮
微信公众号,每日更新!