menu
Channels
Team

431 when use makeRestCall on twitter api

July 24, 2020 at 8:06pm

431 when use makeRestCall on twitter api

July 24, 2020 at 8:06pm
Hey team!
Im trying to update my users twitter profile image but im getting back a 431 in both my app and the onegraph graphiql interface.
my code:
// The query
const UPDATE_TWITTER_PROFILE_IMAGE = gql`
mutation UpdateTwitterProfileImage($query: [[String!]!]) {
twitter {
makeRestCall {
post(path: "/1.1/account/update_profile_image.json", query: $query) {
jsonBody
response {
statusCode
}
}
}
}
}
`;
// Where profileImage is a base64 encoded string of the image
const twitterProfileImageQuery = [['image', profileImage]].filter((row) => Boolean(row[1]));
twitterProfileImage({
variables: {
query: twitterProfileImageQuery,
},
})
.then((res) => {
if (res.data.twitter.makeRestCall.post.jsonBody.errors) {
toast.error('Could not update your profile image', { position: toast.POSITION.BOTTOM_CENTER });
} else if (res.data.twitter.makeRestCall.post.response.statusCode === 200)
toast.success('Updated profile image!', { position: toast.POSITION.BOTTOM_CENTER });
})
.catch((error) => {
console.log('ERROR: ', error);
});
Ive basically copied the code that helped me with to update the users profile info and adapted it for this purpose.
From what ive read this code normally means the header is too long, which makes sense as the base64 string is massive for any image. Not sure what the work around is for this.
Note that i havent tried this as a clean fetch yet as i use the auth token from onegraph to keep it all clean and consistent.

July 24, 2020 at 9:11pm
Checking this out now!
like-fill
1
  • reply
  • like

July 25, 2020 at 5:16pm
I think the Twitter API docs are a bit off - I'll reverse engineer it and hopefully have a solution for you out tomorrow!
  • reply
  • like
Yeah their docs are a bit iffy. That would be awesome, really appreciate it!
  • reply
  • like

July 28, 2020 at 1:03am
There's a PR going through the paces right now for this, should have something out for you soon!
Edited
  • reply
  • like
So it turns out that the upload API is rather different, but I think we have it all handled now. Here are two mutations you can use that should do the trick for you:
  1. Upload the media as a base64 encoded string, and get back a mediaId
  2. Use that mediaId in an endpoint that wants to reference an image or video
Here's an example pair of mutations for you https://serve.onegraph.com/short/2VY08A
And the content:
mutation UploadTwitterMedia($imageData: String!) {
twitter {
uploadBase64EncodedMedia(
input: {
base64EncodedMediaData: $imageData
}
) {
mediaResponse {
expiresAfterSeconds
size
# Use this reference when posting
# a tweet with an image, or updating
# a banner image, etc.
mediaId
}
}
}
}
mutation UpdateTwitterProfileImage($mediaId: String!) {
twitter {
makeRestCall {
post(
path: "/1.1/account/update_profile_image.json"
query: [["media_id", $mediaId]]
) {
jsonBody
response {
statusCode
}
}
}
}
}
  • reply
  • like

July 28, 2020 at 8:04pm
This looks great im gonna give this a whirl tomorrow, thank you again for looking into this for me!
  • reply
  • like

July 31, 2020 at 8:26pm
Hey is this good to try out?
  • reply
  • like
Yup! I was hoping you were going to tell me you had this in prod already :D
  • reply
  • like
hahah im just trying it out now! just wanted to check, got caught up fixing the login problem on refresh. Turns out i was using the check login wrong combined with private routes in gatsby. All good now. Will report back pretty soon!
  • reply
  • like
ok, when i run the media upload in the explorer i get ```
  • reply
  • like
`
  • reply
  • like
wow this is going well
  • reply
  • like
{
"errors": [
{
"message": "Unexpected JSON received from Twitter for [\"expires\_after\_secs\"]: expected number, received None",
"path": [
"twitter",
"uploadBase64EncodedMedia",
"mediaResponse",
"expiresAfterSeconds"
]
}
],
"data": {
"twitter": {
"uploadBase64EncodedMedia": {
"mediaResponse": null
}
}
}
}
Edited
  • reply
  • like
with the query variable: {"imageData": "data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/4gKgS..........
  • reply
  • like
ok im gonna sleep on this, i must be doing something stupid, going to try again tomorrow
  • reply
  • like

August 1, 2020 at 4:21pm
What happens if you omit the data:image/jpeg;base64,?
  • reply
  • like
Yep, that was it. I saw it actually says to omit it in the explorer but you have to hover over the base64encodedmedia bit. I'm close to getting this working. I'm now getting an error saying it's not finding the image Data, but I think it's just a case of it not being passes there before I call the function
  • reply
  • like
I'm out and about on Saturdays, but feel free to post code/errors/logs and I'll take a look when I get a chance!
  • reply
  • like
Thanks, appreciate it! Hopefully I won't have too 😀
  • reply
  • like
No worries - feel free to share, happy to help!
  • reply
  • like
So something is up. Im getting the error Missing variablemediaId`` when i know for a fact that im passing it in. it exists before i pass it. Not 100% sure if im passing it correctly as there seems to be different ways to do it, but going by the fact that the mutation expects an array syntax i have done the following:
Edited
  • reply
  • like
const query = [ ['image', mediaId.toString()], ] console.log({query}) updateTwitterProfileImage({ variables: { query: query }}) .then((res) => { if (res.data.twitter.makeRestCall.post.jsonBody.errors) { toast.error(\`Nope, ${res.data.twitter.makeRestCall.post.jsonBody.errors}\`, { position: toast.POSITION.BOTTOM_CENTER }); } else if (res.data.twitter.makeRestCall.post.response.statusCode === 200) { toast.success('Successfully updated Twitter profile image ', { position: toast.POSITION.BOTTOM_CENTER, }); } }) .catch((error) => { toast.error(\`This went wrong uploading profile image: ${error.message}\`, { position: toast.POSITION.BOTTOM_CENTER, }); });
Edited
  • reply
  • like
wow, that didnt format at all well
  • reply
  • like
Up to pair for a bit? I'll be around if so, suspect it should hopefully be ~10 min to test in GraphiQL, then another 10 min to confirm in your code
  • reply
  • like
sure i can jump on for a bit. Gonna say right now, ignore my messy code, its quite embarrassing right now!
  • reply
  • like
Show more messages