search

staskobzar / vue-audio-visual

VueJS audio visualization components
MIT License
687 stars 109 forks source link

El HTMLMediaElement pasado a createMediaElementSource tiene un recurso de origen cruzado, el nodo emitirá silencio. #91

Open ChileNetwork opened 2 years ago

ChileNetwork commented 2 years ago

I am having problem with cross-origin when i use tag in my vuejs component:

When i press play button, there is a message at console browser saying: El HTMLMediaElement pasado a createMediaElementSource tiene un recurso de origen cruzado, el nodo emitirá silencio.

It comes from : webpack:///node_modules/vue-audio-visual/src/components/AvBase.js line 147:

/**

  • Set audio context analyser. */ setAnalyser: function () { this.audioCtx = this.audioCtx || new AudioContext() this.analyser = this.analyser || this.audioCtx.createAnalyser() const src = this.audioCtx.createMediaElementSource(this.audio)

    src.connect(this.analyser) this.analyser.fftSize = this.fftSize this.analyser.connect(this.audioCtx.destination) }, any idea what could be? Thanks

patriciodilet commented 1 year ago

same issue here

staskobzar commented 1 year ago

the original comment is for plugin v2. In v2 there were a component props parameter cors-anonym that is supposed true to solve it. In new ver 3+ there is composables API should be used to have direct control over audio element. For example: https://github.com/staskobzar/vue-audio-visual/blob/master/src/components/AVLine.vue