So today I noticed image uploads stopped working. What I mean is:
The customer, using a chat widget (I think they called it the messenger - lol idk, too many "chattish" APIs/SDKs/kitchen sinks lol - the blue one) uploads an image and sends it.
In Genesys, it shows up on the user's ("agent's") side.
In my app... I get HTTP response code 303 now.
Now I've never seen or even heard of this response code before, but after reading the micro-description of it on MDN, it leads to more questions than answers. So here's my process when showing the chat history:
First it calls getConversation or similar, to get a list of "participants".
Then, it loops through the "participants" to create an a "flattened" array of messages. That is, it sheds all the other objects and sub-objects and sub-sub-sub-objects and properties and kitchen sinks, to give me just a single-dimensional array of objects, each object storing info about an individual message.
It sorts the messages in chronological order. This sort of manual restructuring of complicated object trees seems to be par for the course. Thankful to be a C-loving nerd who is into lower-level stuff or I'd be sunk.
With our chat history now complete, it loops through this list of messages to build out our UI.
In this loop, for each message:
If the message is an event, or has a "textBody", then it's easy to build a UI around those things.
If the message has a "media" property, then it creates an <img> tag with src = media.url. This used to work, but feels like 303'ing lately.
I've confirmed that the URLs are the same in my app as what they are in the default Genesys GUI. That is, the images in your and the image in ours has the same "src" attribute.
I've tried running a fetch() on the URL to try and see if it'll 303 and then using response.headers.get('Location'); That... coughed CORS crap. idk if it was the initial fetch or trying to load the image, but I'm thinking maybe I'm missing a new API endpoint that was recently released or something. There's no reason for something that has been working great for weeks to suddenly decide, "nah! Kiss my bits puny human."
So is there like a ConversationsApi.getClearanceToDownloadImageUnderNewSecurityDesign(); or something? Like... I'm missing something. But when it breaks and I haven't changed a darn thing, I'm left doc-diving and hoping something logical magically appears.
Quick update on this: When an image decides to 303 on me, I replace it with a link to the URL; this works... interesting. Instead of showing the link in a browser, it prompts the user to download the image. That could be my browser settings. But it's better than nothing (at least there's a way to see image uploads). I'm considering shooting off an XHR to my server, and let my server do the image download (making sure that the URL is from Genesys, of course) and then returning a link to the copy of the image on our server... but this sounds like a whole lot of extra hoops to jump through just to get a copy of an image that used to load fine. Is there any documentation out there with a potential explanation of the 303 mystery?
After further hackn'n'guessing (playing hacker on the Network tab), it looks like some new information has come to light:
When it 303's, it tries to request the new location
It looks like it 303's again, redirecting to... the login? What the?
And it looks like this somehow fails authorization or something. Again, what the?
Here is some code, in case that helps, an attempt to remind Genesys that yes I am an authenticated user:
(async function() {
console.clear();
var data = await fetch("https://api-downloads.usw2.pure.cloud/api/v2/downloads/1b6ba3685d6b458c", {
headers: {
"Authorization": "bearer " + MY_ACCESS_TOKEN,
// these were all copied out of another request, this one from Genesys' default GUI
// Adding/removing these didn't change the result - stubborn CORS bugwall
"User-Agent": "Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:124.0) Gecko/20100101 Firefox/124.0",
"Accept": "*/*",
"Accept-Language": "en-US,en;q=0.5",
"Sec-Fetch-Dest": "empty",
"Sec-Fetch-Mode": "cors",
"Sec-Fetch-Site": "same-site"
}
});
data = await data.blob();
console.log(data);
})();
So... the facts on this one always seem to lead to more questions than answers...
What prompted Genesys to start rejecting image requests over authorization? I can still download the images by clicking on the links I created, and make other API requests, so it's not like my access token expired or something obvious like that.
Is there an API endpoint I can call for this? If not, that's the new alternative? Or is there one?
Why am I getting CORS errors when I can request Genesys stuff all the time? It's not like there's some third-party component here (the URL is Genesys, not Amazon or Instagram or something like that).
I could go on, and on, and on, and on... this is one of those logic-defying gorilla-bugs that refuses to die. Anyone else ever had to struggleshoot something like this?
Not sure if you are still looking at this, but I think it might be a cross-browser issue. I just opened this conversation in our app, in Chrome and also our desktop app (which uses an embedded Chromium browser), and the images show up fine there. So maybe it's just a Firefox thing...
