MingSheng92 / react_isntafeed

Instragram feed with Basic Display API
MIT License
3 stars 4 forks source link

token has to be refreshed after 60 days? #1

Open yechukim opened 2 years ago

yechukim commented 2 years ago

Hello, I got here from your medium article about instagram feed. thank you for the posting I was wondering, if there's way to get posts without refreshing token even after 60 days. now I have long term token which is valid for 60 days and, does that mean I have to refresh token after 60 days and change token in a way that I got token from the first place? 😮 There's running website where users can see a few latest posts, and I want users always to see posts there I hope this question reach you and hopefully you can let me know Thank you!

MingSheng92 commented 2 years ago

Hello Yechu,

As of today, I believe the API does not have offer permanent token (https://developers.facebook.com/docs/instagram-basic-display-api/overview#instagram-user-access-tokens)

So yes, you will need to refresh your token every 60 days to gain access to your Instagram posts, but the API also offers way that you can refresh your token. Check out this blog post on this specific topic, this is for wordpress but it should be easy to migrate into whichever environment you have. (https://www.gsarigiannidis.gr/instagram-feed-api-after-june-2020/)

Bear in mind the API has a call rate limit, so implementing caching for your Instagram post and refresh every X amount of time to ensure that you will not run into any call rate issues in production server.

Do let me know if you have any other questions.

yechukim commented 2 years ago

Thank you a lot MingSheng. I was able to refresh long-live token and I was wondering about how you save the token. since I am using this on react web, I used local storage. I decided to refresh long-live token every 30days, so whenever I visit the website, I check localstorage (that has token and date of the day) and calculate the difference of the date

basically I coded as below

...
const token = "first token";

const tokenStorage = {
    get() {
        try {
            const tokenObj = localStorage.getItem(Auth.USER_TOKEN);
            if (!tokenObj) {
                const obj = {
                    token, // long live token
                    date: new Date("01/06/2022").getTime(), // the day of first token made
                };
                tokenStorage.set(obj);
                return obj;
            }
            const parsedTokenObj = JSON.parse(tokenObj);
            const today = new Date().getTime();
            const saved_date = parsedTokenObj.date;
            const diff = Math.trunc((today - saved_date) / (1000 * 3600 * 24));
            console.log(diff);
            if (diff < 30) return parsedTokenObj;
            return refreshLongLiveToken(parsedTokenObj.token);
        } catch (e) {
            //
        }
    },
    set(data) {
        try {
            localStorage.setItem(Auth.USER_TOKEN, JSON.stringify(data));
        } catch (e) {
            //
        }
    },
};

export default tokenStorage;

I am still not so sure if this is right direction. I'd be appreciated if you can let me know, Thank you!