Using Webaudio in vscode extension - javascript

I wrote a vscode extension that creates a webview panel and I'd like to play an audio buffer when the user clicks a button on my page. I have this identical code working in a test page in a browser so I think I'm doing the webaudio part correctly.
I initialized with vscode.window.createWebviewPanel(...).
When I click the button on the page, it looks like the code is working (there are no errors thrown and the expected code path happens) but I don't hear any sound.
Is there something muting the sound in the webview? Is there something I have to do to tell vscode that sound is expected?
Or is it just impossible to make a sound in a vscode extension?
EDIT:
One more detail that I forgot to mention. I am creating the audio buffer in javascript but I am loading a number of small .mp3 files that I'm using as source. So it requires XHR to receive the .mp3 file and decodeAudioData to decode it.

From my experience, Web Audio API works fine in a VS Code webview panel, but its support for audio file types is very limited. It can’t decode .mp3 files or even .wav files.
However, an .oga file (Vorbis-encoded OGG) works.

Related

Open file in VLC from a href="path/of/file..WAV"

I'm looking a way to open a .wav49 on VLC with a link from my web app. Since files with .wav49 are not supported by <audio> tags. And I can't change the file type to a normal .wav or .mp3 due to several reasons.
The audio files are located in a shared folder on my server (which is a Windows Server 2016), so everyone on our network can access them.
The goal of my app is to make the audio file searching something easy.
I've been looking for options like change the format in backend and stream a .mp3 file to the audio tag or a plugin that allows to play .wav49 files but it seems that the easiest way is just to send the file to be opened on VLC.
The only I have for now is this
<a href="file:\\CENTRAL\path\audio.WAV">
I also tried with
<a href="file:\\CENTRAL\path\audio.WAV" download="test">
But neither works.
Only in Firefox, when I click the link ask me if I want to save it or just open it, but both of the options download the file. I don't want to download the file, I just want to launch an alert asking if the user wants to launch VLC and open the audio.
There are some examples of what I want to do, like roblox.com when a user click on the play button and he has the app installed, the browser launch the app on the local machine and gives the params of the game the user wants.
Another example is comodo remote control, when an user of comodo is in the web device manager and wants to begin a remote session, the user just click a button and an alert appears asking if the user wants to launch the remote control by Itarian app, if the user says yes, the app is launched in the local machine.
I found this Open video stream on VLC Player through the browser but it seems doesn't work anymore.
First of all, the standard path separator to be used here is a forward-slash, also if you want to link to a local file you need to use the file:/// prefix with three slashes. For network shares you would use two slashes: file://smbhost/path
So i would recommend you try the following:
<a href="file://CENTRAL/path/audio.WAV">
Hope this helps

Uploading an mp3 file with no backend

I'm making a music visualizer, and it's functional if the mp3 file is in the repository. So any songs it plays have to already be downloaded by me. I want to create kind of a drag and drop option where users can put mp3 files and then watch them being played. However, if at all possible, I'd like to avoid building an entire backend just for this one feature.
Is there a way to temporarily store a user file, which disappears on refresh?
It sounds like you're looking for the FileReader API, which allows you to work with files in JavaScript after the user chooses them from a file picker. You can find more info here.
Googling "JavaScript FileReader sound" returns a ton of results, including:
JavaScript / HTML5 audio: play mp3 file loaded by user via file selector in Android Chrome
JavaScript Play Uploaded Audio
Play audio local file with html
decode & play a song using html5 file api

wkWebView fails to play local audio

Since the release of iOS9, we can render local HTML with a wkWebView using loadFileURL:allowingReadAccessToURL:
This looks good so far, but we are having problems playing a local mp3 from within the HTML.
There is an <audio> tag with a src attribute with a relative path to the mp3 file.
The iOS9-Simulator plays our mp3 correctly, but physical devices don't. Catching the error with JavaScript shows a networkState NETWORK_NO_SOURCE, which does not make sense to us...
Using an http URL as src and streaming the mp3 from the web works fine.
Has anybody managed to play local audio files with a wkWebView?
I also encountered this issue on iOS 9.2. A video with a local URL would play fine on the simulator but not on device. Debugging using Safari tools showed the video error to the the same No source error. We filed a radar for it: http://www.openradar.me/24281444
Here is the crazy part - one kludgy workaround that worked (without having to run a local web host) was that we found if you played a video first in a UIWebView then the wkwebview videos would work. We took this a step further and used a UIWebview that was hidden to play a half second video with no sound that had an autoplay attribute in the tag and the web view had
uiWebView.mediaPlaybackRequiresUserAction = false
While hacky as anything I have seen it causes the WKWebview to then play videos fine. So one more solution until they fix the issue.
It seems that code inside a WKWebView cannot access local files. I am not aware if this is intended behaviour or a bug (radar, anyone?)
Before loadFileURL:allowingReadAccessToURL: was introduced in iOS 9, there was a workaround to load a local HTML file by copying it to tmp/www.
Surprisingly, files there can then be access from inside the WKWebView – including media files.
Pretty easy fix actually you just need to prefix the src URL with localhost and your WKWebview port (default 12344).
Turn A into B:
<!-- A -->
<audio src="img/beep.mp3" controls></audio>
<!-- B -->
<audio src="http://localhost:12344/img/beep.mp3" controls></audio>

Chrome not playing audio files

I'm having trouble getting chrome to play the audio files on this website: http://pyramids-tapes.com/
I'm using this plugin, whose demo is working in chrome: http://tympanus.net/codrops/2012/07/12/old-school-cassette-player-with-html5-audio/
From looking at my network tab, I'm seeing that the server is returning a 206 partial content status for the mp3 file, but I'm not sure what is causing this, visiting the file directly in the browser plays the file fine (http://pyramids-tapes.com/songs/never_satisfied.mp3).
Can anyone help me with this?

VideoJS player gets stuck with IE9

I'm trying to implement HTML5 Video in a site and for that I'm using VideoJS, so far it works great in Firefox and Chrome but my problem comes when I try to play the video with IE9. The player would load and when I click on the Play button, the loading image would appear and it would get stuck without doing anything.
I've checked other websites and they suggest that the MIME Type that the server is sending is wrong but I've checked already that and it's not the case.
Any ideas?
Have you checked to make sure you are mp4 file is using the H.264 compression scheme?
Your issue is common, and the above answer barely scratches the surface.
MP4 files neet to have their indexes written ahead of the video data within the file. IE isn't freezing, it's actually downloading your video all at once. You can inspect this from your console.
The fix is very simple. Download the AIR application QTIndexSwapper2, and run your MP4 files through it. Reload those files to your server and they will seamlessly stream through the VideoJS SWF Player.
Make sure you have controls and autplay

Categories