Question

我正在尝试将粘贴的图像保存到文件夹中并将相关详细信息保存到数据库中，但我当前的代码不保存粘贴的图像，我尝试在src属性上放置一个硬编码的URL并且它正在工作

我检查粘贴的图像的src的元件，这是非常长的，像这样的“数据：图像/ PNG; BASE64，iVBORw0KGgoAAAANSUhEUgAAARIAAAC4CAYAAAAvx2MfAAAgAElEQVR4Ae2dCXwW1dX ...” 其比这更长，但对于样品的目的。如何使用此图像地址保存图像？请帮忙。

这是HTML：

<div class="col-lg-6">
   <div class="form-group col-lg-12">
      <input class="form-control" id="pasteArea" placeholder="Paste image here..."></input>
      <img name="map-sketch" id="pastedImage" width="100%" height="100%" src='images/sample.png'></img>
   </div>
</div>

<div class="col-lg-1">
    <button type="button" class="btn btn-primary" onclick="save()">Save</button>
</div>
<div class="col-lg-2" id="saving-info"></div>

上图中的src是一个硬编码网址。

这是我正在使用的javascript onpaste：

document.getElementById('pasteArea').onpaste = function (event) {
   var items = (event.clipboardData  || event.originalEvent.clipboardData).items;
   console.log(JSON.stringify(items)); // will give you the mime types

   var blob = null;
   for (var i = 0; i < items.length; i++) {
      if (items[i].type.indexOf("image") === 0) {
         blob = items[i].getAsFile();
      }
   }

   if (blob !== null) {
      var reader = new FileReader();
      reader.onload = function(event) {
         console.log(event.target.result); // data url!
         document.getElementById("pastedImage").src = event.target.result;
      };
      reader.readAsDataURL(blob);
   } 
}

这是AJAX代码：

function save(){
   var params = 'kind=land';
   var image = document.getElementById("pastedImage").getAttribute("src");
   params += '&image='+image;
   if (window.XMLHttpRequest) {
        // code for IE7+, Firefox, Chrome, Opera, Safari
        xmlhttp = new XMLHttpRequest();
    } else { // code for IE6, IE5
        xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");

    }
    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            document.getElementById("saving-info").innerHTML = xmlhttp.responseText;
        }else { // waiting for result 
            document.getElementById('saving-info').innerHTML = '<img src="../images/ajax_loader.gif">';
        }
    }
    xmlhttp.open("POST", "../functions/save-faas.php", true);
    xmlhttp.setRequestHeader("Content-Type","application/x-www-form-urlencoded");
    xmlhttp.send(params);
}

这是用于保存图像的PHP代码：

<?php
   $url = $image;
   $img = '../images/1.png';
   file_put_contents($img,file_get_contents($url));
?>

此处的代码使用的是硬编码的URL，但不适用于粘贴的图像。

我该怎么办？感谢。

Answer 1

如何在此df %>% mutate_at(vars(-ID), as.character) %>% fill(ID) %>% group_by(ID) %>% summarise(lets = toString(na.omit(c(col1, col2, col3, col4)))) %>% separate(lets, sprintf('col%02d', 1:10), fill = 'right') #> # A tibble: 4 × 11 #> ID col01 col02 col03 col04 col05 col06 col07 col08 col09 col10 #> * <dbl> <chr> <chr> <chr> <chr> <chr> <chr> <chr> <chr> <chr> <chr> #> 1 1 a e i j k r s t <NA> <NA> #> 2 2 b f l m n o u v w x #> 3 3 c g p y <NA> <NA> <NA> <NA> <NA> <NA> #> 4 4 d h q z <NA> <NA> <NA> <NA> <NA> <NA> ID上使用onchange？

pasteArea

如何使用php使用src“data：image / png; base64，...”保存onpaste图像

1 个答案: