javascript - 使用 ajax 和 PHP 裁剪后将图像保存到 MySQL

标签 javascript php jquery ajax angularjs

下面的代码将从本地选择后裁剪图像,然后提供副本。

有没有可能的方法将裁剪后的图像保存到 MySQL,因为我看过很多文章,但他们在服务器端和客户端都使用 PHP,但我将其用于允许客户端使用 JavaScript 或 Jquery 的移动应用程序。 在服务器端我使用 PHP。

JSfiddel

HTML:

 <body ng-app="app" ng-controller="Ctrl">
      <div>Select an image file: <input type="file" id="fileInput" /></div>
      <div class="cropArea">
        <img-crop image="myImage" result-image="myCroppedImage"></img-crop>
      </div>
      <div>Cropped Image:</div>
      <div><img ng-src="{{myCroppedImage}}" /></div>
    </body>

JS:

angular.module('app', ['ngImgCrop'])
  .controller('Ctrl', function($scope) {
    $scope.myImage='';
    $scope.myCroppedImage='';

    var handleFileSelect=function(evt) {
      var file=evt.currentTarget.files[0];
      var reader = new FileReader();
      reader.onload = function (evt) {
        $scope.$apply(function($scope){
          $scope.myImage=evt.target.result;
        });
      };
      reader.readAsDataURL(file);
    };
    angular.element(document.querySelector('#fileInput')).on('change',handleFileSelect);
  });

最佳答案

试试这个。

 $data = json_decode(file_get_contents('php://input'), true);

 $img = str_replace('data:image/png;base64,', '', $data['img']);

 $img = str_replace(' ', '+', $img);

 $data = base64_decode($img);

 $file = "images/4.jpg";

 file_put_contents($file, $data);

关于javascript - 使用 ajax 和 PHP 裁剪后将图像保存到 MySQL,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31355823/

相关文章:

php - 使用代理安全吗?

javascript - 使用 attr 函数替换属性

javascript - 当单击 iframe 内的按钮时,如何增加 iframe 的高度?

javascript - 如何为可扩展的搜索栏编写代码,将导航链接变成一个框?

javascript - 可以通过浏览器访问远程 json 组件,但不能通过 $.getJSON() 以编程方式访问

javascript - 如果在谷歌中点击重定向到主页

php - PHP 中递增/递减运算符的优先级

javascript - 蒙戈数据库 : How to find out all the documents which are near certain location?

javascript - 无法在 AngularJS (Web) 中更新 Firebase 实时数据库

jquery - 为什么 jQuery UI 单选按钮之间会出现间隙?