Ajax POST with binary data

[phpknight]

If I am uploading an image using AJAX and post data, how do I send it in the params variable?  I see examples for POST, but usually it is still with stuff like name=jack.  But what about when the POST data is actually an image?

[Mardoxx]

I'm not entirely sure what you mean (only just started playing with AJAX this week)

but this might help, this is how I GOT an image (dynamically):

var image = NEW Image();

function data_string(data) { // Generates the binary data string from character / multibyte data
	var data_string='';
	for(var i=0,il=data.length;i<il;i++)data_string+=String.fromCharCode(data[i].charCodeAt(0)&0xff);
	return data_string;
}

function mime_from_data(data) { // Simple function that checks for JPG, GIF and PNG from image data. Otherwise returns false.
	if('GIF'==data.substr(0,3))return 'image/gif';
	else if('PNG'==data.substr(1,3))return 'image/png';
	else if('JFIF'==data.substr(6,4))return 'image/jpg';
	return false;
}


function display_image() {
	if (imageRequest.readyState == 4) {
		imageData = data_string(imageRequest.responseText); //RAW BINARY data of image, you know.. where it looks like diamonds with ?s in it
		var base64imageData = btoa(imageData);	
		var imageDataStream = 'data:' + mime_from_data(imageData) + ';base64,' + base64imageData;
		image.src = imageDataStream;
		image.name = "image"; //sets a name in as key so easy to find
		// !!!! NO, image.prototype.NEWTHING does _NOT_ work !!!! //
		document.images['image'].id = "Picture1";
		document.images['image'].width = "100";
		document.images['image'].height = "100";
		document.images['image'].border = "0";
		document.images['image'].alt = "OH LAWDY, AN IMAGE";
		document.images['image'].onmouseout = function () {alert("WHY DID YOU LEAVE ME?");};
		document.images['image'].onmousemove = function (event) {getMousePosition(event);}; //TAKE NOTE OF event!!
		/* OR you could use these two:
		graph.onmouseout = function () {alert("WHY DID YOU LEAVE ME?");};
		graph.onmousemove = function (event) {getMousePosition(event);};
		*/
		fs.appendChild(image);
	}
}

 

So I'm thinking, convert it to base64 then send it through php POST via an AJAX call

 

so basically send....

			imageData = from_form; //RAW BINARY data of image, you know.. where it looks like diamonds with ?s in it
		var base64imageData = btoa(imageData);	
		var imageDataStream = 'data:' + mime_from_data(imageData) + ';base64,' + base64imageData;
		//SEND THIS >>>>>>>> imageDataStream 

 

 

//edit

oh yeah... for future reference, if you ARE getting image data, imageRequest.overrideMimeType("text/plain; charset=x-user-defined");