Appcelerator - Post a Tweet from iPhone App - Stuck on Callback URL - iphone

I am needing to send a tweet for from my iphone/ipad app using Appcelerator Titanium & javascript. I found the following example on github (code also posted below for this):
https://gist.github.com/2eabc31db388144b3abc
I have created my app details (key,secret etc) in my twitter developer account and using the code from the example i get the twitter login and authorisation popup but once you click authorise, all i get is a webview showing the callback url (that i was required to put in the twitter app settings). So the app is stuck on a webview showing the callback url but does nothing after. If i close the popup window it just goes back to my app without sending a tweet.
Can anyone help?
code in app.js:
var win = Ti.UI.createWindow({ backgroundColor: '#fff' });
var shareButton = Ti.UI.createButton({
width: 90, bottom: 10, height: 30,
title: 'Tweet!"'
});
win.add(shareButton);
win.open();
var social = require('social');
var twitter = social.create({
site: 'Twitter',
consumerKey: 'XXXXXXXXXXXXXXXX',
consumerSecret: 'XXXXXXXXXXXXXXXXXXXXX'
});
shareButton.addEventListener('click', function() {
twitter.share({
message: 'Hello, world!',
success: function() {
alert('Tweeted!');
},
error: function(error) {
alert('Oh no! ' + error);
}
});
});

As Aaron answered on the Q&A, when using Social.js, you should not use a callback URL. The code itself will watch the web view for what it needs.

Related

Unexpected behavior for Facebook Sharing [duplicate]

This question already has an answer here:
Facebook ignoring OG image on first share
(1 answer)
Closed 6 years ago.
First of all hi and thanks in advance to anyone who can help with this because I've been going crazy over this for weeks now.
So I've got a website which lists gif taken from my mobile application (which are then stored on AWS and my visitors ( I haven't found a use for me to have users) can share these gifs on facebook using the facebook sdk.
The problem appears when I try sharing an image for the first time
This is what the share dialog shows the first time I click on my sharing button:
http://i.stack.imgur.com/lNVNF.png
and then I close and reclick the same button and now it works:
http://i.stack.imgur.com/YsDUm.png
Now I've been trying to find a way to make this work on the first sharing attempt but to no avail.
I am using meteor in combination with biasport:facebook-sdk and Amazon S3 for the hosting of my files.
Edit here is the code used:
FRONT SIDE
HTML
<div class="facebook share">
<img src="/gallery/fb.png">
</div>
Javascript
Template.*templateName*.events({
'click .facebook': function(e){
e.preventDefault();
e.stopPropagation();
// this is in a modal so I store the data I need
// (events have photos which in turn contain a url to the gif
var url = Session.get('event').photos[Session.get("id")].url;
FB.ui({
method: 'share',
href: url
});
}
SERVER SIDE
JAVASCRIPT
if(Meteor.isClient) {
window.fbAsyncInit = function() {
FB.init({
appId : 'APP_ID',
status : true,
xfbml : true,
version : 'v2.5'
});
};
}
Edit: I found a manual solution using exec future and curl
so first I added a call to a meteor method on the share that updates the facebook crawler
JAVASCRIPT
Template.*templateName*.events({
'click .facebook': function(e){
e.preventDefault();
e.stopPropagation();
// this is in a modal so I store the data I need
// (events have photos which in turn contain a url to the gif
var url = Session.get('event').photos[Session.get("id")].url;
Meteor.call('updateCrawler', url, function(){
FB.ui({
method: 'share',
href: url
});
});
}
Then I defined my meteor method as such
JAVASCRIPT
Meteor.methods({
updateCrawler: function(url){
var future = new Future();
cmd = 'curl -X POST -F "id=' + url + '" -F "scrape=true" -F "access_token={my_access_token}" "https://graph.facebook.com"';
exec(cmd, function(error){
if (error){
console.log(error);
}
future.return();
});
future.wait();
}
});
it's ugly but since I'd have to wait for the crawler to update and it works I'll leave this here for future use for someone maybe
Edit2:
I did not use og tags at all since I was simply sharing a url to aws directly and not a url to my website
I worked around this problem by calling the Facebook API direct from the server to make it scrape the og data by requesting info on the page. First time round it doesn't have the image cached but second time it does so this workaround does the initial call before sharing.
Use an access token for your facebook app and call the below in an ajax call and await the response before opening share dialog. Replace Google address with your own uri encoded address https://graph.facebook.com/v2.5/?id=http%3A%2F%2Fwww.google.co.uk&access_token=xxxxx
EDIT:
As per comments, here is my server side method for calling this which I use when posts etc are inserted to make the initial call and prompt a scrape from fb:
var getTheOGInfo = function (link)
{
if (!link || link.slice(0, 4).toLowerCase() != "http"){
throw new Meteor.Error("og-info-bad-url", "Function requires an unencoded fully qualified url");
return false;
}
var url = "https://graph.facebook.com/v2.5/{{{{id}}}}?access_token={{{{token}}}}&fields=og_object{id,description,title,type,updated_time,url,image},id,share";
var token = Meteor.settings.private.fb.token;
if (!token){
throw new Meteor.Error("og-info-no-token", "Function requires a facebook token in Meteor.settings.private.fb.token");
return false;
}
var link_id = encodeURIComponent(link);
url = url.replace('{{{{token}}}}', token).replace('{{{{id}}}}', link_id);
var result = HTTP.get(url, {timeout:1000});
return result;
}
Or for your purposes you may not want anything that might be blocking so you could change the last two lines to be aynchronous:
var result = HTTP.get(url, {timeout:1000});
return result;
//Replace with non blocking
HTTP.get(url, {timeout:1000}, function(err, result){console.log('something asynchronous', err, result);});
return true;

Facebook FB.ui send method not working on mobile web and need alternative

I am trying to allow users of my app to notify multiple Facebook friends that they need them to vote for their favorite item on a web page. I have been using the FB send method (https://developers.facebook.com/docs/reference/dialogs/send/) and it has been working fine on desktop (code is below) but I just realized that I overlooked where it says in the docs that this dialog is "not supported on mobile devices."
Are there any alternatives to the send method that would allow a user to send a private message to their friends from mobile browsers? Perhaps a way to trick the api into thinking it's desktop?
I'm also open to using another FB dialog so long as it: 1) is functional from mobile browsers 2) allows pre-populating of recipients and 3) is private between the sender and the recipient such as a private message or notification.
Any ideas would be much appreciated. Thanks
Code for FB send method:
function resetSelector(){
$('#fs-user-list').empty();
$(".mutual-friends-link").fSelector({
max: 5,
excludeIds: exclusions,
facebookInvite: false,
lang: {
title: "Pick your mutual friends who will vote on the gifts (Last step)",
buttonSubmit: "Add Accomplices",
selectedLimitResult: "Limit is {5} people."
},
closeOnSubmit: true,
onSubmit: function(response){
var accompliceUid;
accomplices = response;
$('#index-accomplices').empty()
var i = 0
var FB_notification = function(accomplice, poll_id){
FB.api('https://graph.facebook.com/', 'post', {
id: "http://giftadvisor.herokuapp.com/polls/" + poll_id,
scrape: true
}, function(response){
FB.ui({
method: 'send',
to: [accomplice],
link: "http://giftadvisor.herokuapp.com/polls/" + poll_id,
}, fbCallback)
})
}
var fbCallback = function(){
console.log(i++)
if (i === accomplices.length){
window.location = "/polls/" + poll.id
}
}
_.each(accomplices, function(accomplice){
$('#index-accomplices').append('<img class="accomplices" src="http://graph.facebook.com/' + accomplice + '/picture?type=large">');
user = new User({uid: accomplice});
user.save(null,
{success: function(response){
console.log("users saved")
console.log(response.attributes.uid);
vote = new Vote();
vote.save({
user_id: response.attributes.id,
poll_id: poll.id,
image_url: "http://graph.facebook.com/" + response.attributes.uid + "/picture"
},{success: function(response){
FB_notification(accomplice, poll.id);
}
}
);
}});
});
// }});
},
onClose: function(){
// FB_notification(accomplices, poll.id);
}
});
}
The only thing I've seen approximating this is to use the now-deprecated Chat API. See, for example, what Grouper does.
Send dialog is really what I want, but failure on mobile web makes it useless. Have you found any other approaches that may work?

BlackBerry WebWorks to invoke popping BB10 Share panel/screen

How can u get my webworks app to pop open the blackberry 10 share panel?
Ex: open a website in the browser, click the overflow button and then click share
Thank you!
You'll want to look at the invokeTargetPicker API.
Essentially, you create a request
var request = {
action: 'bb.action.SHARE',
// for a file
uri: 'file://' + path,
// for text you'd use 'data'
data: 'I am awesome',
target_type: ["APPLICATION", "VIEWER", "CARD"]
};
Then you call the API
blackberry.invoke.card.invokeTargetPicker(request, "Your Title",
// success callback
function() {
console.log('success');
},
// error callback
function(e) {
console.log('error: ' + e);
}
);
API Documentation is available here: https://developer.blackberry.com/html5/apis/blackberry.invoke.card.html#.invokeTargetPicker
I wrote a sample app, which you can test out on our GitHub repo: https://github.com/ctetreault/BB10-WebWorks-Samples/tree/master/ShareTargets
This should be an option that appears on any link, image or Text: "Share". Is the item not present in the Cross Cut menu shown?

Facebook dialog apps

I have created an application for Facebook, but I want show all content in a dialog box like Facebook style. How? like this http://www.bigthink.it/wp-content/uploads/2010/06/fb-dialog-box.jpg
Your question is not clear. What content do you want to show? What type of dialog? Do you have any code that you can share?
If you just want to wrap some content in a fb-like dialog, then you can use the javascript sdk method FB.Dialog.create, it's not officially documented (as far as I'm aware), but it works.
Here's an example of use:
var fbDialog = null,
html = '<img src="http://www.bigthink.it/wp-content/uploads/2010/06/fb-dialog-box.jpg"/>',
params = {
display: "iframe",
content: html,
loader: true,
closeIcon: true,
visible: true,
onClose: function() {
FB.Dialog.remove(fbDialog);
}
}
fbDialog = FB.Dialog.create(params);

check if user share on facebook application

is it possible in an iframe applications check if the user share something successfully. may i get the request id if it is successfully shared so if it is shared i want to make the share button's visible false to that user and the user earns some points if the share is successfull
so is it possible to know and check it?
i am using c# but it is ok for javascript code
thanks
using the Javascript SDK you should be able to get that information.
FB.ui({
method: 'apprequests',
message: 'Your message here',
title: 'App Request',
},
function (response) {
if (response) {
var numberSelected = response.to.length;
var firstIdSelected = response.to[0];
} else {
alert('canceled');
}
});