Play sound in the WebView provided by vscode - visual-studio-code

I want to develop a plug-in to play local sound.So I make a demo for test with audio
:
<audio src="vscode-resource:/Users/asure/Documents/Projects/test/EffectMove.mp3" controls>
/Users/asure/Documents/Projects/test it's the directory where I tested it.I also tested after adding it to localResourceRoots.Below was what I get.
It seems that sound didn't load correctly while no errors can be found in console window.I was confused whether vscode disable audio related content in webview or something was wrong in my code.
Does anyone know how to play sound in the webview provided by vsocde

VSCode does not support playing sound with audio tag in WebView.
you can use web audio API instead.
and there is already an extension that plays local sound files with web audio API.

Because vscode does not support audio playback.
Actually, I just learned that we strip out ffmpeg and other media support from our release builds. This is by-design and something we will not change, but it does mean that many types of media playback will never be supported in webviews inside vscode
source: https://github.com/microsoft/vscode/issues/32540

Vscode v1.71 will support various audio codecs within a webView.
See release notes: ffmpeg support.
It includes mp3 suuport and
Vorbis
Flac
H.264
VP8
WAV
MP3
Ogg

Related

How to make an MP4 recorded video from an iOS app playable on Chrome?

I have an iOS app in which users upload a selfie video on my server. Afterwards, a reviewer sees the video on a back-office website, and accept/reject it.
The problem is that I upload MP4 video files from my iOS client app. When I load the file url in the <video> tag of my website, chrome doesn't load the video (no error is displayed in the console). In Safari, everything works fine.
After some researches, I saw that sometimes, mp4 video can't be played by Chrome. Strangly, I tried to play some other mp4 video found on my laptop in chrome, and it worked. As if there were several "kind" of MP4 encoding and the one my client apps uses to encode is not supported by Chrome.
I saw that Chrome could handle .webm format, but I takes a lot of time to my server (4 entiere minutes at 100% CPU...) to translate from a MP4 to a WEBM.
My questions are :
(1) Why some mp4 can be played by Chrome and other not ? How I can make Swift AVFoundation module encoding the recorded video in the "right" mp4 encoding ?
(2) If it's impossible, I'd like to encode the 2 files (webm and mp4) client-side, within the user devices (I really want to avoid handling these computations by my server as they look extremely long to perform). The problem is that Apple does not provide webm as a possible translatable format in the documentation : https://developer.apple.com/documentation/avfoundation/avfiletype. Is there any way to translate a mp4 into a webm in Swift ?
(3) If (2) is impossible, is translating a user video into different formats server-side something commonly done as a "best practice" to manage video files and make them available in all platforms ? I mean, am I just missing some client-side trick to make mp4 videos playable everywhere or is it normal when dealing with cross platform videos to budget a whole CPU machine from AWS or whatever to handle conversions server-side ?
For whatever reason, Swift was encoding in a wrong encoding. To encode in the right encoding so it's available in a <video> tag in Chrome, I used, in my iOS app :
if movieFileOutput.availableVideoCodecTypes.contains(.h264) {
// Use the H.264 codec to encode the video.
movieFileOutput.setOutputSettings([AVVideoCodecKey: AVVideoCodecType.h264], for: connection!)
}

Web Audio API: How to keep music playing when iphone is off?

The context is: iOS 9.3.2 Safari.
I'm making audio visualization on a web page. If i use the <audio> tag, play it and turn off the iphone then the audio keeps playing. But Safari doesn't support Web Audio API through streaming - AudioContext.createMediaElementSource() - so i have to buffer and decode the entire audio file in order to visualize it - AudioContext.createBufferSource().
In this case audio stops playing when i turn off the iphone.
My current solution is to add, besides createBufferSource, the <audio> tag with a tiny silent mp3 source file that loops all the time. In this case everything works fine - the iphone, when turned off, plays both the silent mp3 & the buffered real mp3.
The question: Is there a more straightforward solution (meta tags, manifest, etc.)?
btw Android 5.1 Chrome keeps playing the buffered audio as is and desktop Safari supports createMediaElementSource

HTML5 video player on iPad

Does the HTML5 video player on the iPad Safari have the capability to play equivalent Flash content ?
Since the iPad does not have Flash support, is there any way by which the same content can be converted into an HTML5 format (something which can be played on the iPad) ? If yes, does HTML5 support creation of highly complex Flash like content ?
I see this as two questions:
Since the iPad does not have Flash support, is there any way by which the same content can be converted into an HTML5 format (something which can be played on the iPad) ?
By the same token that you can take a video and convert it to .flv format, you can (and will need to) convert the video to mp4/m4v/h.264 codec format. A tutorial for converting a video to h.264 with Handbrake is found here: http://www.simplewebtv.com/en_tutorials.html?doc=video_handbrake
Please note that your server may need to have the filetype identified to properly serve video. A quick description of adding Mime types to Apache is found here: http://bignosebird.com/apache/a1.shtml
If yes, does HTML5 support creation of highly complex Flash like content ?
Yes, you can do much of what can be done with Flash with HTML5. To see great examples of all the things currently being done with HTML5 (using mostly <Canvas>), see:
http://www.html5rocks.com/en/tutorials/#canvas
http://aerotwist.com/lab/
http://www.canvasdemos.com/
This is a pretty good article on the topic as far as video is concerned: http://diveintohtml5.ep.io/video.html
If you are looking for a solution for interactive content have a look at http://swiffy.googlelabs.com/
Flash plays MP4 video files.
HTML5 video can also play MP4 video files (except on Firefox which requires WebM or Ogg).
So basically the answer is: Yes.

Need to play flash videos on iphone

I am building this iphone app for a client and they have a large set of flash video files that they need to play/stream to the iphone. I understand that the iphone doesnt natively support flv playback but isnt there anything I can do to get around this problem?
In case it helps, they are using the akamai flash player on their website to play these video files.
Thanks in advance.
Yes! - You can convert all the videos to m4v format.
There's a javascript hack available, but it will only work if it's installed on the clients web server. It's also pretty clunky and slow and will likely murder battery life.
A workaround, since you're working with video, is to convert to mp4 format.
Short answer: no flash, but conversion will do what you need.
akamai actually supports "auto-packaging" of h.264 content which may be your best option here. By uploading 1 or more h.264 files you can use those to both serve your Flash player, and akamai will also auto-package them for iPhone (chunking them into .ts files and creating an .m3u8 reference file for dynamic mobile streaming).
This allows you to not have separate encodes for mobile and web, thus saving money and time so you can leverage your existing archive.

Embedding html5 <audio> in a mobilesafari webapp. is it possible to load an image in place of the quicktime logo in the modal player?

I haven't be able to find a resource explaining if this is possible at all. The Apple documentation found here
https://developer.apple.com/library/content/documentation/AudioVideo/Conceptual/Using_HTML5_Audio_Video/AudioandVideoTagBasics/AudioandVideoTagBasics.html#//apple_ref/doc/uid/TP40009523-CH2-SW1
...doesn't mention such features.
I also tried embedding audio with the <embed> tag which pulls up the same modal quicktime player.
Is there a way to do this or alternatively – is there a way to play audio files in an iphone webapp without opening a modal external player?
I found a workaround for achieving this functionality by using Apple's mediafilesegmenter command line tool to prepare an mp3 for "HTTP Live Streaming" – Apple's new protocol for streaming media through HTTP.
More info here:
http://developer.apple.com/iphone/library/documentation/NetworkingInternet/Conceptual/StreamingMediaGuide/Introduction/Introduction.html#//apple_ref/doc/uid/TP40008332-CH1-DontLinkElementID_29
By using the arguments
--audio-only --meta-file poster.png --meta-type picture
you can create an mp3 stream that will display the poster.png image in the external quicktime player while the audio is playing.
You can play audio inline using jPlayer, a jQuery MP3 plugin.
Demo (try on iPhone): http://happyworm.com/jPlayerLab/single-page-app/#first
I'm not aware of any such customisation ability. You could perhaps instead add a bit of script that completely hides the <audio> element, and provides alternative JavaScript interaction controls styled to your choosing.