Dplayer使用注意点

最新推荐文章于 2024-06-07 10:16:52 发布
最新推荐文章于 2024-06-07 10:16:52 发布
阅读量1.6w 收藏 3
点赞数 1
分类专栏： 插件 文章标签： Dplayer 跨域问题
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_37056728/article/details/90447482
版权

首先当然那是官方文档镇楼啊

https://dplayer.js.org/#/zh-Hans/

命名是。静态页面的html，在配置时候，已经配置成功，但是呢，这两个图片竟然有跨域错误

具体为什么会出现跨域，需要进一步研究

解决办法：开启服务器

用的是vscode，有两个指令

1、安装npm install -g live-server或者cnpm install live-server -gf 

2、live-server 将服务启动就可以访问了

服务方式开启 

静态文件开启

百里挑单
关注
  • 1
    点赞
  • 踩
  • 3
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
Dplayer实例.rar
08-12
这些示例可以帮助你快速理解和掌握Dplayer的用法，同时，"使用必看.txt"文件中可能会提供一些使用Dplayer时需要注意的法律问题和最佳实践，确保你在实际开发中合规且高效。 总之，Dplayer是一个强大且易用的前端...
nodebb-plugin-DPlayer
05-18
但请注意，不同的浏览器对视频格式的支持情况可能有所不同，建议使用跨浏览器兼容性较好的格式。 7. **性能优化**：DPlayer 的轻量化设计有助于减少加载时间和内存占用，提升用户体验。 总结来说，`nodebb-plugin-...
Dplayer 实现视频（URL）切换
dsadasjdka的博客
01-24 1万+
首先呢，先声明一个，很简单的，然后调用sw()就可以了 <div class="card" style="width:100%;height:60%;margin-top:7.5%;"> <div id="dplayer" class="background2"></div> <script> con
dplayer 1.25.0 for discuz 插件,dplayerv1.25.0
09-11
dplayer 1.25.0 for discuz 插件 视频播放器 整合discuz 3.1使用教程 真正可用的懒人方法
DPlayer - 免费开源、轻量简洁的 HTML5 视频播放器，支持弹幕播放、清晰度切换、倍速播放
最新发布
那些免费的砖
06-07 699
最近我在使用的一款简单容易集成的 web 视频播放组件，支持播放 B站弹幕。
解决vue的跨域问题
浅夏博客
10-26 676
vue中解决跨域问题
vue3使用dplayer视频播放器
ithunzi的博客
10-22 7090
https://dplayer.diygod.dev/zh/guide.html#special-thanks 官方文档地址。注意get文件的返回字段data不用改成danmaku。首先去dplayer官网生态里把。
Apache Windows配置-----跨域设置-----HTTP响应头设置-------dplayer调用apache服务时的header filed range报错解决
pon的博客
09-06 2186
一.Apache Windows配置 根据这位大佬的配置进行的博客地址 1.apache官网下载Apache HTTP Server服务器 ①、打开apache官网http://httpd.apache.org/ （或百度"download apache"）。 ②、点击Download，出现以下界面 。 ③、选择Windows版下载，点击链接。 ④、在新的界面中，会发现VC9和VC11字样......
Nginx反向代理之解决跨域
王港
09-21 382
使用DPlayer遇到跨域问题，最简单的解决办法，直接在在服务端Nginx配置允许跨域。 一、在Nginx配置文件中配置 http { add_header Access-Control-Allow-Origin *; add_header Access-Control-Allow-Headers X-Requested-With; add_header Access-Con...
VueDPlayer一个基于vue2和DPlayer的视频播放组件
08-09
在使用VueDPlayer时，开发人员需要注意以下几点： 1. 安装与引入：首先需要通过npm或yarn将VueDPlayer添加到项目中，然后在Vue组件中通过import语句引入，并在components属性中注册。 2. 属性配置：VueDPlayer有...
SSP3DPlayer
12-10
在实际使用中，用户需要注意的是，虽然2D转3D技术可以提供一定程度的立体感，但与原生3D内容相比，效果可能会有所差异。同时，观看3D视频可能需要特定的显示设备，如3D眼镜或支持3D的显示器，否则可能无法体验到完整...
dplayer 1.25.0 for discuz 插件,dplayerv1.25.0源码.zip
10-15
dplayer 1.25.0 for discuz 插件,dplayerv1.25.0源码
flv.min.js脚本
07-08
Flv.js 是 HTML5 Flash 视频（FLV）播放器，纯原生 JavaScript 开发，没有用到 Flash。由 bilibili 网站开源。 该项目依托于 Media Source Extensions，受到 hls.js 的启发。 概览： 一个实现了在 HTML5 视频中播放 FLV 格式视频的 JavaScript 库。它的工作原理是将 FLV 文件流转码复用成 ISO BMFF（MP4 碎片）片段，然后通过 Media Source Extensions 将 MP4 片段喂进浏览器。 flv.js 是使用 ECMAScript 6 编写的，然后通过 Babel Compiler 编译成 ECMAScript 5，使用 Browserify 打包。 功能： FLV 容器，具有 H.264 + AAC 编解码器播放功能 多部分分段视频播放 HTTP FLV 低延迟实时流播放 FLV 通过 WebSocket 实时流播放 兼容 Chrome, FireFox, Safari 10, IE11 和 Edge 十分低开销，并且通过你的浏览器进行硬件加速
DPlayer修改版支持切换播放器
07-08
基于DPlayer.js的修改版。 新增了切换播放器按钮，可以自由切换HLS/FLV，需要传入自定义属性playerType：“hls”，负责前端播放器显示切换内容的文字。基于DPlayer.js的修改版。 新增了切换播放器按钮，可以自由切换HLS/FLV，需要传入自定义属性playerType：“hls”，负责前端播放器显示切换内容的文字。基于DPlayer.js的修改版。 新增了切换播放器按钮，可以自由切换HLS/FLV，需要传入自定义属性playerType：“hls”，负责前端播放器显示切换内容的文字。
HTML请求nginx服务器视频关于跨域问题
zzh
05-11 2837
HTML采用flv.js与dplayer播放器来播放http-flv格式视频时，请求nignx服务器遇到了chrom跨域的问题翻译过来就是：跨域问题的原因：浏览器出于安全考虑，限制访问本站点以为的资源。解决方案显示效果 这边是我在编写前端视频播放时遇到的问题。 Access to fetch at ‘http://192.168.31.66:9999/zzh-1586620072-2020-04-11-23_47_52.flv’ from origin ‘http://localhost:8080’ has
vue3：Dplayer 使用
weixin_1095的博客
01-13 2551
Dplayer是一款上手简单，功能强大的HTML5视频播放器，我们可以使用它，快速在普通HTML、Vue、React中实现视频播放的功能需求。Dplayer同时也提供了目前各大视频站都在使用的弹幕功能，让我们的视频功能更加丰富有趣。下面小千分享如何使用Dplayer在Vue3中实现视频播放及弹幕功能。
【流媒体】手把手教你用ffmpeg+dplayer+nginx搭建流媒体服务
Japathy
08-13 262
最近想尝试把本地视频用html播放，但是遇到206问题，因为视频内容达到1.8G，即内容过大，因此考虑采用ffmpeg将视频切割为ts，使用m3u8格式+ts推送给前端，前端采用dplayer.js，于是有了本篇文章。可以看到我本地将1.8G视频切割为700多个ts文件。切割ts大文件为m3u8+多个小ts。windows安装：我是直接下载的。
Vue中实现视频播放——vue-video-player、dplayer
热门推荐
m0_46318298的博客
08-11 2万+
2、一些常见的函数和参数使用，完整代码如下。一、vue-video-player。
Apache Windows配置-----跨域CORS设置-----HTTP响应头设置-------dplayer调用apache服务时的header filed range报错解决
z69183787的专栏
11-15 692
该命令的意思是，安装Windows可托管的Apache服务，其中"-n"后面参数是自定义Windows服务名称，之后可使用Windows管理服务的命令来管理apache服务，如"net start/stop apache"（启动/停止服务）。补充句，从该界面可看出，其可以手动控制服务的开启与关闭，为了节省资源，关闭Apache服务器的时候，请先点击“Stop”关闭apache服务。服务安装完毕，完毕后，会自动测试，若有问题，窗口会提示错误，此时请根据错误自行排查。Apache服务器下载完成后，进行解压缩。
vue2 dplayer怎么使用播放
05-16
使用 Vue2 和 DPlayer 的组合进行视频播放可以遵循以下步骤： 1. 安装 DPlayer ```bash npm install dplayer --save ``` 2. 在需要使用 DPlayer 的 Vue 组件中，引入 DPlayer 和 CSS 文件 ```javascript import DPlayer from 'dplayer' import 'dplayer/dist/DPlayer.min.css' ``` 3. 在 Vue 组件中，声明一个 DPlayer 对象 ```javascript data() { return { dp: null } } ``` 4. 在 Vue 组件的 mounted 钩子函数中，初始化 DPlayer 对象 ```javascript mounted() { const options = { video: { url: 'your-video-url' } } this.dp = new DPlayer({ container: this.$refs.playerContainer, ...options }) } ``` 5. 在模板中，引入一个用于包含 DPlayer 的元素 ```html <div ref="playerContainer"></div> ``` 6. 停止播放 ```javascript this.dp.pause() ``` 7. 重新播放 ```javascript this.dp.play() ``` 注意事项： - 你需要将 `your-video-url` 替换成你自己的视频 URL - `this.$refs.playerContainer` 是在模板中声明的用于包含 DPlayer 的 `<div>` 元素的引用 - 你需要对 `options` 对象进行自定义，以满足你的具体需求。这里仅给出了一个简单的例子。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值