简体   繁体   English

PHP Server从Phonegap和Jquery上传图像

[英]PHP Server Upload an image from Phonegap and Jquery

Okay I have a small app for uploading an image (using phonegap, Jquery). 好的,我有一个用于上传图像的小应用程序(使用phonegap,Jquery)。 I have jquery handling upload via AJAX. 我通过AJAX上传jquery处理。 The image is being sent but I am not sure how to process it correctly at the severside. 图像正在发送但我不确定如何在severside正确处理它。 Any thoughts very welcome! 任何想法都非常欢迎! Here's my code so far: 到目前为止,这是我的代码:

PHP: 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: 基本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: 使用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()); });

  });
});

使用fwrite检查要在其中创建映像的目录的写入权限。

Cut a long story short I needed to set permissions on my online server folders. 简而言之,我需要在我的在线服务器文件夹上设置权限。

Also worth noting for any new iphone Developers using phonegap and accessing a URL (essential for AJAX obviously). 另外值得注意的是任何使用phonegap并访问URL的新iphone开发者(显然对于AJAX至关重要)。 The URL must be set in the Xcode project (PhoneGap.plist contains an array to store external URL's). 必须在Xcode项目中设置URL(PhoneGap.plist包含用于存储外部URL的数组)。

This maybe obvious to some but seems to be not very well documented even by PhoneGap (or at least I did not see on my frantic google searches). 对于某些人来说这可能是显而易见的,但即使是PhoneGap似乎也没有很好的记录(或者至少我没有在疯狂的谷歌搜索中看到)。 The wiki tutorial I studyed mentioned nothing about this. 我研究过的wiki教程没有提到这一点。

See image for details. 有关详情,请参阅图片

在此输入图像描述

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM