【问题标题】:how to change upload path in froala wysiwyg如何在 froala 所见即所得中更改上传路径
【发布时间】:2017-07-10 17:26:08
【问题描述】:

我正在开发使用 Froala 2.4.0 所见即所得编辑器的项目。 我正在使用 xampp 和 localhost 测试。 我不能使用本地路径上传图片和文件,所有文件和图片上传在:https://i.froala.com/ 但我想将所有文件和图片上传到http://localhost/uploads

怎么办? 我在 froala 网站上试过,但我做不到。

【问题讨论】:

    标签: php file-upload image-uploading froala


    【解决方案1】:

    上传图片:

    • 在 localhost 中创建“上传”目录,

    • 在上传中创建“图像”目录,

    • 在 localhost 中创建一个包含以下内容的 php 文件“upload_image.php”:

      <?php
      // Allowed extentions.
      $allowedExts = array("gif", "jpeg", "jpg", "png", "blob");
      
      // Get filename.
      $temp = explode(".", $_FILES["file"]["name"]);
      
      // Get extension.
      $extension = end($temp);
      
      // An image check is being done in the editor but it is best to
      // check that again on the server side.
      // Do not use $_FILES["file"]["type"] as it can be easily forged.
      $finfo = finfo_open(FILEINFO_MIME_TYPE);
      $mime = finfo_file($finfo, $_FILES["file"]["tmp_name"]);
      
      if ((($mime == "image/gif")
      || ($mime == "image/jpeg")
      || ($mime == "image/pjpeg")
      || ($mime == "image/x-png")
      || ($mime == "image/png"))
      && in_array(strtolower($extension), $allowedExts)) {
            // Generate new random name.
            $name = sha1(microtime()) . "." . $extension;
      
            // Save file in the uploads folder.
            move_uploaded_file($_FILES["file"]["tmp_name"], getcwd() . "/uploads/images/" . $name);
      
            // Generate response.
            $response = new StdClass;
            $response->link = "http://localhost/uploads/images/" . $name;
            echo stripslashes(json_encode($response));
      }
         ?>
      

    并将此脚本插件添加到您的编辑器页面:

      <script type="text/javascript" src="froala_editor_directory/js/plugins/image.min.js">
    

    并编辑“image.min.js”,将 imageUploadURL 参数更改为:

      imageUploadURL:"http://localhost/upload_image.php",
    

    并重复文件上传的所有步骤:

    • 在上传中创建“文件”目录,

    • 在 localhost 中使用以下内容创建一个 php 文件“upload_file.php”:

      <?php
      // Get filename.
      $temp = explode(".", $_FILES["file"]["name"]);
      
      // Get extension.
      $extension = end($temp);
      
      // An image check is being done in the editor but it is best to
      // check that again on the server side.
      // Do not use $_FILES["file"]["type"] as it can be easily forged.
      $finfo = finfo_open(FILEINFO_MIME_TYPE);
      $mime = finfo_file($finfo, $_FILES["file"]["tmp_name"]);
      
      $allowedExts = array(
          'pdf', 
          'doc', 
          'docx', 
          'xls', 
          'xlsx'
      );
      
      $allowedMimeTypes = array(
          'application/x-pdf', 
          'application/pdf',
          'application/msword', 
          'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
          'application/vnd.ms-excel', 
          'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
      );
      
      if (in_array(strtolower($extension), $allowedExts) AND in_array($mime, $allowedMimeTypes)) {
            // Generate new random name.
            $name = sha1(microtime()) . "." . $extension;
      
            // Save file in the uploads folder.
            move_uploaded_file($_FILES["file"]["tmp_name"], getcwd() . "/uploads/files/" . $name);
      
            // Generate response.
            $response = new StdClass;
            $response->link = "http://localhost/uploads/files/" . $name;
            echo stripslashes(json_encode($response));
      }
        ?>
      

    并将此脚本插件添加到您的编辑器页面:

      <script type="text/javascript" src="froala_editor_directory/js/plugins/file.min.js">
    

    并编辑“file.min.js”将fileUploadURL参数更改为:

      fileUploadURL :"http://localhost/upload_file.php",
    

    最后,如果您收到错误“出现错误,请重试”,您应该enable extension = php_fileinfo.dll

    祝你好运:)

    【讨论】:

    • 不错的解决方案!它对我有用,但是,如果您不介意,您会为 VIDEO 提供类似的解决方案吗?谢谢。
    猜你喜欢
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2019-09-30
    • 1970-01-01
    • 1970-01-01
    • 2015-02-05
    • 1970-01-01
    • 2021-11-20
    相关资源
    最近更新 更多