I have Firebase dynamic links set up in my react-native app on both IOS and Android, and they work perfectly except for the open-graph part which works on all social platforms but not on Discord. I want it to work on Discord too.
From what I understood from Firebase links docs, the open-graph part is controlled by the social property, so I have specified it like this:
social:
{ title: `Post by Yuniac`,
descriptionText: 'Jesse Faden, the bureau director',
imageUrl: 'https://hunt-public.s3.us-east-2.amazonaws.com/hunt_logo.png'
},
When sharing the Firebase dynamic link on social platforms:
Output on WhatsApp:
Output on Discord:
I tested it on Facebook and Twitter, the links also show a preview there. On Discord, its just a plain link.
What I found online regarding this issue was happening to websites links, not Firebase links generated in a react-native app, so the solutions were often something like:
"You are missing a <meta> tag in your <head> element that is responsible for the open-graph operation"
Or something similar, but nothing about my specific use case and besides there's no <meta> tags in react-native or in a Firebase dynamic link as far as I know, so those didn't help me.
I also stumbled upon people saying that: "Your server might be blocking Discord API" reference
reference2
Is this true? and if so how can I unblock it? we use amazon services but I'm not familiar with them. Or what could be the reason our links won't show their preview on Discord? Thanks.
Related
I'm working on the sharing aspects of a website, and got stuck with google's hangouts chat.
I want links to the site to be displayed as "cards" with my preview image (ideally, an animated gif), the same way these are:
https://github.com/kkroening/ffmpeg-python
https://xkcd.com/387/
https://www.youtube.com/channel/UC2hxYQtGLEkcOMK4h8JRycA
I was hoping the generic "og:image" meta tag would do the trick, but that's not working
So, I checked out the source code of these pages, but that didn't help either:
In the github page, for example, the url to the image can be found in the og:image and twitter:image:src meta tags. I thought it would be weird for 'twitter:image:src' to be the solution, but I tried anyways. It didn't work.
I've been looking everywhere for some documentation on this, but all I can find is stuff about creating a bot, which is not what I'm looking for.
Thanks for any advice
We generate quick links in our iOS app that are supposed to point to specific content within the app. When a quick link is shared via a messaging app that supports preview snippets, we want the snippet to display custom content depending on the parameters passed when our iOS app generates a link.
For example, user wants to share an audio, the app generates a link which is then posted in a messaging app or social media. We want the preview snippet to reflect specific title/subtitle and image related to that audio.
We use a custom domain name for Branch links if that matters.
What is the right way to achieve this?
You can use Link Preview for achieving this functionality. It will enable the link to display content as a preview card in Facebook, Twitter, Pinterest, iMessage, etc. This card can contain a title, description and image (that you append in the link as OG Tags such as $og_title, $og_description, and $og_image_url) .
My team released an Android app and asked for a smart banner directing users from our website to the app and specific content; to complete this task, we are using branch.io.
According to this guide, I inserted the JavaScript snippet with the branch key found in the settings section of the dashboard and the SDK is correctly initialized.
In the dashboard we defined the styling of the banner and on which sites and devices it should appear. But the banner looks like this (on desktop):
No icon or text are set. Apparently when I use the preview link generated by branch.io it is displayed correctly.
Moreover when I initialize the banner via JavaScript and set the properties it is displayed correctly too:
branch.banner(Banner.options, Banner.data);
const deeplink = `${window.location.pathname}${window.location.search}${window.location.hash}`;
branch.setBranchViewData({
'$deeplink_path': deeplink
});
Somehow nothing from the dashboard is adopted.
Thank you for your help!
Alex from Branch.io here: the branch.banner() function and the banner you set up on the dashboard are actually separate things. The dashboard option replaced the banner() approach, which has been deprecated.
You'll want to review the full details in the set up guide. One important note is that the dashboard version does not yet support banners on desktop, as we found almost none of our partners were using that function.
Try smartbanner.js. Has a lot of custom options and behaviour at very low footprint (~ 13 KB). Takes a few meta tags to set up.
Working on a facebook messenger chatbot, I try to use Webview and Extensions to display enhanced content (in my case, a datepicker).
As describe in documentation, I send a URL Button with Messenger Extensions message, with a fallback_url to handle browser users.
{
'type': 'web_url',
'url':'https://abcdef.localtunnel.me/html/chatbotDatepicker.html',
'title': 'Pick a date',
'webview_height_ratio': 'tall',
'messenger_extensions': true,
'fallback_url': 'https://abcdef.localtunnel.me/html/chatbotError.html'
}
On my Android phone, everytime I click on that button, it properly open my webview but always and only using the fallback_url. If I remove the fallback_url it will use url as expected but then Facebook Javascript SDK only trigger errors 2071011 (like this one Messenger Extensions Javascript SDK Error 2071011).
I feel like messenger_extensions might be disable, but I couldn't find any reference in documentation about enabling or disabling it.
May be this is related to the fact my application is public (has been reviewed by facebook), but I don't think so.
Does anyone ever had a similar problem, and know how to fix this ?! Thx a lot.
its a valid bug and facebook team is working on it.Here is link to that https://developers.facebook.com/bugs/1676913532599603/
Has anyone posted a video via the Facebook Connect API to their profile / feed page?
Ideally, the video should be queued to the first frame with the superimposed Facebook's blue right arrow "play" button. Or if a thumbnail representing the video has to also be uploaded (rather than the video being queued to the first frame) as well, this is fine.
Also, when the video, or thumbnail, on the profile page is clicked, the video plays where it is - rather than going to another page off Facebook to be played there.
The question may have not been correctly worded. The term "API" was misleading to a couple of folks - and I apologize for that.
What I was trying to do was to "share" a video by linking it in Facebook, AND to have it play in the profile feed (ie. to not leave the Facebook site while viewing the video - just like YouTube and Hulu.com do).
After digging into the JavaScript that Hulu was using to get this behavior, we noticed that a link tag was missing between our version of the <meta> and <link> tags, and Hulu's.
Facebook's web page, http://www.facebook.com/share_partners.php, was missing a tag that you should have if the content is a video, and you want it played in the profile feed.
Along with:
<link rel="video_src" href="http://www.example.com/player.swf?video_id=123456789"/> ...
You should include:
<link rel="media:video" href="http://www.example.com/player.swf?video_id=123456789"/>
That will get it to play in the feed. BUT, your domain name must be whitelisted.
To get your domain whitelisted, fill out this form: http://www.facebook.com/share_partners.php#/developers/developer_help.php
I got a reply, and approval, within a day! Kudos to the Facebook developer support staff!
Use the Video.upload as described by stevedbrown or the Stream API or if you want to go simple share the link via API or share link.
Have you read the Facebook developer wiki page on this? That explains what is possible and how, it's pretty decent.