如何不透過 input 也抓到每個 img 的值？並且下載到 server 中？

Question

這是我找到的資源
http://jsfiddle.net/qF7Ff/

我現在的做法是一樣用 js 的filereader去產生每個 base64 網址
每一個預覽都是一個 input name=icon[]
然後後端再用這樣去接，去下載下來每個圖片
所以會是 <input name="icon[]" type="hidden" value="base64......">

foreach ($_POST['icon'] as $key => $value) {

      preg_match('/^(data:\s*image\/(\w+);base64,)/', $value, $result);
      $file_ext = '.'.$result[2];
      $file_name = $first['prod_id'].'-'.md5(rand());
      file_put_contents('../../images/product/'.$file_name.$file_ext, base64_decode(str_replace($result[1], '', $value)));

我找到的那個資源，裡面一樣是上傳，只是他產生的每一個物件都是 <img src="base64.......">
那我後端我要怎麼接才能下載這些圖片？
ajax 需要做什麼改變來接應呢？

ajax

var formData = new FormData($('#form')[0]);

$.ajax({
        type: "POST",
        url: "xxx",
        data: formData,
        enctype: "multipart/form-data",
        cache: false,
        contentType: false,
        processData: false,

Answer 1

你的问题读起来比较费力，努力理解，你想将客户端<input type=hidden>中的传过来的base 64格式图片保存到服务器上？ 服务端这样实现

foreach语句省略
    //匹配出图片的格式
    if (preg_match('/^(data:\s*image\/(\w+);base64,)/', $value, $result)){
        $type = $result[2];
        $path = "upload/";
        if(!file_exists($path))
        {
            //检查是否有该文件夹，如果没有就创建，并给予最高权限
            mkdir($path, 0700);
        }
        $new_file = $path . time() . ".{$type}";
        if (file_put_contents($new_file, base64_decode(str_replace($result[1], '', $base64_image_content)))){
            echo '保存成功：', $new_file;
        } else {
            echo '保存失败';
        }
    }