I am using the Facebook Messenger Platform to create a generic template. I am currently using ngrok to test locally, and the image_url I input for the generic template never shows in Messenger. The generic template is sent, and the image is just blank. Using Inspect, I can see that the CSS for the image is:
background-image: url("https://external.xx.fbcdn.net/safe_image.php?d=AQA1nM3pKJnllzq0&url=https%3A%2F%2Fdc3858ef.ngrok.io%2Fassets%2Fimages%2Fvideo_image.jpg&_nc_hash=AQAlBOE-vbT8cl-i");
If I open this URL, it is just a black screen with one white pixel in the middle.
Here is the message data that I use:
messageData = {
recipient: {
id: senderID
},
message:{
attachment:{
type: "template",
payload: {
template_type: "generic",
elements: [
{
title:"Test Video Link",
image_url: MY-NGROK_DOMAIN + "/assets/images/video_image.jpg",
subtitle: "Check out this video!",
default_action: {
type: "web_url",
url: "www.google.com"
}
}
]
}
}
}
};
This image_url works fine if I open it in a browser. Similarly, if I create an 'image' type message data rather than 'template', this image is loaded in Messenger.
How can I get my image_url to load properly for a generic template?
I have the same issue. I and the problem appears when the webhook domain is the same as the image url. If you use an image on a different server, it works.
I had the same issue. I've put my local web application behind ngrok. Requesting the image directly in the browser worked fine, but when it's loaded via Facebook's safe_image.php script it would show a blank image. After a lot of debugging it turned out to be the tunnelling service itself. I switched to another service (localtunnel) and there it worked fine.
More information can also be found on this issue registered on FB:
https://developers.facebook.com/support/bugs/2151860088174161/
Update
Contacted ngrok about this and got a quick reply, this is due to Facebook blocking ngrok for this script.
Related
I am trying to add a prompt link to my Google Action:
https://developers.google.com/assistant/conversational/reference/rest/v1/TopLevel/fulfill#link
My response looks like this:
payload.prompt.link = {
name: 'Open My Website',
open: {
url: 'https://mywebsite.com'
}
}
When testing on my Nest Hub, the link does show as a suggestion on the bottom of the page. However, when I click on it, it simply sends it as an utterance to my Action instead of open the web page.
Any idea why this is happening? And what is the expected behavior for prompt links? I cannot find much documentation on them.
This appears to be the Actions Builder implementation of Link-Out Suggestions, which were not originally available when the Actions Builder was released. They were, however, available for Dialogflow previously.
Link-Out Suggestions require the "WEB_LINK" device capability to work. Smart Displays do not have this device capability.
I need to show map in facebook messenger bot. According to documentation following code should work but I only see message and place icon. Has anyone faced similar issue.
var messageData = {
recipient: {
id: userId
},
message: {
text: msg,
metadata: "DEVELOPER_DEFINED_METADATA",
quick_replies: [
{
"content_type": "location"
}
]
}
};
callSendAPI(messageData);
}
I was able to use this functionality without a problem on the IOS messenger app. The 'location' feature allows the user to send a their location to the bot. By default, it showed a map with 'Your Location' and 'Tap to view on map'.
I tried from the desktop and it gave an error indicating that locations are only usable in the app.
The bot is running at DMS Software Bot. Type 'quick reply' and hit location.
The source is at FB-Robot on github.
I'm working on an application that creates an avatar, creates an image on server from the avatar base64, then show a share button for Facebook, to share that avatar, just created.
The custom share button calls the current page with an additionnal URL parameter containing the avatar's filename. When this parameter is set (when Facebook crawls it with the share URL), I create the og tags in the head, with the path of the image given in the URL parameter.
No problem with that, everything is ok.
But the problem is : the dialog with the preview doesn't show the avatar, whereas it IS created on the server ! I have to open the dialog several times to see the avatar. (open, no avatar, cancel... open, no avatar, cancel... open, ah ! the avatar, finally !).
Same problem with the Facebook URL Debugger. First time, it doesn't find the avatar (whereas it exists), second or third time, ok it finds it.
As the avatar is created, shouldn't the preview show the avatar ? Does the server need some time after creating the image to "enable" it ? (server is a nginx)
I recommend making an AJAX request force Facebook to update the image from their end when the page loads that contains your share link:
$.post(
'https://graph.facebook.com',
{
id: 'http://www.website.com/pagetoscrape',
scrape: true
},
function(response){
// or you could call the dialog box at this point
}
);
I ran to this error yesterday this is my attempt
$.post(
'https://graph.facebook.com',
{
id: current+"/share/"+id,
scrape: true
},
function(response){
//alert('scrap')
setTimeout(function(){
$("#facebook").attr("href",url_facebook );
}, 800)
;
}
);
Facebook takes a little time to get the information, so thats why I use the setTimeOut, to give a little break for facebook to catch the information
I'm developing an app for FirefoxOS. This app needs a button that, when pressed, shares some text in social networks and email.
I'm using this code I found somewhere:
var share = document.querySelector("#share");
if (share)
{
share.onclick = function ()
{
var sharing = new MozActivity({
name: "share",
data:
{
//type: "url", // Possibly text/html in future versions,
number: 1,
url: "http://robertnyman.com"
}
});
}
}
It kind of works and I successfully shared pictures. This code opens a menu with all the apps that are available for sharing (Facebook, Twitter, etc). Then you can select any app and it will open that app with an empty textfield that the user can fill with text to share. But I cannot share predefined text at all. I cannot pass this predefined text to the other apps.
As you can see, there's a type parameter that's commented and it says that it'll be available in future versions.
Do you guys have any idea of how to include text in the data variable (or somewhere else) so it can be shared?
Thanks everyone!
I am not sure the Twitter Firefox OS App has a field for the text for the share activity. Another option is to compose the twitter URL and then open it. For example:
var twitterURL = encodeURI("https://twitter.com/intent/tweet?text=test tweet");
var openURL = new MozActivity({
name: "view",
data: {
type: "url",
url: twitterURL
}
})
I'm trying to post an item to a user's news feed with an image on my own site. I get the "FBCDN image is not allowed in stream" error which normally occurs when someone tries to include an image that is on Facebook's server, however the image I'm including is on my own server.
var imgSrc = $('.final-badge .badge-background img').attr('src'),
badgeUrl = $('#largeCrestView').val();
var obj = {
method: 'feed',
//Will need to be retrieved from a hidden text field in ASP environment
link: badgeUrl,
picture: imgSrc,
name: 'All hail my Coat of Charms',
caption: captionText,
description: ''
};
This is my code. The imgSrc variable contains a direct link to an image stored locally on my server. The URL is an absolute path as well.
An ideas what I'm doing wrong here?
I actually worked it out. It was that the location of the image, as I've been informed, was not publicly accessible. Now that It's external it works fine.