Upload API via Ajax

@jphornor I hope you will find this useful. As we have no plan to develop any mobile apps, if you wish to promote/monetize your mobile app, please let us know.

We will be happy to review it and promote it to rtMedia userbase who may find it useful. :-)

Rahul, So far so good! I ran into an error code 140006 while using the the media upload API. My process looks like this: 1. Get a token (no problems) 2. Get an image file from the user (no problems) 3. Post using jQuery's .post (seems to work) 4. Getting an error: {"status":"FALSE","status_code":140006,"message":"image type missing","data":false}

My post data looks like this: var uploadData = { action : "rtmedia_api", method : "rtmedia_upload_media", token : uploadToken, // sat as a var earlier rtmedia_file : imageData, // a URI to an image context : "profile", } jQuery.post(uploadURL,uploadData,function(u){ console.log(u); }); Console.log outputs the error above.

How do I pass the file type to the upload API?

Thanks! Justyn

@jphornor

There must be a confusion here, JSON API allows you to upload media either by file input or Base64 data, URL upload is not supported.

Out of the two methods, upload by file input is preferable, in the other method you need to pass Base64 encoded string with image type and title for the file being uploaded.

In case you have further doubts, feel free to write to us.

Hey Umesh, Got it. I've converted to Base64 (as this is a mobile app, it gives me more flexibility), but can't get the image to display. Here's my object:

var uploadData = { action: "rtmedia_api" context: "profile" method: "rtmedia_upload_media" rtmedia_file: "data:image/jpeg;base64,/9j/4AA..." //truncated for simplicity title: "testing1" token: myToken } The response via the API is: {"status":"TRUE","status_code":140004,"message":"media updated","data":false} The result on the site is a registered image that shows up in the media, but the image is blank.

Thanks for your patience! Once I have a functional version, I'll push my code to you all so you can share :)

Justyn

Attachment Link(s):

https://rtcamp.com/wp-content/uploads/rtMedia/topics/57297/2014/02/blank-image.jpg

@jphornor

For Base64 upload, you need to just pass the string, it does not requires all the overheads like data:image/jpeg;base64,, and there is a fix for Base64 upload, it will be updated in next release. In case you need it urgently, you can manually download plugin from here -> https://github.com/rtCamp/rtMedia

Base64 upload for API is still under enhanceent, your suggestions are welcome.

I have stripped the header/overhead information out of the string and am still getting a blank image after a successful upload.

Here’s my function with truncated base64 image:

function sendFiletoRTMedia(){	  
	var uploadData = {  
		action 		: "rtmedia_api",  
		method		: "rtmedia_upload_media",  
		token 		: Token, // called in previous function  
		rtmedia_file 	: '/9j/4AAQSkZJRgABA...' // truncated  
		title 		: "test from console",  
		context 	: "profile",  
    		image_type      : "image/jpg"  
	}  
jQuery.post('http://www.example.com/wp-admin/admin-ajax.php',uploadData,function(u){  
		console.log(u);  
		})  
}// sendFiletoRTMedia

Console outputs:
{“status”:“TRUE”,“status_code”:140004,“message”:“media updated”,“data”:false}

In BuddyPress the image name shows up in the activity feed (“test from console”), but the image is blank. When I inspect element in Chrome, the URL src is blank.

Thoughts?

This thread is marked as Solved. jphonor still has a truncated image. please review and reopen ticket.

Hi all,
We are looking into the issue and will notify regarding the same if we find any.

Hey Ritesh,
Would it help if I provided the entire results via an attached file so you could test the script directly yourself? I’m thinking more in regards to the Base64 image content so you can see if I am passing the correct data to the API.

Justyn

Hi Justyn,
Yeah, that will help to debug the issue.

Ritesh,
If you could change the status from “solved”, I think I would get updates on changes. I’m not currently getting any emails when you update.

Thank you very much for you help and I hope the attached doc is useful. Let me know if there is anything I can provide you.

Attachment Link(s):

http://rtcamp.com/wp-content/uploads/rtMedia/topics/65448/2014/05/image-debugging.txt

Hi Justyn,
Thanks for the doc. We will look into it and will let you know regarding the same.

Ritesh,
I need to escalate this issue. We are in a critical situation to get this working.

Hi Justyn,

Sorry for delaying in this.

You are using base64 method, in that case you need to specify image type as jpeg/jpg or png or whatever the type of image. You need to change image_type to either jpeg or jpg in your case. Actually this thing was missed out from the developer doc, we will update it.

Ritesh,
Here’s my function for uploading:

function sendFiletoRTMedia(){	  
	var uploadToken = window.localStorage.getItem("satToken");  
	var imageData = window.localStorage.getItem("satImageObject");	  
	var uploadData = {  
	action 			: "rtmedia_api",  
	method			: "rtmedia_upload_media",  
	token 			: uploadToken,  
	rtmedia_file 		: imageData,  
	title			: "test from console",  
	context			: "profile",  
        image_type		: "image/jpg"  
}

Notice that image_type is set to image/jpg (I tested with image/jpeg as well). Both give me a success message, but the image is blank.

When I changed the image_type: “jpg” (omitting the “image/”), I got the error message “Image type missing” with a status code 140006.

Hi Justyn,

I tested it on our demo site -> http://demo.rtcamp.com/rtmedia/ with the same parameters as you had attached in the above file and file was uploaded successfully. I just changed token value and image_type to jpeg.

Can you please check it once on our demo site and confirm this.

You will get image_type missing message when value of image_type parameter is empty.

Also check with WordPress default theme and with other plugins disabled, just make sure that there isn’t any plugin conflict or theme issue.

Ritesh,
No luck. I turned off all plugins except the base needed for BuddyPress and RT Media, using the Default theme. Here’s the debug info:

Home URL http://dev.shareatalent.com
Site URL http://dev.shareatalent.com
PHP 5.3.24
MYSQL 5.0.96
WordPress 3.9.1
BuddyPress 2.0.1
rtMedia 3.6.14
OS Linux
Imagick ImageMagick 6.5.4-7 2012-05-07 Q16 OpenMP www.imagemagick.org
GD bundled (2.0.34 compatible)
[php.ini] post_max_size 33M
[php.ini] upload_max_filesize 32M
[php.ini] memory_limit 256M
Installed Plugins rtMedia for WordPress, BuddyPress and bbPress by rtCamp version 3.6.14,
BuddyPress by The BuddyPress Community version 2.0.1,
rtMedia Pro by rtCamp version 2.3.1
Theme Name BuddyPress Default
Theme Version 1.9
Author URL http://buddypress.org
Template Overrides plugins/buddypress-media/templates/media/album-gallery-item.php,
plugins/buddypress-media/templates/media/album-gallery.php,
plugins/buddypress-media/templates/media/album-single-edit.php,
plugins/buddypress-media/templates/media/media-gallery-item.php,
plugins/buddypress-media/templates/media/media-gallery.php,
plugins/buddypress-media/templates/media/media-single-edit.php,
plugins/buddypress-media/templates/media/media-single.php,
plugins/buddypress-media/templates/media/uploader.php
Total Albums 29
Total Photos 37


I’m going to build a completely fresh install on a subdomain and see if I can get it to work while I wait back to hear from you.

Thanks, Ritesh!

Just confirmed with a completely fresh installation of latest WordPress, BuddyPress, RT Media, and JSON API. Same results on my end. I get a successful upload message, but the image is blank on the site. Screenshot is attached.

Possible PHP version issues? I noticed that PHP 5.3.24 is installed on both my dev and the test build I just created.

Attachment Link(s):

http://rtcamp.com/wp-content/uploads/rtMedia/topics/65675/2014/05/testing-rtmedia.jpg

Ritesh,
Can you send us the config of the demo site. So we can compare our plugins and versions to your site.