queen-raae / gatsby-remark-oembed

A GatsbyJS Plugin that transforms oembed links into its corresponding embed code.
https://gatsby-remark-oembed.netlify.com/
MIT License
162 stars 25 forks source link

Instagram links fail #104

Open carstenblt opened 4 years ago

carstenblt commented 4 years ago

Instagram is switching to a new API requiring registration and apparently they already stopped working. Building fails with

Error: Request failed with status code 400

aliwilson commented 4 years ago

+1 i'm also having the same issue with this.

raae commented 4 years ago

That kind of goes against the whole oembed vibe 😠

Looked at their new docs and it says its not supposed to be deprecated until October 24th. So hopefully it will get back up and I have time to figure something out.

raae commented 4 years ago

It seems the endpoint in the oembed list has been updated to the new endpoint and is therefore requiring an access token giving us 400.

I think this can be fixed by overriding the url to the soon to be deprecated oembed url:

settings: {
   Instagram: {
      url: "https://api.instagram.com/oembed"
   }
}

or get an access token and add that to settings:

settings: {
   Instagram: {
      access_token: <access token>
   }
}

I cannot test this until tonight.

philsturgeon commented 4 years ago

The access_token approach works. Had to jump through loads of hoops, make a Facebook Developer account, make an app, create an App Access Token, etc, but it works.

raae commented 4 years ago

Great news @philsturgeon, would you be willing to add a not about this in the documentation (readme.md)?

philsturgeon commented 4 years ago

@raae will do, but first I'm confused. Using the old API does seem to work for now:

$ curl https://api.instagram.com/oembed/\?url\=https://www.instagram.com/p/B5SYlkZFTBY
{"version": "1.0", "title": "all good here...

It really seems like:

settings: {
  Instagram: {
    url: "https://api.instagram.com/oembed/"
  }
},

should work if thats how you make https://api.instagram.com/oembed/?url=foo happen.

raae commented 4 years ago

Somewhere I found info that the old api will be turned off sometime this month.

So in our docs we can go for the access token solution. And feel free to let people now it's a pain to get hold of an access token.

I am quite furious with Instagram closing of what is supposed to be an open standard...

philsturgeon commented 4 years ago

Here you go: https://github.com/raae/gatsby-remark-oembed/pull/110

Yeah I'm pretty annoyed too. They said they'd deprecate it Oct 24th then just shut shit down before that. Even if this happened on 24th, "responding with a 400" is not deprecating, that's bricking it.

I wrote up a tutorial a) ranting, b) explaining how to do this nicely without hardcoding tokens in the repo: https://phil.tech/2020/gatsby-instagram-oembed-failures/

I would still love to figure out why we're getting 400's via the plugin but using curl works fine. User agent sniffing perhaps?

raae commented 4 years ago

I am not completely sure adding the url param works, so it might be using the new address and I am guessing then it would return 400 when no access token?