Instagram new API with Auth

[Max_Saravia]

Hi! since Instagram is going to delete their old API “Legacy API” and instead of this they gonna implement " Instagram Graph API " and " Instagram Basic display API " i need to work to get the instagrams photos of some clients accounts inside their websitites with Instagram Basic display API

So i started reading this: https://developers.facebook.com/docs/instagram-basic-display-api

And this: https://developers.facebook.com/docs/instagram-basic-display-api/reference/media

Once i had my app id and registered my account as a tester, generating the id_code (id of the app), app secret id and finally getting the token; i sarted puting this information inside Wappler:

And im stuck here trying to fetch the schema but i got an error.

So what im trying to achieve? just want to show all the media (photos and some videos) of an instagram account inside a html page.

I think, if i can fetch the schema i can use a server connect from client side to get the images and some info about each post.

I must say i have a very short experience with API’s so i’ll apreciate some help here. I completed succefully this example by @Teodor Using API Data Source
But instagram API is another level.

Thnks in advance.

[George]

If I read it correctly, the new Instagram Graph API, needs a facebook login/authorization?

Getting Started - Instagram Platform - Documentation - Facebook for Developers

Did you try to use facebook as oauth2 provider?

[Max_Saravia]

Hi George, yes thats for Graph API, but not for Instagram Basic display API i think. I gonna check this again and try to find something about it in other forums. Thanks!

[George]

Actually if it is for your own Instagram authorization you can do the client credentials authorization flow.
Then you don’t need all the extra oauth2 redirects and can use straigth the facebook app id and app secret.

You just need to enter it like this:

Let me know if this works for you.

[Max_Saravia]

Hi George, yes it is my account. I did what u said and clicked the client credentials and deleted the params, but still can’t fetch the schema:

This is what i got in my instagram account, so i think i got that part right.

[George]

Yes the schema editor in Wappler - doesn’t know yet unfortunately about your oauth2 authorization (yet)

Can you just run the server connect action in the browser? Do you get the right results then?

[Max_Saravia]

I tryed but all i got is this:

[George]

No I mean just run the server action in the browser:

and see the output there

[Max_Saravia]

Oh ok, i got this:

[Teodor]

Select your server action in the server connect panel and then click Open In Browser.

[Max_Saravia]

Oh sorry haha, here:

[George]

try this:

Debugging Server Connect Errors

You can easily debug issues related to server-side processing such as - form not sending email, record not inserting or updating, query not showing data etc. The first thing you need to do is to open the server connect settings. They are located in the Workflows Panel > Server Actions: [Screenshot 2021-09-27 at 10.02.35] And enable the Debug Mode: [Screenshot 2021-09-27 at 10.03.08] Click Save: [Screenshot 2021-09-27 at 10.03.26] In your browser, open the Developer tools. If you don’t k…

[patrick]

If you want to use the API with user credentials then your first setup with the instagram provider was good. You should not set the Params in the Provider and Authorize step, it will be adding the correct ones for you. The Authorize step you should set the required scopes for you use-case. Also the https://graph.instagram.com/ is not a valid endpoint. I will see if I can get a working example.

[Max_Saravia]

That would be greate, thnks Patrick.

[patrick]

Here are the settings I tested the oauth of instagram with:

The second step gave me back the access_token and user_id after giving permission.

[Max_Saravia]

Hi Patrick, first of all thanks for taking the time to help me. I did what u showed me, but still cant show the instagrams photos from my account in an HTML page. Can u show me what u did in your action step “API Action” please? Thnks

[Chackmool]

Is any advance on this?

[Teodor]

That’s an almost 4 years old topic, if you have any issues setting up Instagram API for your project, post a new one and explain your problems there.