前言:在vue中使用alipay的时候遇到了很多坑的地方,自己解决这些问题花费了自己大量时间,所记录到的错非常多,主要是由于是其他人建议的使用方式都无法使用,下面我就为有缘人总结自己遇到的错误,以及错误原因和解决方案

1.aliplay不知道如何导入相关javascript和css远程资源文件

相信你可能会遇到导入方式是直接在div中使用src导入等方式,但是你都会发现失效,内容无法识别等问题。

正确的方式是将这二个文件导入index.html的head

2.想使用dialog弹出视频 发现视频无法解析

大部分人初始学到的aplayer挂载方式是使用mouted 在页面渲染完成后加载,但是如果你使用的是el-dialog弹出方式是无法加载成功的,这个时候我们发现是空白。这个时候我考虑的方式第二种是使用事件注册aiplayer,又发现一个坑,视频每次需要二次才能实现真正的初始化,F12发现的日志第一次出现未找到容器,推测是div渲染比dialog创建慢,所以在dialog注册事件opened创建播放器,发现成功

3.阿里云播放器随着时间出现4400报错码

如果你是使用的resource的方式,你会发现开始的时候会出现正常视频,而随着时间推移会发现无法播放,这是因为阿里云播放器有自己的凭证时效。建议使用vid 和 playauth 的方式播放,如何获取playauth请查看官方文档。

最后附上图示(详细教程可以参照我的播放器教学)

vue使用aliplay避雷篇相关推荐

  1. Vue学习笔记进阶篇——Render函数

    本文为转载,原文:Vue学习笔记进阶篇--Render函数 基础 Vue 推荐在绝大多数情况下使用 template 来创建你的 HTML.然而在一些场景中,你真的需要 JavaScript 的完全编 ...

  2. Vue学习笔记入门篇——数据及DOM

    本文为转载,原文:Vue学习笔记入门篇--数据及DOM 数据 data 类型 Object | Function 详细 Vue 实例的数据对象.Vue 将会递归将 data 的属性转换为 getter ...

  3. VSCode 如何新建vue模板 - 插件引入篇

    还在一个代码一个代码的敲打吗? VSCode 如何新建vue模板 ?附图讲解:如何引入插件. 问题: 在哪儿搜索插件? 搜什么名称的插件? 如何安装插件? 解决办法:(上述问题,均如下图所示) 安装完 ...

  4. Vue学习笔记进阶篇——多元素及多组件过渡

    本文为转载,原文:Vue学习笔记进阶篇--多元素及多组件过渡 多元素的过渡 对于原生标签可以使用 v-if/v-else.但是有一点需要注意: 当有相同标签名的元素切换时,需要通过 key 特性设置唯 ...

  5. vue-resource post php,Vue学习笔记进阶篇——vue-resource安装及使用

    简介 vue-resource是Vue.js的一款插件,它可以通过XMLHttpRequest或JSONP发起请求并处理响应.也就是说,$.ajax能做的事情,vue-resource插件一样也能做到 ...

  6. vue实战入门基础篇五:从零开始仿门户网站实例-关于我们实现

    上一篇:vue实战入门基础篇四:从零开始仿门户网站实例-网站首页实现https://blog.csdn.net/m0_37631110/article/details/123045334 一.目录 第 ...

  7. vue实战入门基础篇二:从零开始仿门户网站实例-开发框架搭建

    上一篇:vue实战入门基础篇一:从零开始仿门户网站实例-前期准备工作 vue实战入门基础篇二:从零开始仿门户网-2022-2-23 21:00:27 一.目录 第一篇:前期准备工作 第二篇:开发框架搭 ...

  8. 【Vue】Vue入门 -(本地篇+网络篇)代码示例及运行效果

    一.Vue 可参考:Vue官方文档 Vue 将 DOM 元素看作是对象,可以将元素与Vue实例绑定,实现通过操作数据改变元素内容.不需要用 jQuery 手写各种各样的选择器了. 二.本地篇:Vue基 ...

  9. vue基础教程总结篇,用最短的时间入门vue.js(持续更新...)

    目前,vue已经成为前端工程师必会的框架之一,这里简单总结一下,可以让您快速的入门vue,师傅带进门,修行靠个人,最主要的还是自己多动手,多实践,本专栏会持续更新. 1.vue安装教程及简介 2.vu ...

最新文章

  1. 二十八、动态分区分配算法
  2. 坑中速记整理! 使用 kotlin 写第一个 ReactNative Android 模块
  3. 盒子端 CSS 动画性能提升研究
  4. 时间相减得到小时数 java_【高中数学】错位相减公式求差比数列的和
  5. .Net微服务实战之技术架构分层篇
  6. 启用属性,索引和存储的用途是什么?
  7. 发布会后库克接受采访:对AR感到无比兴奋
  8. pip 安装包时出现的连接超时、host不信任问题解决方案
  9. qpsk调制matlab仿真,QPSK调制解调仿真
  10. CSF文件播放器处理总结
  11. 计算机技术一直在变吗,计算机软考分数线一直是45吗
  12. 某程序员揭秘“开水团”大厂真实福利
  13. Oracle数据库各版本下载(迅雷复制粘贴直接下载,别进目录)
  14. 查询计算机软件运行的时间,BootTime(电脑运行时间查询)
  15. 主板后置音频接口图解_不用再看说明书 机箱主板接线全攻略
  16. bzoj 2959: 长跑(LCT+并查集)
  17. c语言大作业小学生测验,小学生测验 面向小学1~2年级学生,随机选择两个整数进行四则运…...
  18. 2018百度云ABC智能物联大会发布世界顶级智能边缘产品BIE
  19. minio数据迁移工具rclone
  20. 轮询调度算法(Round-Robin Scheduling)

热门文章

  1. OSChina 周一乱弹 —— 叶良辰到底是谁?
  2. LWN:关于readahead的讨论!
  3. 移动平台的产品设计世界
  4. 中文文本自动校对方法研究综述
  5. 设计模式之Factory工厂模式
  6. 大学,我是怎么边学编程边赚钱的?
  7. 基于ijkplayer+Rxjava+Rxandroid+Retrofit2.0+MVP+Material Design的android万能播放器
  8. Ubuntu12.04启动时显示“超出频率范围”的解决方法
  9. 到了35岁,软件测试职业发展之困惑如何解?
  10. 分立元件搭建自举电路解析-高端mos驱动