Embedding video from HFS to website

[nikster]

Hello dear community!
maybe this question was asked before here but I can not find exact answer...

My case (HFS 2.3m):

-I have a dedicated IP so videos from my HFS server available for anyone, so I want to publish them at my Wordpress website.
However, I don't have any success - only black screens with player controls or "video load failed" message (same time, videos playing in browser without any problems). I've tried both  ways - different Wordpress players and html codes below.

(I am not expert in coding, mostly I using web tutorials):

1st code ****it worked well for Google Drive embedding****
<div style="position:relative;padding-bottom:56.25%;height:0;overflow:hidden;"> <iframe style="width:100%;height:100%;position:absolute;left:0px;top:0px;overflow:hidden" frameborder="0" type="text/html" src="ADDRESSOFMYVIDEO.mp4" width="100%" height="100%" allowfullscreen > </iframe> </div>

and 2nd code
< video controls >
< source src=”ADDRESSOFMYVIDEO.mp4″ type=”video/mp4″ >
< /video >

Maybe I am missing something in website or HFS settings?

Thank you in advance!

[LeoNeeson]

Hi! I will try to help you.

The possible reason of this, could be a 'Mixed Content Error', because WordPress is hosted (using) an HTTPS (Secure, port 443) connection, and your videos (hosted using HFS) are using an HTTP (Insecure, port 80) connection. Most browsers automatically block access to non-secure resources when they are loaded from a secure website (that's why you need to configure your WordPress). You will find a tutorial (Step by Step), on 'How to Fix the Mixed Content Error in WordPress' visiting this link HERE.

Please report back if that solves your issue (or if the problem continues).

If the problem continues, you will find more clues about this, opening your Browser's console, pressing: Ctrl+Shift+J (before the page loads, to get all the info), and the tab about Network activity. You can share your console (and those screens), here, to see if I can find the origin of your issue (take the screenshot AFTER the page was loaded completely).

Working with WordPress could be tricky, the best option would be using a hosting without HTTPS.

Cheers,
Leo.-

[rejetto]

Leo had a good idea, but it's important that you look at possible errors in console as he said, otherwise it's hard to know what the problem is.

[nikster]

The possible reason of this, could be a 'Mixed Content Error', because WordPress is hosted (using) an HTTPS (Secure, port 443) connection, and your videos (hosted using HFS) are using an HTTP (Insecure, port 80) connection. Most browsers automatically block access to non-secure resources when they are loaded from a secure website (that's why you need to configure your WordPress). You will find a tutorial (Step by Step), on 'How to Fix the Mixed Content Error in WordPress' visiting this link HERE.

Cheers,
Leo.-

Great suggestion, basically I had same in mind but did not understand what to do:)

I've tried few plugins but infortunately they did not work as supposed,

Same time I found HFS 3 release with SSL option, and it's looks like a possible solution. The only thing left is to understand how to create a SSL certificate (via Let's Encrypt?) for my IP. Also I have NoIP account and linking it to secured HFS would be a killer option
Maybe it worth to create another topic as it may be helpful for others

[rejetto]

yes, let's-encrypt is a good way to make your certificates, it can be tricky, tho. Try following their instructions.
Hopefully a future version of hfs 3 will make it easier.

Anyway, you should first confirm the problem the way I said. Press F12 and look at errors in the console.

[nikster]

yes, let's-encrypt is a good way to make your certificates, it can be tricky, tho. Try following their instructions.
Hopefully a future version of hfs 3 will make it easier.

Anyway, you should first confirm the problem the way I said. Press F12 and look at errors in the console.

From what I found, this is an error: GET https://ip_address/video.mp4 net::ERR_CONNECTION_CLOSED

For some reason website trying to connect to https instead http in embedded video. My knowlenge is not good for further investigation so I will find someone who will help, and post solution here (in case of success).

By the way, a little offtopic with Mozilla experience: in 2.3m and HFS 3 all unprotected .mp4 videos are opened as blank page with audio only and player controls (Opera and Chrome are fine). Do you have idea what to do?

[rejetto]

if the website is trying to get the video as https, while your server is only serving http, that's not going to work.
But even if you fix this and load with http, you'll probably get the error that Leo said. That's a limit of the browser.

By the way, a little offtopic with Mozilla experience: in 2.3m and HFS 3 all unprotected .mp4 videos are opened as blank page with audio only and player controls (Opera and Chrome are fine). Do you have idea what to do?

mp4 is not always the same, you can have files requiring different "codecs".
Your browser will support only some, and another browser may support different ones.
So a file that's played in Chrome may not be played in Firefox, but also some files won't play in no browser.
If you get the audio only, it's because video and audio codecs are different, so Firefox is apparently supporting that specific audio codec but not the video codec.
There's no solution that I know. In time a browser can support more formats.

[nikster]

if the website is trying to get the video as https, while your server is only serving http, that's not going to work.
But even if you fix this and load with http, you'll probably get the error that Leo said. That's a limit of the browser.

mp4 is not always the same, you can have files requiring different "codecs".
Your browser will support only some, and another browser may support different ones.
So a file that's played in Chrome may not be played in Firefox, but also some files won't play in no browser.
If you get the audio only, it's because video and audio codecs are different, so Firefox is apparently supporting that specific audio codec but not the video codec.
There's no solution that I know. In time a browser can support more formats.

Problem with video playback was found, it seems HEVC (H265) codec won't play in Mozilla. H264 working fine!

I will consult specialists regarding mixed content solution and post here updates.

Can you tell your Paypal please (or give a link), I will thank you for your amazing job

[rejetto]

this is the link, thanks in advance
https://www.paypal.com/donate/?hosted_button_id=HC8MB4GRVU5T2

so, it's the codec as I thought.
You may find this discussion interesting https://www.reddit.com/r/firefox/comments/zeg2qy/firefox_doesnt_support_h265_hevc_for_patent/

[nikster]

I found solution by using HFS3 with NoIP domain + purchased SSL certificate
I.e. HTTPS domain forwarded to my home IP via port 443

Unfortunately Wordpress plugins did not help in my case