Dynamic Image request troubles (AJAX, Dropbox...!?)

I'm finding it hard to troubleshoot this issue. Any thoughts?

I'm testing out the AJAX functionality to implement into a Social sharing feature. I want to retrieve an image from the server (this cannot be just a project file, as the image to retrieve will change so will need to be able to change the URL via a variable.) and for testing purposes, load it into a sprite here. I'll later expand on this to pass the AJAX response to a share plugin in order to post an image to a user's feed/wall/etc.

In the capx below, the first text version works fine, but the second image version isn't working.

It appears that the AJAX request has run successfully (as notified by the "SUCCESS!" text), however the image is not being loaded into the sprite using "AJAX.LastData".

Below is the event sheet.

Here is a live demo: http://dev.angelserver.in/construct2_test/AJAX_TEST/

Capx is here: http://dev.angelserver.in/construct2_te ... _test.capx

hi, I tested this with IE11, when I clicked the image I got a pop-up. when I enabled that, I got

http://dev.angelserver.in/construct2_test/AJAX_TEST/���JFIF

The webpage cannot be found

firefox reported

"Firefox can't find the file at http://dev.angelserver.in/construct2_test/AJAX_TEST/����."

I'm not able to upgrade to 177 at the moment so I can't look at your capx... but I suspect something has gone wrong. The special characters are a bad sign at least..

Thanks for your reply! Yes, I'm rendering the same result, thanks for confirming it.

I haven't been able to retrieve an error message that's more meaningful unfortunately, so haven't had much luck in further debugging it

Am I using the wrong sort of AJAX request? I'm using "Request URL", for which the help text reads "Request a URL by a GET request and retrieve the server response."

What are you trying exactly ?

Thanks for your reply — Ok, for testing purposes, this is what I'd like to happen:

1. Click img sprite button

2. AJAX calls an image file from the server (crucial that I can set this dynamically - it cannot just be a part of the project files)

3. Upon AJAX load complete, the so-far-empty sprite named 'imgReturnedData' should load the image called by AJAX (LastData).

For the final app, this will be expanded somewhat:

1. User creates their user content (in this case, it will be a mugshot generator which they can upload their own photo to. Functionality-only version here: http://www.angelserver.in/html5/mugshot_generator/ )

2. Upon completion, their image is uploaded to our database using a filename generated within the app

3. The user might want to share the completed image on Facebook, Twitter etc, so they click on the particular 'share'

4. AJAX makes a call to our database to retrieve the user-generated image

5. AJAX.LastData is used to pinpoint the share function to the particular image URL on our database. i.e. Image: "http://our.server/images/" & AJAX.LastData & ".png"

Saving files to your server can actually increase the security risks if not done properly. If you want to save an image to your server, why not save the imagedata string to a mysql database. This would avoid all the file i/o errors that you can generate and decrease the security risks to your server assuming your mysql calls are done correctly.

I did consider this; I've just been exploring my options really. Can you point me in the direction of some resources on this so I can try it out?

My SQL is alright, but I'm not sure where to start, integrating it into a Construct 2 application thank you — , for your suggestion.

A wonderful resource for you especially if you are new is phpclasses.org. It is a wealth of ready made code that you can plug into your website. http://www.phpclasses.org/browse/ will let you browse the available code by category. You want to add a user login/registration they have it under user management. You want file I/o it's there too. Of course they have a whole section on MySQL too. Make sure to give the authors credit if you use their functions. <img src="{SMILIES_PATH}/icon_e_smile.gif" alt=":)" title="Smile">

Thanks — ! I will check it out and see how it goes. If I arrive at a solution using this method, I'll post it here to share it with the community.

Any ideas why my original execution with AJAX didn't work out, however? I'd still like to know.

Oh my, I just converted a test image (a black and white 512px × 608px PNG) to a base64 string, and it came out at 700,046 characters!

Is this expected? Is a string this large an appropriate size to be stored in a database? It slowed my browser right down.

It is a very long string I do know, but that seems rather excessive. I have an upload picture function in my facebook plugin that uses the png string to upload to the users profile. I doesn't slow me down at all. I'm not sure are you possibly calling the snapshot action multiple times?

Nope, doesn't seem to be the case. In this instance, I'm not snapshotting the canvas in any case. I'm using Pode's ExtractImage plugin to convert the image to a base64 string, and trying to send this to the db.

Live (not working) test here: http://dev.angelserver.in/construct2_test/db_test/

Inspect with Firebug or something to track what's going on.

Event sheet for new test below:

So, with this I get a rare 414 error: URI too long! Haven't ever actually seen one of these before. I'm not sure how to handle this. You'll be able to see the length of the base64 string in the Firebug console.

Update: used a POST request instead, and Firebug comes back with a success, however the database is not updated.

Changing the default value of the base64 variable to '123' does update the database, which confirms that my PHP file is working.

It's unclear where the problem is occuring. Perhaps something to do with my data type, or simply the exceedingly long string? (768692 characters in the version generated on the server).

You can't request images with the AJAX object, because it only returns text data.

Instead just use the Sprite object's 'Load image from URL' to load it directly, without using AJAX at all.

Ah, well that's the first mystery cleared up. Thank you, Ashley .