I'm trying to share a video via sharer url (https://www.facebook.com/sharer/sharer.php?u=http%3A%2F%2Fsirius.isebox.net%2Fmichal%2Ftest-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test-test%3Fdefault%3Dg5s3e2)
I can't get the video to play in facebook. When I debug using FB's open graph debugger, I get this strange error:
"Share has playable media but will not play inline because it would cause a mixed content warning if embedded. Add a secure_src or make the video src secure to fix this."
I have no idea where to add the secure_src to the header. Notice that og:video:secure_url is already present
Thanks
This is working now, honestly I have no idea why it wouldn't work before. Here's my bit of meta goodness that works:
<meta property="og:video:url" content="http://domain.tld/flv.flv">
<meta property="og:video:secure_url" content="https://domain.tld/flv.flv">
<meta property="og:video:width" content="200" />
<meta property="og:video:height" content="300" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:url" content="http://domain.tld/mp4.mp4">
<meta property="og:video:secure_url" content="https://domain.tld/mp4.mp4">
<meta property="og:video:width" content="200" />
<meta property="og:video:height" content="200" />
<meta property="og:video:type" content="video/mp4" />
<meta property="og:video:url" content="http://domain.tld/mp4.mp4">
<meta property="og:video:secure_url" content="https://domain.tld//mp4.mp4">
<meta property="og:video:width" content="200" />
<meta property="og:video:height" content="200" />
<meta property="og:video:type" content="text/html" />
You should load the video over HTTPS protocol, the mixed content warning means that your video is loading via HTTP. You can provide your video using two url tags (secure and non-secure).
Related
I am trying to get an S3 video to play in line on Facebook. My site is https://sigtwo.com/vlog/14/.
S3 Video: https://s3.amazonaws.com/spsttestbucket/20190220_142312_NF_2000k.mp4
I believe I used the proper tags as other parts of the post seem to work fine.
Meta tags are as follows:
<meta property="og:title" content="SigTwo Mapping & Imagery Solutions" />
<meta property="og:type" content="website" />
<meta property="og:url" content="http://sigtwo.com/vlog/14/" />
<meta property="og:description" content="Too many potholes on Storrow Drive after this winter. Someone needs to fix it." />
<meta property="og:image" content="http://sigtwo.com/static/img/OrangeMaskHeight500.png" />
<meta property="fb:app_id" content="571517186592163" />
<meta property="og:video:url" content="https://s3.amazonaws.com/spsttestbucket/20190220_142312_NF_2000k.mp4" />
<meta property="og:video:type" content="video/mp4" />
<meta property="og:video:height" content="720" />
<meta property="og:video:width" content="1280" />
Here are results of debugger where everything seems fine:
https://developers.facebook.com/tools/debug/sharing/?q=http%3A%2F%2Fsigtwo.com%2Fvlog%2F14%2F
I am using og:video meta tag to do sharing of video and I can play the video in Facebook newsfeed from desktop browser. However if I view the video from Facebook app, it will not not play the video and it will bring me to the article page.
You can use the Facebook Share feature from https://www.youth.sg/Spotted/People/2017/5/Captured-by-the-journey
Appreciate anyone who can help. Is there any issue with my meta tag?
<meta property="og:video" content="https://www.facebook.com/video/embed?video_id=1557722510925076" />
<meta property="og:video:width" content="1280" />
<meta property="og:video:height" content="720" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:type" content="video.other" />
<meta property="og:image" content="https://www.youth.sg/~/media/YouthSG/behind-the-gram-yk/YK-banner.ashx?w=800&h=450&thn=1" />
<meta property="og:image:width" content="800" />
<meta property="og:image:height" content="450" />
<meta property="og:title" content="Captured by the journey" />
I have a web page that shows video and people can share it to facebook.
here are the open graph meta tags im using:
<meta property="fb:app_id" content="app_id" />
<meta property="og:url" content="https://www.domain.com/show/245" />
<meta property="og:type" content="website" />
<meta property="og:title" content="Website tile" />
<meta property="og:description" content="Website description" />
<meta property="og:video" content="https://www.domain.com/uploads/09250522_18.mp4" />
<meta property="og:video:url" content="https://www.domain.com/uploads/09250522_18.mp4" />
<meta property="og:video:secure_url" content="https://www.domain.com/uploads/09250522_18.mp4" />
<meta property="og:image" content="https://www.domain.com/uploads/thumbnail.png" />
<meta property="og:video:type" content="video/mp4" />
<meta property="og:video:width" content="1280" />
<meta property="og:video:height" content="720" />
*not actual domain name and app id, for privacy purpose
When i check the page using sharing debugger, it works okay, no error whatsoever.
The shared video also looks okay, just like normal video. But when i try to play it, it shows "download file" link to the video file instead.
Any idea why this is happening? i tried using different video, using 3rd party tools like addThis to generate the share button, but the result is the same.
Just figured it out!
You need to call "og:video:type" before you set video source.
I know it's weird, but this prevents api to set video source to "flash".
So your meta tag should look like this:
<meta property="og:url" content="someurl" />
<meta property="og:type" content="video.other" />
<meta property="og:title" content="yourtitle" />
<meta property="og:image" content="https://url.com/img.png">
<meta property="og:video:type" content="video/mp4"/>
<meta property="og:video" content="https://url.com/video.mp4" />
<meta property="og:video:url" content="https://url.com/video.mp4" />
<meta property="og:video:secure_url" content="https://url.com/video.mp4" />
<meta property="og:video:width" content="videoWidth"/>
<meta property="og:video:height" content="videoHeight"/>
<meta property="fb:app_id" content="id" />
I am trying to post two videos in single playlist without using any flash player. I have tried following code.
<meta property="og:site_name" content="Test" />
<meta property="og:url" content="LINKING_URL" />
<meta property="og:title" content="test!!!!" />
<meta property="og:image" content="preview_image_url" />
<meta property="og:type" content="video.tv_show" />
<meta property="og:video:url" content="http://mydomain/video1.mp4" />
<meta property="og:video:secure_url" content="https://mydomain/video1.mp4" />
<meta property="og:video:url" content="http://mydomain/video2.mp4" />
<meta property="og:video:secure_url" content="https://mydomain/video2.mp4" />
<meta property="og:video:type" content="video/mp4" />
<meta property="og:video:width" content="480" />
<meta property="og:video:height" content="360" />
By applying this, First video is displaying on my FB wall and its playing also.
Actually I need to add two videos in single post video but its adding only one.
I have tried with video.episode, video.other, video.movie. But there is no successful result.
Any Suggestion?
I looked on how to share a video from my website on facebook like youtube
And comment there but no answer
My web site is www.wise-event.co.il and my meta tags:
<meta property="og:site_name" content="Wise Event - הדרך החכמה לניהול הערב" />
<meta property="og:title" content="Wise Event - ניהול אירועים ומוזמנים בסמרטפון" />
<meta property="og:type" content="video" />
<meta property="og:video:type" content="application/x-shockwave-flash" />
<meta property="og:video:height" content="281" />
<meta property="og:video:width" content="500" />
<meta property="og:video" content="http://vimeo.com/moogaloop.swf?clip_id=97653968" />
<meta property="og:video:secure_url" content="https://vimeo.com/moogaloop.swf?clip_id=97653968">
<meta property="og:image" content="http://www.wise-event.co.il/Content/img/WE/logo-final.png" />
<meta property="og:url" content="http://www.wise-event.co.il" />
<meta property="og:description"
content="אנו גאים להציג את מערכת Wise Event, המספקת נתונים לפני, בזמן ואחרי האירוע אודות האורחים, יוצרת מאגר לקוחות, ומנהלת את זרימת הקהל פנימה. " />
<meta name="author" content="Wise Event">
tried:
regular url supplied by vimeo... no luck
debug it using the facebook developer debugger - no warnings
Why is it still brings the image instead of the video?
In fact, your code works as shown on the Facebook object debugger : https://developers.facebook.com/tools/debug/og/object?q=http://www.wise-event.co.il
The last part says it's a video with the good attributes of the video. The reason you think there is an error is because the Share Preview doesn't show a video, but if you try to actually share your url you can see the video as show here :