Previous Entry Share Next Entry
On Safari, URL Redirection, Instagram OAuth, and Fragments
2008 Headshot
unwiredben
I've been building a Pebble watch app, Phantom Camera, and I published it earlier today on the Pebble store.  A few minutes later, a fellow developer said that the configuration page wasn't working on iOS.

This led to an afternoon-long exploration.

My searching led to a WebKit bug - https://bugs.webkit.org/show_bug.cgi?id=24175 - which indicated that Safari didn't preserve URL fragments across a redirect.  So, if you navigate to foo/a.html#42 and foo's server redirects you to foo/b.html, you'll not have that #42 applied when the browser loads the b.html page.  However, this didn't seem to apply, as Instagram was putting the hash in the URL it sent.

My authentication with Instagram uses redirection.  I send the user to a URL on the Instagram site, they handle having the user log in and allow my app, and the server then uses a HTTP 302 redirection to return them to my page with the token in the fragment.

On Android and in Firefox and Chrome, I was seeing this working fine.  I'd get the token, JavaScript in the page would read it from the window.location, and all would be fine.  On iOS Safari, the user would see the "authorize" button again.  When I tested manually, I'd see the page load with no token in the URL.

After lots of testing various things, I found myself looking in the network monitor tab in Firefox again, and I noticed an extra 302 redirect.  It turns out that my page was hosted at www.combee.net, but I'd specified combee.net in the URLs for Instagram.  My web host did a 302 redirect to www.combee.net, and that second redirect was losing the hash with the authentication token.

Chaning my redirect URL to use www.combee.net directly fixed it, and now its working on all the platforms.
Tags: ,

  • 1
Just wanted to say thanks for this. Saved me a headache!

  • 1
?

Log in

No account? Create an account