编写示例代码时,Summernote没有在服务器上上传文件,也没有显示在编辑器上,该怎么办?

时间:2019-06-04 15:54:17

标签: jquery summernote

我无法获取summercode在编辑器上显示图像或发送给服务器。我已经阅读了官方文档,但没有成功。

我尝试了summernote的官方指南,以及关于stackoverflow的另一种解决方案。 如果删除onImageUpload回调,则会在编辑器上获得图像。而且我仍然对如何使插入的图像发送到服务器感到困惑(我确信它在POST请求中获得了成功响应)。 (我更喜欢在纯PHP中回答如何上传和不使用框架)。

$(document).ready(function() {
    $('#summernote').summernote({
        height: "300px",
        dialogsInBody: true,
        callbacks: {
            onImageUpload: function(files) {
                console.log("Sending image file");
                uploadFile(files[0]);
            }
        }
    });

    function uploadFile(file) {
        data = new FormData();
        data.append("file", file);

        $.ajax({
            data: data,
            type: "POST",
            url: "http://localhost/ngetest/assets/images/",
            cache: false,
            contentType: false,
            processData: false,
            success: function(url) {
                console.log("image file sent!");
                $('#summernote').summernote("insertImage", url);
            },
            error: function(jqXHR, textStatus, errorThrown) {
                console.log(textStatus+" "+errorThrown);
            }

        });
    }
});

这是权限

total 12
drwxrwxrwx 3 root root 4096 Jun  4 23:06 assets
-rw-r--r-- 1 root root 1589 Jun  4 23:41 index.html
-rw-r--r-- 1 root root  498 Jun  4 23:06 test.php

这是层次结构

.:
assets  index.html  test.php

./assets:
images

./assets/images:

这是除了脚本之外的整个HTML文件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title></title>
    <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet"> 
    <link href="https://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.8/summernote.css" rel="stylesheet">
</head>
<body>
    <div class="form-group">
    <form action="test.php" method="post">
        <label for="summernote"><h1>Content</h1></label>
        <textarea id="summernote" class="summernote" name="contents">
        </textarea>
        <input type="submit" class="btn btn-success"/>
    </form>
    </div>

运行时抛出的错误是错误当我运行这些代码时找不到。并在我更改时发送文件

http://localhost/ngetest/assets/images/ to http://localhost/ngetest/ 
or 
http://localhost/ngetest/test.php

我希望onImageUpload方法失败后,它仍会在编辑器上显示图像,但不会,并且也不会进入服务器目录

http://localhost/ngetets/assets/images/

可能会晚一点。但这就是test.php的内容

<?php
$allowed = array('png', 'jpg', 'gif');
if (isset($_FILES['file']) && $_FILES['file']['error'] == 0) {
    $extension = pathinfo($_FILES['file']['name'], PATHINFO_EXTENSION);
    if (!in_array(strtolower($extension), $allowed)) {
        echo "AN ERROR OCCURED - INVALID IMAGE";
        exit;
    }
    if (move_uploaded_file($_FILES['file']['tmp_name'], 'assets/images'.$_FILES['file']['name'])) {
        echo 'http://localhost/ngetest/assets/images/'.$_FILES['file']['name'];
        exit;
    }
}
echo 'AN ERROR OCCURED';
exit;

0 个答案:

没有答案