Before all my photos show up on my website. Since June 1 2016, my photos aren't showing on my website. I know that instagram change a lot of things but I don't how it works. What are steps to show up my photos again?
I went to this site for a new token.
http://instagram.pixelunion.net
What do I have to do to make my photos show up again?
Do I have to start a submission?
This is my website
http://braveandco.com/community
These are my settings. I have 4 tabs with different hashtags but I think I have to generate a new access token for all 4 hashtags. I did generate a new token but it's not working. I also try to change my userId to clientId.
Should I change userId to clientId?
var bravesMinimal = new Instafeed({
target: 'tab1',
get: 'tagged',
tagName: 'bravesminimal',
userId: XXXXXXXX,
accessToken: 'XXXXXXXX XXXXXXXXXXXXXXXX',
limit: 12,
resolution: 'low_resolution',
template: '<div class="insta-wrap"><img src="{{image}}" /><div class="likes-wrap"><div class="likes">♥ {{likes}}</div></div></div>',
after: function() {
if (!this.hasNext()) {
myButton.hide();
}
}
});
Related
I was just wondering how to navigate to a users profile with their google uid in ui-router. I'm assuming that this is sensitive information that shouldn't be displayed but I'm not really too sure so I figured I would ask to make sure I'm doing things the right way.
The link I am using is:
<a ui-sref="timeline.profile({ userKey: post.userKey })" ui-sref-active="selected">{{post.userKey}}</a>
Where userKey is equal to the google uid. And then this is my state for the public profile.
.state('timeline.profile', {
url: '/{userKey}',
views: {
'timeline-tab#tab': {
templateUrl: 'timeline/templates/public-profile.html',
controller: 'PublicProfileCtrl as publicProfileCtrl'
}
},
resolve: {
auth: function($state, Auth){
return Auth.$requireAuth().catch(function(){
});
},
publicProfile: function(Users, Auth, $stateParams) {
return Auth.$requireAuth().then(function(authData) {
return Users.getPublicProfile($stateParams.userKey).$loaded();
});
}
}
})
It works for grabbing the users profile and navigating to the template but the url contains the google uid. I was just wondering how to achieve the same result without showing the google uid if that is sensitive information that shouldn't be shown.
And I was also wondering if this was good practice to create two different profiles. A private profile where the user can access all of their information and then a public profile that just displays the information.
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;
THIS IS A FEATURE REQUEST FOR THE SOUNDCLOUD CREW (since they do not respond via api#soundcloud.com)
Like SoundCloud itself, could the API show profile thumbnails when there are no track thumbnails available?
This way, when embedding SoundCloud tracks via Embedly or the like -- ie. http://jsbin.com/kezonutoroma/1/edit -- people won't have to be faced with those empty placeholder images.
https://soundcloud.com/oembed?url=https://soundcloud.com/liv-lykke/andres-haender&format=xml
<thumbnail-url>http://a1.sndcdn.com/images/fb_placeholder.png</thumbnail-url>
Should be:
<thumbnail-url>http://i1.sndcdn.com/avatars-000036988237-o1ck0r-t500x500.jpg</thumbnail-url>
Here is a static, more hacky solution:
var defaultimg = 'http://i1.sndcdn.com/avatars-000036988237-o1ck0r-t500x500.jpg';
$('div a').embedly({
key: '7c6cf67ad409446cacd53309d96b66a0',
query: {
maxwidth: 500,
autoplay: true
},
display: function(data, elem){
$(elem).html('<img src="'+defaultimg+'"/>');
$(elem).addClass('play')
.append('<span />')
.width(data.thumbnail_width)
.height(data.thumbnail_height)
.find('span')
.css('height', data.thumbnail_height)
.css('width', data.thumbnail_width);
}
}).on('click', function(){
var data = $(this).data('embedly');
$(this).replaceWith(data.html);
return false;
});
http://jsbin.com/qovirepoyoto/1/edit
I would recommend to get the default image via an API call to the user endpoint.
Hope this helps you.
im quite new to angular.js and firebase, so im starting to edit some code from an open source script to expens my knowledge ... i used a chat script with a facebook login.
i decided to go change the facebook login to a twitter login. (firebase lets you use logins pretty easy)
function onLoginButtonClicked() {
auth.login("Twitter");
}
the code also automaticly gets the user image from facebook with
<div id="comments">
<script id="template" type="text/template">
<img class="pic" src="https://graph.facebook.com/{{userid}}/picture">
<span><b>{{name}}</b><br/>{{body}}</span>
</script>
But now i changed it to an twitter app i wonder how i can get the twitter user icons instead?
--edit--
whats wrong with the question?
If you check out the user info returned from the login process, you'll see that it contains a an object called thirdPartyUserData. It contains all of the information provided by twitter during login; this is their purview and could change when their API or policies change in the future, but has (for as long as I've been familiar with the Twitter API) contained URLs for user's avatars:
var ref = new Firebase(URL);
var auth = new FirebaseSimpleLogin(ref, function(err, user) {
if( err ) console.error(err);
console.log('avatar is ', user && user.thirdPartyData.profile_image_url);
});
$('button').click(function() {
console.log('clicked it');
auth.login('twitter');
});
(Side note: the login provider is twitter vs Twitter)
There is another way to get the Twitter avatar which works better since getting it from the login user object is only for the logged in user and so would require that the URLs be saved which would then be a problem if the user ever changed their twitter avatar since the URL would then be missing. After some searching around I found that the twitter avatar (or facebook) avatar can be reached from the firebase user id as follows:
var info = userId.split(':');
var provider = info[0];
var id = info[1];
if ( provider === 'facebook' ) {
return 'https://graph.facebook.com/' + id + '/picture?type=square';
} else if ( provider === 'twitter' ) {
return 'http://twitter.com/api/users/profile_image/' + id + '?size=normal';
}
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.