Javascript Froala/PHP-图像上载失败（出现问题…）_Javascript_Php_Wysiwyg_Froala

Javascript Froala/PHP-图像上载失败（出现问题…）

javascript php

Javascript Froala/PHP-图像上载失败（出现问题…）,javascript,php,wysiwyg,froala,Javascript,Php,Wysiwyg,Froala,试图让Froala在PHP环境中将图像上载到服务器。完全遵循弗罗拉的榜样但是，当我选择一个图像文件并提交时，我得到的反馈是一条错误消息：“出现了问题，请重试” 我使用了与示例中相同的文件/目录名，但显然我遗漏了一些东西。该目录是图像存储的“上载” 我阅读了大多数其他Stackoverflow评论和解决方案，尝试了其中的几个，阅读了Froala的信息，但仍然没有成功下面我使用的代码与他们的示例完全相同编辑器文件：“index.php” 文件上传示例。 $（函数（）{ $（“#编辑”）.fr

试图让Froala在PHP环境中将图像上载到服务器。完全遵循弗罗拉的榜样

但是，当我选择一个图像文件并提交时，我得到的反馈是一条错误消息：“出现了问题，请重试”

我使用了与示例中相同的文件/目录名，但显然我遗漏了一些东西。该目录是图像存储的“上载”

我阅读了大多数其他Stackoverflow评论和解决方案，尝试了其中的几个，阅读了Froala的信息，但仍然没有成功

下面我使用的代码与他们的示例完全相同

编辑器文件：“index.php”


文件上传示例。
$（函数（）{
$（“#编辑”）.froalaEditor({
//设置文件上载URL。
imageUploadURL:“/upload_image.php”，
imageUploadParams：{
id:“我的编辑”
}
})
});

PHP文件：“upload_image.PHP”

link=$protocol.$\u服务器[“HTTP\u主机”]。目录名（$\u服务器[“PHP\u SELF”]）。$fileRoute$名称
//发送响应。
回音条带斜杠（json_编码（$response））；
}捕获（例外$e）{
//发送错误响应。
echo$e->getMessage（）；
http_响应_代码（404）；
}
?>

从他们的网站上下载

在进行任何上载之前，必须将上载目录设置为有效位置。路径可以是任何可访问且写可用的文件夹。

请检查您的文件夹权限，这是常见的疏忽

问候

edwoli通过执行以下操作使其工作：

在index.php文件中，删除了引用“upload_image.php”的斜杠“/”。将

imageUploadURL:'/upload_image.php'，

更改为

imageUploadURL:'upload_image.php'，

很难相信Froala网站示例中存在此错误，并且尚未更正

第二个问题是“finfo”函数不起作用。我在php.ini中通过删除分号启用了它，现在一切正常

编辑：Froala评论说，如果文件位于根目录中，则“/”将起作用。我的没有。

谢谢你的提示，但还是没有运气-文件夹有写权限，上传目录与代码引用匹配：$fileRoute=“/uploads/”；我不认为它需要完整的路径名？六羟甲基三聚氰胺六甲醚。。。

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">

  <!-- Include external CSS. -->
  <link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.4.0/css/font-awesome.min.css" rel="stylesheet" type="text/css" />
  <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.25.0/codemirror.min.css">

  <!-- Include Editor style. -->
  <link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.5.1/css/froala_editor.pkgd.min.css" rel="stylesheet" type="text/css" />
  <link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.5.1/css/froala_style.min.css" rel="stylesheet" type="text/css" />
</head>

<body>
  <!-- Include external JS libs. -->
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.25.0/codemirror.min.js"></script>
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/codemirror/5.25.0/mode/xml/xml.min.js"></script>

  <!-- Include Editor JS files. -->
  <script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.5.1//js/froala_editor.pkgd.min.js"></script>
  <div class="sample">
    <h2>File upload example.</h2>
    <form>
      <textarea id="edit" name="content"></textarea>
    </form>
  </div>

  <!-- Initialize the editor. -->
  <script>
    $(function() {
      $('#edit').froalaEditor({
        // Set the file upload URL.
        imageUploadURL: '/upload_image.php',

        imageUploadParams: {
          id: 'my_editor'
        }
      })
    });
  </script>
</body>
</html>

<?php

try {
  // File Route.
  $fileRoute = "/uploads/";

  $fieldname = "file";

  // Get filename.
  $filename = explode(".", $_FILES[$fieldname]["name"]);

  // Validate uploaded files.
  // Do not use $_FILES["file"]["type"] as it can be easily forged.
  $finfo = finfo_open(FILEINFO_MIME_TYPE);

  // Get temp file name.
  $tmpName = $_FILES[$fieldname]["tmp_name"];

  // Get mime type.
  $mimeType = finfo_file($finfo, $tmpName);

  // Get extension. You must include fileinfo PHP extension.
  $extension = end($filename);

  // Allowed extensions.
  $allowedExts = array("gif", "jpeg", "jpg", "png", "svg", "blob");

  // Allowed mime types.
  $allowedMimeTypes = array("image/gif", "image/jpeg", "image/pjpeg", "image/x-png", "image/png", "image/svg+xml");

  // Validate image.
  if (!in_array(strtolower($mimeType), $allowedMimeTypes) || !in_array(strtolower($extension), $allowedExts)) {
    throw new \Exception("File does not meet the validation.");
  }

  // Generate new random name.
  $name = sha1(microtime()) . "." . $extension;
  $fullNamePath = dirname(__FILE__) . $fileRoute . $name;

  // Check server protocol and load resources accordingly.
  if (isset($_SERVER["HTTPS"]) && $_SERVER["HTTPS"] != "off") {
    $protocol = "https://";
  } else {
    $protocol = "http://";
  }

  // Save file in the uploads folder.
  move_uploaded_file($tmpName, $fullNamePath);

  // Generate response.
  $response = new \StdClass;
  $response->link = $protocol.$_SERVER["HTTP_HOST"].dirname($_SERVER["PHP_SELF"]).$fileRoute . $name;

  // Send response.
  echo stripslashes(json_encode($response));

} catch (Exception $e) {
   // Send error response.
   echo $e->getMessage();
   http_response_code(404);
}
?>