Adding a video in DNN 9 - dotnetnuke

I am trying to add a video 2mb to my evoq web site. I get a error says video.mp4 - Extension not allowed. I have added mp4 to Allowable File Extensions part. I tried to add mp3 and i got the same error. I am trying to add the video to HTML Pro module. Do I need to select another module for adding videos?

I have just done it. I went to Site Assets,uploaded the mp4. Then I clicked on the mp4 to get the url.
<video width="1056" height="594" autoplay="autoplay" loop="loop">
<source src="https://test.windows.net/portals-sandbox2/1/Images/yourvideo.mp4?sr=b&si=DNNFileManagerPolicy&sig=0HYBH1YbfYIZr3h2tGgsiRMY66YW0YJsVtMF9EIMq0k%3D&timestamp=1526412367032" type="video/mp4">
</video>

Related

Is there a special way to call videos when uploading to amplify hosting?

I'm working on a create-react-app project, the project is supposed to show a background video on landing page.
It is working perfectly on localhost:3000 but when I upload to amplify hosting, video stop showing.
I already tried to call the same video directly from this url http://ormuxwater.com/MobterVideo.mp4 on the DOM by modifying it on developer console and it is still not showing anything, so my guess is that is not a folder file location problem
I also tried calling it from different places.
first try: import MobterVideo from "../../assets/MobterVideo.mp4";
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop="loop">
<source src="{MobterVideo.mp4}" type="video/mp4" />
</video>
second try:
// calling it directly from public folder
<video playsinline="playsinline" autoplay="autoplay" muted="muted" loop="loop">
<source src="/MobterVideo.mp4" type="video/mp4" />
</video>
Is there something we need to take care for videos to work when uploading to aws amplify?
console is not returning errors and I don't know what else to look
You can see working demo in https://mobter.mx
You have to upload the video to an AWS S3 bucket (cloud hosting) and then you can src the file, that's the only way that worked for me; although I guess you could use a different cloud hosting service, but I guess it's probably better to us S3 if you're using Amplify. Here are the instruction on how to do it:
https://docs.sumerian.amazonaws.com/tutorials/create/beginner/s3-video/
You should only need steps 1 & 2

How to load external sound files to a nwjs react project - cache them?

What are the possible solutions this problem: I need to include various sound files to a react app (build into a kiosk with nwjs) on app startup.
Let me explain the expected behavior - I have a nwjs kiosk react app that will run on a Windows machine.
It should grab some UNC paths for sounds over rest api on app startup.
I need to include these paths as resources (located outside the src folder) in the app in order to play the sounds.
Is it even possible?
Linking from the project's src folder is clear to me. But how to link paths outside the src folder when I don't even know the paths beforehand?
import OKSound from "./OK.wav";
Thank you!
Looks like there is no issue with playing sounds from "outside" with the audio tag, but it's really playing a sound only after creating an exe with nwjs!
const url = "http://example.com/sound.wav";
<audio autoPlay>
<source src={url} type="audio/wav" />
Your browser does not support the audio element.
</audio>

ReactJS - large video files makes computer freeze after npm start

I've got my small react web app that runs with no problem with five low quality video.
But once I add multiple large high quality video files and I start the app, my laptop freezes and I need to manually shut it down.
<video width="90%" height="90%" margin="auto" controls>
<source src={require(('../videos/' + props.movie + ".mp4"))} type="video/mp4" alt= "video" />
</video>
My videos folder is on my src folder, Any advice?
Thanks in advance to anyone who can help!
You have to load you video files inside componentDidMount() lifycycle method when component is mounted.

Video tag on safari (iOS) with Flask and GAE

As per title, I am trying to render a Jinja2 template with an html5 tag using a Flask backend on Google App Engine. It works with no problems of chrome/firefox (windows/android) but no luck on safari for iOS (tested on iphone 7).
<video id="media-video" width="100%" muted controls>
<source src="{{url_for('static', filename = 'test.mp4')}}" type="video/mp4">
Not supported
</video>
I have searched and read about it (e.g.
HTML5 Video tag not working in Safari , iPhone and iPad) but my case seems somehow different ... no errors are displayed but the video does not seem to be loaded (the video is h.264).
Any idea on why?
Are flask/google-app-engine adding complexity to the problem?
Try a different tag structure:
<video id="media-video"
width="100%"
src="{{url_for('static', filename = 'test.mp4')}}"
type="video/mp4"
muted controls
>
</video>

Angular CLI RTMP Video player not working

I've been trying to stream a rtmp video on Angular, but for some reason it doesn't work
my code is
<link href="http://vjs.zencdn.net/5.19.2/video-js.css" rel="stylesheet">
<script src="http://vjs.zencdn.net/ie8/1.1.2/videojs-ie8.min.js"></script>
<video id="my-video" class="video-js" controls preload="auto" width="640" height="264" data-setup="{}">
<source src="video_rtmp_url" type="rtmp/mp4">
</video>
<script src="http://vjs.zencdn.net/5.19.2/video.js"></script>
The result I get is this:
Obs: I've ran the "npm install --save videojs" command
ObsĀ²: i'm using ruby on rails on the background, there's no direct relation between it and the video player yet, but on the rails views, the exact same code works fine
ObsĀ³: There's no error or something related on the console
Besides that, what are the other options to stream RTMP on Angular?
Thanks!
The HTML5 tag does not support RTMP protocol.
RTMP was originally an Adobe protocol and flash players did support it.
Some HTML5 Javascript based video players, such as video.js that you are using, will support RTMP, but they generally do this by falling back to flash so you must have flash installed and available for it to work in this case.

Resources