i have avi file in local file directory
file:///storage/emulated/0/ionic_download/2022-02-07/18/18-59-32.avi
but the problem is that I want to play video with above file path.
data[i].toURL() is above file path
html
<video controls autoplay width="{{top_box_width}}" height="{{top_box_height}}">
<source [src]="play_path" type="video/mp4">
</video>
.ts
let myURL = normalizeURL(data[i].toURL() ) + "#t=0.1";
console.log("222"+myURL);
this.play_path = this.sanitizer.bypassSecurityTrustResourceUrl(data[i].toURL());
console.log('Cccccontent path cahnged ', this.play_path);
this.dismiss_loading();
both myURL and play_path is not playing video…
how can I play video?
thank you
chorme://inspect result is
what is really weird for me is that with fileopener.open
it works. so file path is not wrong or not found
this.fileOpener.open("file:///storage/emulated/0/ionic_download/2022-02-07/18/18-59-32.avi", 'video/mp4')
.then(() => console.log('File is opened'))
.catch(e => {
console.log('Error opening file', e);
if(e.message == "File not found"){
alert("파일이 없습니다.");
this.localstorage_remove(file_name);
}
});
AFAIK you should not define savePath inside functions. Your html code cannot even find the variable savePath because its being defined and initialized much later after the whole HTML has been rendered.
Define your savePath variable as global then initialize it inside your function using this.savePath. Your code should work.
Related
On my code fetched the audio URL from the database and displayed it in the console but I couldn't fetch that in UI.
How to do that?
HTML code
{Question.voiceRecord === ""?
<ReactAudioPlayer src="my_audio_file.ogg" autoPlay controls />
:
<ReactAudioPlayer ref={(Question.voiceRecord) => { this.rap = voiceRecord; }}/>
}
console audio URL
How To play audio?
I am trying to reload the html5 audio when the page is loaded since it has a dynamic path but I can't seems to access the $ref property either on mounted or watch here is the code
<audio ref="player" controls>
<source v-bind:src="track">
Your browser does not support the audio element.
</audio>
watch:{
details : function(){
this.verdict = ''
this.track = '../../public/wavfile/' + this.details.file;
console.log(this.$refs)
}
},
mounted(){
console.log(this.$refs)
}
According to documentation, you cannot access refs on initial render.
try this
console.log(this.$refs['player'])
or
console.log(this.$refs.player)
I can play video files from a IIS web server to a client web app as long as they reside in the webroot directory on the server. I would like to play them from a shared directory not in the webroot, however. Is this possible??
Javascript function calling up video file, Videos is share name:
function loadAnotherVideo() {
var video = document.getElementById("video");
var source = document.getElementById("fileSelector");
var path = "//192.168.0.18/Videos/" + source.value;
alert(path);
video.src = path;
video.load();
video.play();
}
You should be able to do something like this, just make sure the App Pool has reading rights on the folder where the file is stored
File - video.aspx
private void Page_Load(object sender, System.EventArgs e)
{
//Set the appropriate ContentType.
Response.ContentType = "video/mp4";
//Get the physical path to the file.
string FilePath = "c:\path-to-video\video.mp4";
//Write the file directly to the HTTP content output stream.
Response.WriteFile(FilePath);
Response.End();
}
HTML
<video width="320" height="240" controls>
<source src="video.aspx" type="video/mp4">
Your browser does not support the video tag.
</video>
Based on a comment
Here is a post showing how to set/change a video source using javascript:
Changing source on html5 video tag
I like to use JSFiddle when designing a new interface because I find it convenient for various tools within. I'm working on the front end of a site where I want to use a video, and unlike an image, I cant just throw it up on imgur and link to it for free instant hosting while I fiddle with the interface design.
So I want to know if I can somehow use a local file on my PC as the source for an HTML video element hosted on a live site. Obviously this is trivial to do with a web project being worked on on my Desktop, but I'm not sure it can be done on a live test.
For example this would work on a page I open from my desktop, living on my PC:
<video id="Video-Player">
<source src="../movie.mp4" type="video/mp4"/>
</video>
But I don't know whether I can do the equivalent with a page living on the web.
Here's how to allow a user to select an image from their local machine. This should get you started in the right direction.
Add a file input button in the HTML
<input type="file" id="file-btn"/>
and the corresponding handler
document.getElementById('file-btn').addEventListener('change', function(e){
readFiles(e.target.files);
})
Then the code to read the files
function readFiles(files){
files = [].slice.call(files); //turning files into a normal array
for (var file of files){
var reader = new FileReader();
reader.onload = createOnLoadHandler(file);
//there are also reader.onerror reader.onloadstart, reader.onprogress, and reader.onloadend handlers
reader.readAsDataURL(file);
}
}
Now, I've only done this with images, but this is how I read the image data.
function createOnLoadHandler(file){
console.log('reading ' + file.name + ' of type ' + file.type)
function onLoad(e){
var data = e.target.result
display(data);
}
return onLoad
}
function display(data){
var img = document.createElement('img');
img.src = data;
var context = canvas.getContext('2d')
context.clearRect(0, 0, WIDTH, HEIGHT);
context.drawImage(img, 0, 0, WIDTH, HEIGHT);
}
Here is a demo of the above code.
As a side note, if you try to read images from another domain you'll run into cross origin policy issues. I would think the same problem exists for videos as well.
How to play audio with the base64-string in Internet Explorer?
Code
audio = $("#sound1")[0];
audio.src = "data:audio/wav;base64," + reader.result;
// reader.result - строка UklGRhIqBQBXQVZFZm10IBIAAAAHA...
//audio.src = "somerecord.wav";
audio.load();
Works correctly in Chrome, but not in IE.
Another way is create file and play it in IE. But how to do that without store file on disk?
If you are looking for an IE alone fix, the below code might help.
window.navigator.msSaveOrOpenBlob(recordedBlob, fileName, { type: recordingType });
where recordedBlob is the blob URL (Using the base64-string you can create one blob URL, a sample for the same is available here),
fileName is the name of the output file &
recordingType could be a JSON value like "audio/mp3"