Wednesday, August 19, 2015

Abiathar Online - Saving!

After yesterday's discovery of URL length limitations, I had to figure out some way to get the level data to Dropbox via a real URL but not in the query string. Some thinking and two quick-and-dirty PHP scripts later, I had a way to upload levels and a page that Dropbox can hit to download them, which causes the server to delete the file to save space. Unique IDs for each file are generated by JavaScript. Security isn't super tight (this is PHP after all), but I do prefix the filenames with "OpenThar" to prevent easy exploits, and if it gets hacked, nothing is lost.

Some problems were had in the XMLHttpRequest upload. At first I didn't realize that the equals signs sometimes added by Base64 could cause issues for x-www-form-urlencoded data. That was easily solved with an encodeURIComponent call in JavaScript. Then there was the baffling issue of the XHR's readyState property always being 1. Apparently, that property will not work correctly in Chrome if any of the following are true:
  • The server doesn't send all of the necessary headers (I had PHP explicitly set the Access-Control-Allow-Origin header so the JavaScript could export data to it)
  • No handler is hooked up to the onreadystatechange event (a while loop that checks the state will not work)
  • The main thread is busy (e.g. in an infinite loop, or waiting for the state to change)
I thought at first that the Dropbox Saver wouldn't appear if I had its invocation in an XMLHttpRequest completion handler, but it seems to be working. If it doesn't, people can just add an exception in their pop-up blocker for my place.

After a good while of fiddling around with JavaScript and PHP, I finally got it to save to my Dropbox. There was a bit of corruption in the level headers in the GAMEMAPS, but I think that was from the lack of URL encoding, which has since been added. I added some extra padding at the end just in case. It seems to be working consistently now. Abiathar Online can load, modify, and save levels!

No comments:

Post a Comment