COMPARTILHAMENTO DE SCREENSHOT NO FACEBOOK VIA BUTTON DE COMPARTILHAMENTO
13/03/2022
0
Estou implementando um puzzle, que será hospedado na web, e está sendo feito em: javascript, handlebars, css e usando nodejs no back-end.
Minha ideia é que ao final do jogo o usuário tenha a opção de compartilhar no facebook um pequeno dashboard contendo algumas informações do seu desempenho no jogo, como, score, tempo gasto, etc. Eu já vi esse tipo de funcionalidade em alguns jogos.
Pensei que poderia usar o opengraph para implementar essa funcionalidade, usando as metas tags <meta og:"url" ...> , <meta "og:type" ...>, <meta "og:title" ...>, <meta "og:description" ...>, <meta "og:image" ...> .
Minha ideia era linkar dinamicamente a og:image com o endereço da screenshot da dashboard, e quando o usuário clicasse no button de compartilhamento, a screenshot da dashboard apareceria.
Mas, logo vi que isso não seria possível, pois, além de demorar alguns minutos para que os rastreadores do facebook assimilem o novo endereço da imagem, o facebook limita o números de mudanças nos parâmetros das metas tags og.
Passei o dia olhando a documentação do facebook, porém não encontrei uma forma de fazer esse tipo de compartilhamento. Há muita coisa na API de desenvolvedor do facebook, e muitas permissões diferentes que um app pode solicitar. Se tiver esse tipo de coisa, não achei.
Alguém sabe como eu poderia implementar isso à minha aplicação ?
Desde já vlw !
Minha ideia é que ao final do jogo o usuário tenha a opção de compartilhar no facebook um pequeno dashboard contendo algumas informações do seu desempenho no jogo, como, score, tempo gasto, etc. Eu já vi esse tipo de funcionalidade em alguns jogos.
Pensei que poderia usar o opengraph para implementar essa funcionalidade, usando as metas tags <meta og:"url" ...> , <meta "og:type" ...>, <meta "og:title" ...>, <meta "og:description" ...>, <meta "og:image" ...> .
Minha ideia era linkar dinamicamente a og:image com o endereço da screenshot da dashboard, e quando o usuário clicasse no button de compartilhamento, a screenshot da dashboard apareceria.
Mas, logo vi que isso não seria possível, pois, além de demorar alguns minutos para que os rastreadores do facebook assimilem o novo endereço da imagem, o facebook limita o números de mudanças nos parâmetros das metas tags og.
Passei o dia olhando a documentação do facebook, porém não encontrei uma forma de fazer esse tipo de compartilhamento. Há muita coisa na API de desenvolvedor do facebook, e muitas permissões diferentes que um app pode solicitar. Se tiver esse tipo de coisa, não achei.
Alguém sabe como eu poderia implementar isso à minha aplicação ?
Desde já vlw !
Diego Marinho
Curtir tópico
+ 0
Responder
Posts
24/03/2022
Diego Marinho
Consegui progredir um pouco.
Agora consigo mudar as imagens, dinamicamente.
No campo picture do FB.ui, eu insiro o endereço da imagem e a troca da imagem padrão é feita, corretamente.
Porém, eu necessito inserir na api do facebook, não uma imagem já existente, mas sim, um blob ou um elemento base64, pois o card do usuário vem de um canvas.
Alguém teria ideia de como eu poderia inserir isso na api do facebook ? Como eu poderia pegar esse canvas gerado dinamicamente ao fim do jogo e compartilhar no facebook ? A maioria das soluções nos fóruns, são de 5 anos atrás e não são mais válidas na versão atual do facebook. E a documentação do facebook é muito ruim, nesse propósito.
Agora consigo mudar as imagens, dinamicamente.
No campo picture do FB.ui, eu insiro o endereço da imagem e a troca da imagem padrão é feita, corretamente.
Porém, eu necessito inserir na api do facebook, não uma imagem já existente, mas sim, um blob ou um elemento base64, pois o card do usuário vem de um canvas.
Alguém teria ideia de como eu poderia inserir isso na api do facebook ? Como eu poderia pegar esse canvas gerado dinamicamente ao fim do jogo e compartilhar no facebook ? A maioria das soluções nos fóruns, são de 5 anos atrás e não são mais válidas na versão atual do facebook. E a documentação do facebook é muito ruim, nesse propósito.
window.fbAsyncInit = async function() {
FB.init({
appId : '********** ID ***********',
xfbml : true,
cookie : true,
version : 'v13.0'
});
FB.AppEvents.logPageView();
FB.ui(
{
method: 'feed',
name: ' teste name',
caption: 'teste caption',
description: (
'Descrição da aplicação'),
link: 'https://link da aplicação.com',
picture: ' somente abre imagens já existentes '
},
function(response) {
if (response && response.post_id) {
alert('publicado');
} else {
alert('não publicado');
}});
};
(function(d, s, id){
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) {return;}
js = d.createElement(s); js.id = id;
js.src = "https://connect.facebook.net/en_US/sdk.js";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
Responder
Clique aqui para fazer login e interagir na Comunidade :)
