stevenschobert / instafeed.js

A simple Instagram JavaScript plugin for your website
https://instafeedjs.com
MIT License
3.5k stars 862 forks source link

Token refreshing without Heroku #654

Open kaleidografik opened 4 years ago

kaleidografik commented 4 years ago

Hey guys, the V2 tutorial only gives us an option to refresh our tokens via the Heroku app. However, what about if we're not able to use Heroku. Is there an alternative? I'd really like to get an automated token refreshing process in place so as to ensure continued functionality.

stevenschobert commented 4 years ago

Thanks for the question!

The Heroku option is currently the only open-source option we have.

But I’d really love to see the community create alternative methods in various languages and open-source them so we could think them in the README. It’d be great to see supported options in Wordpress, .NET, etc.

kaleidografik commented 4 years ago

Yes that would be super useful, at the moment I can't seem to find any information on how to refresh apart from via the command line, which is fine for the odd occasion but not very useful for a production environment.

stevenschobert commented 4 years ago

The process of getting and refreshing the access tokens is outlined in the Instagram Basic Display API docs: https://developers.facebook.com/docs/instagram-basic-display-api/guides/long-lived-access-tokens/

I think there is an example in there on using curl from the command line.

benjamin-hull commented 4 years ago

In general, a token refresh service would need to do the following things (this is assuming running on a server somewhere):

If this is running on the same server that is running the site you want to use instafeed on, then the simplest thing is to just include the token value in the page rendered by the server - that way there's no extra request to fetch the token, etc.

The Heroku option is really optimised for "works for most people, is free, requires next-to-no coding". It's by no means the best or most efficient way if you can do some server-side work!

benjamin-hull commented 4 years ago

I should also mention that we've been in contact with the developer of instant-tokens.com, which is another service designed to work with instafeed.js. As far as I know it does do everything needed, but it's centralised and not currently open-source, so I can't vouch for its security or suitability for a production environment. We'll update the readme if it that changes.

kaleidografik commented 4 years ago

Hey guys, just wanted to follow up on this with our implementation, which may or may not be useful for others.

So, we register our account over at instant-tokens.com, which does the heavy lifting of refreshing the short lived token every 60 days. We then use a AJAX call to hit the supplied instant-tokens.com url (which returns the access token as JSON). We can then parse the JSON to target exactly what we need, in this case Token.

$.ajax({
    type: 'get',
    dataType: 'json',
    url: 'https://ig.instant-tokens.com/users/XXXXX/instagram/XXXXX/token?userSecret=XXXXX',

    success: function (response) {
        var feed = new Instafeed({
            target: 'carousel-instagram',
            accessToken: response.Token, // Access token from json response
    });
    feed.run();
});
tyssen commented 4 years ago

It's worth pointing out that as of a few days ago Heroku is now suspending instagram-token-agent apps immediately after they're created.

https://github.com/companionstudio/instagram-token-agent/issues/13

JonathanHo commented 4 years ago

Hey guys, just wanted to follow up on this with our implementation, which may or may not be useful for others.

So, we register our account over at instant-tokens.com, which does the heavy lifting of refreshing the short lived token every 60 days. We then use a AJAX call to hit the supplied instant-tokens.com url (which returns the access token as JSON). We can then parse the JSON to target exactly what we need, in this case Token.

$.ajax({
    type: 'get',
    dataType: 'json',
    url: 'https://ig.instant-tokens.com/users/XXXXX/instagram/XXXXX/token?userSecret=XXXXX',

    success: function (response) {
        var feed = new Instafeed({
            target: 'carousel-instagram',
            accessToken: response.Token, // Access token from json response
    });
    feed.run();
});

Today I was getting suspended by Heroku immediately after deployment, so I switched to this method, it worked quickly and well for me, thank you!

t1mwillis commented 3 years ago

Or, if you don't have jQuery on your site/don't want to add it, just do it using fetch! It is 2020 after all 😄

fetch('https://ig.instant-tokens.com/users/XXXXXX/instagram/XXXXXX/token?userSecret=XXXXX')
  .then(resp => resp.json())
  .then(data => {
    const feed = new Instafeed({
      accessToken: data.Token, // Access token from json response
    });
    feed.run();
  })
  .catch((error) => {
    console.log(error)
  });
garethmorgans commented 3 years ago

Thanks @t1mwillis & @kaleidografik

codingbadger commented 3 years ago

Hello,

You can now link directly to a JS file using https://Instant-Tokens.com which automatically sets a JS variable named InstagramToken with your Instagram Access Token.

<script src="https://ig.instant-tokens.com/users/XXXXXX/instagram/XXXXXX/token.js?userSecret=XXXXX"></script>

https://github.com/codingbadger/instant-tokens.com/issues/2

Full demo on both ways to access the token can be found here https://github.com/codingbadger/instant-tokens.com/wiki/3.-Instafeed.js-Demo

Cheers

Barry

Matra-Simca commented 3 years ago

Just very easily used Instant-Tokens.com - Unlike the Heroku method I wasn't required to go through Facebook developers, does that mean this method isn't limited to the 200 user per hour restrictions?

codingbadger commented 3 years ago

@Matra-Simca Instant-Tokens.com uses its own Facebook application so is still bound by the same rate-limiting rules however the limit is not a per-user limit it is calculated as 240 times the number of users.

Glad you had a good experience with instant-tokens.com :-)

Matra-Simca commented 3 years ago

Thanks @codingbadger - it's definitely a straightforward solution - sorry I'm still not clear in practial terms of how the rate-limiting works. Who is the user in this case, is it the end user viewing the feed, or the Instagram account linked to instant-tokens.com? Or have I misundertood completely!

Ideally I want to add two different configurations of Instafeed on different pages, it seems like this would require the same token being used in each case, so I'm wary of doubling the use rate if the practical limit is relatively low.

codingbadger commented 3 years ago

Instant-tokens.com is well below any rate-limiting being imposed by Instagram. As an example over 125,000 calls were made to the Instagram API via the Intstant-Tokens.com Application and it has really only scratched the surface of any limits.

mikelivingston04 commented 3 years ago

Thanks @codingbadger - Instant-Tokens definitely seems to be the better solution. However, I cannot get it to work in my actual application. It works fine and appears to be working correctly for me within a codepen, but I get the error Uncaught Error: Error from Instagram: The access_token provided is invalid. in the console. The token is populating correctly, and again, all looks to be working correctly in Codepen, but i'm not sure why it wouldn't work within my own website. Any thoughts?

codingbadger commented 3 years ago

Can you raise an issue in https://github.com/codingbadger/instant-tokens.com/issues and provide the sample code.

Thanks


From: mikelivingston04 notifications@github.com Sent: Wednesday, July 29, 2020 7:32:14 PM To: stevenschobert/instafeed.js instafeed.js@noreply.github.com Cc: Barry Mooring barry@codingbadger.com; Mention mention@noreply.github.com Subject: Re: [stevenschobert/instafeed.js] Token refreshing without Heroku (#654)

Thanks @codingbadgerhttps://github.com/codingbadger - Instant-Tokens definitely seems to be the better solution. However, I cannot get it to work in my actual application. It works fine and appears to be working correctly for me within a codepen, but I get the error Uncaught Error: Error from Instagram: The access_token provided is invalid. in the console. The token is populating correctly, and again, all looks to be working correctly in Codepen, but i'm not sure why it wouldn't work within my own website. Any thoughts?

— You are receiving this because you were mentioned. Reply to this email directly, view it on GitHubhttps://github.com/stevenschobert/instafeed.js/issues/654#issuecomment-665830209, or unsubscribehttps://github.com/notifications/unsubscribe-auth/AAIKAXBXAHXVOAKKC2QQOILR6BTK5ANCNFSM4MHX7MQA.

mikelivingston04 commented 3 years ago

@codingbadger

Here is the issue: https://github.com/codingbadger/instant-tokens.com/issues/6.

Not sure why the coding formatting didn't work for my code. My apologies.

stale[bot] commented 3 years ago

This issue has been automatically marked as stale because it hasn't had new comments in the last 3 months. It will be closed if no further activity occurs. If you still need assistance with this issue, or believe it shouldn't be closed, please respond with a new comment to let us know. Thank you all for your contributions.

sudip-modi commented 3 years ago

Thank you so much everyone. Finally integrated Instagram on my site🙏.

FreMun commented 3 years ago

A few days before I would release a website for a client, this happened: Facebook has disabled the Instant Tokens Application

Any alternative would appreciated!

kaleidografik commented 3 years ago

A few days before I would release a website for a client, this happened: Facebook has disabled the Instant Tokens Application

Any alternative would appreciated!

This is such a shame, hopefully @codingbadger can get the service back up and running shortly.

codingbadger commented 3 years ago

The Instant Tokens Application has been reinstated by Facebook after an appeal.

abdullahoguk commented 2 years ago

I made a simple node.js script that refresh set of tokens. You can run the script with github actions to refresh them regularly. This is an example repo that refresh in 3 days interval. Interval can be changed in workflow file (.github/workflows/tokenRefresh.yml). and token list can be specified in tokens.js.

https://github.com/abdullahoguk/refresh-instagram-tokens

kris-g commented 1 year ago

I made a simple node.js script that refresh set of tokens. You can run the script with github actions to refresh them regularly. This is an example repo that refresh in 3 days interval. Interval can be changed in workflow file (.github/workflows/tokenRefresh.yml). and token list can be specified in tokens.js.

https://github.com/abdullahoguk/refresh-instagram-tokens

Is this working? I can only see the log file date being updated every 3 days. The tokens.js hasn't been updated since the initial commit.

abdullahoguk commented 1 year ago

@kris-g Yes It's working. The tokens itself is not changing. tokens.js is a list of tokens to be reissued for batch refreshing purpose. When I debug the token, it says issued on Wednesday (3 days ago). I updated the readme for usage.