Geek Answers Handbook

PHP server Download image from Phonegap and jQuery

Ok, I have a small image upload application (using phonegap, jQuery). I am loading jquery download via AJAX. The image is being sent, but I'm not sure how to properly handle it on the sidelines. Any thoughts are very welcome! Here is my code:

PHP:

<?php ////////THE PROBLEM AREA I THNK////////// if ($_REQUEST['image']) { // convert the image data from base64 $imgData = base64_decode($_REQUEST['image']); // set the image paths $file = '/uploaded_files/' . md5(date('Ymdgisu')) . '.jpg'; $url = 'http://creativetree.co/creativetreeAlpha' . $file; // delete the image if it already exists if (file_exists($file)) { unlink($file); } // write the imgData to the file $fp = fopen($file, 'w'); fwrite($fp, $imgData); fclose($fp); } echo "<h1>Page is online</h1>"; echo "<p>Nothing special just a first go at phonegap! </p>"; echo "<h2>Contents of uploaded_files Folder to show iphone upload</h2>"; $dir = '/homepages/22/d397139588/htdocs/creativetreeAlpha/uploaded_files'; if ($handle = opendir($dir)) { while (false !== ($file = readdir($handle))) { if ($file != "." && $file != "..") { echo "$file\n"; echo "<br>"; } } closedir($handle); } ?>

Basic HTML:

 <script> function onBodyLoad() { document.addEventListener("deviceready",onDeviceReady,false); } </script> </head> <body onload="onBodyLoad()"> <body> <h1>Upload an image</h1> <div id="upload" <input type="button" class="send-image" value="camera" /> <input type="button" class="send-image" value="library" /> <img style="width:60px; height:60px" id="image" src="" /> </div> <div id="output"></div> </body> </html>

JavaScript:

 $(document).ready(function(){ $(document).bind('deviceready', function(){ function sendImage(src) { src = (src == 'library') ? Camera.PictureSourceType.PHOTOLIBRARY : Camera.PictureSourceType.CAMERA; navigator.camera.getPicture(success, fail, {quality: 45, sourceType: src}); function success(imageData) { var url = 'http://creativetree.co/creativetreeAlpha/mobileImageUpload.php'; var params = {image: imageData}; // send the data $.post(url, params, function(data) { alert('sent'); // Display the selected image on send complete $('#image').attr('src', 'data:image/jpeg;base64,' + params['image']); }); } } function fail(message) { alert(message); } $('.send-image').click(function () { sendImage($(this).val()); }); }); });
+7
source share
2 answers

Shorten the long story, I needed to set permissions on my online server folders.

It is also worth noting any new iphone developers using telephone distribution and URL access (which is important for AJAX, obviously). The URL must be specified in the Xcode project (PhoneGap.plist contains an array for storing external URLs).

This may be obvious to some, but it seems that even PhoneGap is not very well documented (or at least I haven’t seen it in my crazy Google search engines). The wiki textbook I studied doesn't say anything about this.

See image for details.

enter image description here

0
source

Check write permissions for the directory in which you create the image using fwrite.

+1
source

More articles:


All Articles