Giter Club home page Giter Club logo

vue-dplayer's People

Contributors

jericopulvera avatar mintsweet avatar sinchang avatar

Stargazers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

Watchers

 avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar  avatar

vue-dplayer's Issues

Not working in nuxt

I have an empty Nuxt project, I installed VueDPlayer with NPM. I import it as instructed, when I go to use it on an empty page I get the following error: render function or template not defined in component: anonymous

"nuxt": "^1.0.0",
"vue-dplayer": "0.0.10"

Subtitles Property

I've checked the files and there's no subtitles property to use on the component.

Is there a workaround around this, to display subtitles?

Playing flv files

I am trying to play flv files. I get "This video fails to load". I look at the network in Chrome debugger and I see 1M out of 86M transferred.
I am using nginx as a web server. In the log file I see a transfer of a partial video ( status 206 )

Here is a partial code of the HTML and imports.

What am I doing wrong?

  <div class="video">
    <div class="player">
      <d-player
        ref="player"
        :video="playerOptions.video"
        :preload="playerOptions.preload"
        :autoplay="playerOptions.autoplay"
        :contextmenu="playerOptions.contextmenu"
        :lang="playerOptions.lang"
        @play="onPlayerPlay($event)"
        @pause="onPlayerPause($event)"
        @ended="onPlayerEnded($event)"
        @playing="onPlayerPlaying($event)"
        @canplay="onPlayerCanplay($event)"
        @error="playerError($event)">
      </d-player>
    </div>
  </div>
</template>

<script>
// import Vue from 'vue'
import 'flv.js'
import 'hls.js'
import VueDPlayer from 'vue-dplayer'

export default {
  name: 'PlayVid',
  components: {
    'd-player': VueDPlayer
  },

这版本还是用的v2弹幕库

这版本还是用的v2弹幕库。
我这边用的revent的v2 api,前端显示弹幕的时候 type:“top” 和 “bottom” 在播放器中样式也貌似有问题

Installation problem

When I install the package via npm, I get a Vue-DPlayer.js file with this line:

Component.options.__file = "/Users/sinchang/gpm/github.com/MoePlayer/vue-dplayer/src/VueDPlayer.vue"

在IE10 this.$refs.player.dp值为空

参照您的写法
mounted() {
this.player = this.$refs.player.dp
}
但在IE10上报 this.$refs.player.dp 值为空,导致无法切换视频(switchVideo)或通过play()、pause()函数来启动暂定。

how to set attribute crossorigin ?

<d-player :options="playerOptions" crossorigin="anonymous" @canplay="canplay" @canplaythrough="canplaythrough" @loadeddata="loadeddata" @loadedmetadata="loadedmetadata" @loadstart="loadstart" @error="videoError" ref="dPlayer"> </d-player>

## does not work !

<d-player :options="playerOptions" :crossorigin="'anonymous'" @canplay="canplay" @canplaythrough="canplaythrough" @loadeddata="loadeddata" @loadedmetadata="loadedmetadata" @loadstart="loadstart" @error="videoError" ref="dPlayer"> </d-player>

#does not work ,too!

binding video url

Hello,
How can player be reload when i change video url (data bindning)
Merci

Error in mounted hook: "TypeError: Cannot set property 'container' of undefined"

是我姿势不对吗

<template>
  <div id="app" v-click>
    <div>
      <d-player ref="player" @play="play"></d-player>
    </div>
  </div>
</template>

<script>
import VueDPlayer from 'vue-dplayer'
import 'vue-dplayer/dist/vue-dplayer.css'
export default {
  name: 'App',
  components: {
    'd-player': VueDPlayer
  },
  methods: {
    play() {
      console.log('play callback')
    }
  },
   mounted() {
    // this.player = this.$refs.player.dp
  },
}
</script>
</style>

Support hls

Hi. how to import hls.js? I try any way but can`t work. please help!!

lang: 'en' does not work ..

here is my data

    video: {
    url: 'http://localhost:8080/static/video/choro.mp4',
    pic: 'http://localhost:8080/static/pictures/choro.jpg'
  },
  autoplay: false,
  theme: '#FADFA3',
  lang: 'en',
  screenshot: true,
  player: null,
  contextmenu: [
    {
      text: 'Facebook',
      link: 'https://www.facebook.com/chorodescharentes/'
    }
  ]

but I still get settngs in chinese ...

playing .flv videos ,some errs

1.Access to fetch at 'https://xxxxxxxx/77635333.flv' from origin 'http://localhost:9528' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
2.[IOController] > Loader error, code = -1, msg = Failed to fetch
3.[TransmuxingController] > IOException: type = Exception, code = -1, msg = Failed to fetch
4.Uncaught (in promise) Error: Uncaught, unspecified "error" event. (NetworkError)
at EventEmitter../node_modules/_events@1.1.1@events/events.js.EventEmitter.emit (events.js:62)
at EventEmitter._transmuxer.on (flv-player.js:236)
at EventEmitter../node_modules/_events@1.1.1@events/events.js.EventEmitter.emit (events.js:84)
at Promise.resolve.then (transmuxer.js:175)

above are 4 errors, what is the reason? but i use 'https://3333.mp4' , a mp4 file, and there is no err. why?

视频分页

#视频分页,视频的url不会实时变化

contextmenu无效,

data() {
      return {
        video: {
          url: 'http://static.smartisanos.cn/common/video/t1-ui.mp4',
          pic: 'http://static.smartisanos.cn/pr/img/video/video_03_cc87ce5bdb.jpg'
        },
        autoplay: false,
        contextmenu: [
          {
            text: 'about',
            link: 'https://github.com/DIYgod/DPlayer'
          },
        ]
      }
    }

在 ios 端不能进行播放

老师你好,我这边现在有这么一个情况:根据文档配置后,在ios端不能进行播放,我克隆下来后,就官方例子把服务起起来,ios端也不能进行播放,只显示封面图。想知道您部署到线上的例子是如何配置的,或者有什么解决的办法。 谢谢啦

rtsp

请问一下可以支持播放rtsp流媒体嘛?

移动端点击事件

在移动端上点击视频播放和暂停都没反应,请问这个问题解决了吗

custom http header

I use d-player with php streaming it works fine am I able to add custom http header to video request ?
I pass token in url but if It's possible to add token in header It would be better

异步请求

异步请求回来视频的地址,设置 options.video.url 不能播放。

I think there is a mistake Readme.md.

I think

    import VueDPlayer from 'vue-dplayer'
    import 'vue-dplayer/dist/vue-dplayer.css'

should be

    import VueDPlayer from 'vue-dplayer'
    import 'dplayer/dist/DPlayer.min.css'

because the component is installed into the directory "dplayer" under "node-modules".

Recommend Projects

  • React photo React

    A declarative, efficient, and flexible JavaScript library for building user interfaces.

  • Vue.js photo Vue.js

    🖖 Vue.js is a progressive, incrementally-adoptable JavaScript framework for building UI on the web.

  • Typescript photo Typescript

    TypeScript is a superset of JavaScript that compiles to clean JavaScript output.

  • TensorFlow photo TensorFlow

    An Open Source Machine Learning Framework for Everyone

  • Django photo Django

    The Web framework for perfectionists with deadlines.

  • D3 photo D3

    Bring data to life with SVG, Canvas and HTML. 📊📈🎉

Recommend Topics

  • javascript

    JavaScript (JS) is a lightweight interpreted programming language with first-class functions.

  • web

    Some thing interesting about web. New door for the world.

  • server

    A server is a program made to process requests and deliver data to clients.

  • Machine learning

    Machine learning is a way of modeling and interpreting data that allows a piece of software to respond intelligently.

  • Game

    Some thing interesting about game, make everyone happy.

Recommend Org

  • Facebook photo Facebook

    We are working to build community through open source technology. NB: members must have two-factor auth.

  • Microsoft photo Microsoft

    Open source projects and samples from Microsoft.

  • Google photo Google

    Google ❤️ Open Source for everyone.

  • D3 photo D3

    Data-Driven Documents codes.