обрезать изображение и загрузить - PullRequest
Новая
       34

обрезать изображение и загрузить

0 голосов
/ 20 июня 2019

Я преобразую строку base64 в изображение и хочу переместить обрезанное изображение в скрытое поле ввода, чтобы опубликовать его на стороне сервера после того, как пользовательские клики подтвердят, но я застрял в том, как передать imgData на сторону сервера.собирается не преобразованная строка. Как мне поступить?

пытался добавить к входу, но он не работает 

<form action="${url}" method="post" enctype="multipart/form-data">
      <div class="image-editor">
         <input type="file"  name="uploadedFile" size="50" 
           required="required" class="cropit-image-input"/>
         <input type="hidden" name="fileName" 
                                  class="hidden-image-data" />
        <div class="cropit-preview"></div>
        <div class="image-size-label">
          Resize image
        </div>
        <input type="range" class="cropit-image-zoom-input">
        <button type="submit">Submit</button>
      </div>
 </form>


   <div id="result">
      <code>$form.serialize() =</code>
      <code id="result-data"></code>
    </div>



 <script>
   $(function() {
            $('.image-editor').cropit();

            $('form').submit(function() {

            var imageData = $('.image-editor').cropit('export');


          //base64 function
          function Base64ToImage(base64img, callback) {
              var img = new Image();
              img.onload = function() {
                  callback(img);
              };
              img.src = base64img;
          }

          var base64img = imageData;

          var imgData = null;
          // Base64
          Base64ToImage(base64img, function(img) {
              // <img>

              document.getElementById('main').appendChild(img);
              imgData = img;
          });
       // Move cropped image data to hidden input 
         $('.hidden-image-data').val(imgData);


          return true;



          });
        });


   </script>
...