求助:为什么froala富文本编辑器插入图片上传到服务器请求了两次？

问题描述

用的官方demo测试，使用froala设置了imageUploadURL参数后，如下图:

插入图片会自动请求设定好的地址，但是却请求了两次，图片插入后会有一个进度条，这时会出现第一次请求，请求方式是OPTIONS，无请求数据；第二次请求，请求方式是设定的POST，请求数据是字段名为file，值是插入图片的数据。
第一次请求:

第二次请求:

第二次请求返回:

为什么会分两次请求呢？两次请求是正常的吗？难道服务器端就是要判断有没有带上对应数据再做写入文件操作吗？
另外，是否可以设置一些参数来自定义插入图片数据的字段名以及对图片数据进行格式转换？

问题出现的平台版本及自己尝试过哪些方法

看文档可以设置imageParams来带上自定义的参数，但是没找到设置插入图片相关参数的方法；
尝试看<script type="text/javascript" src="https://cdnjs.cloudflare.com/...;></script>里面的代码，水平不够，看不明白，没搞清楚是如何设置请求参数，以及发送请求的，望指点迷津。

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）
html文件的代码，用的froala官方demo

<!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.8.5/css/froala_editor.pkgd.min.css" rel="stylesheet"
        type="text/css" />
    <link href="https://cdnjs.cloudflare.com/ajax/libs/froala-editor/2.8.5/css/froala_style.min.css" rel="stylesheet"
        type="text/css" />
</head>

<body>
    <!-- Create a tag that we will use as the editable area. -->
    <!-- You can use a div tag as well. -->
    <textarea></textarea>

    <!-- 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.8.5/js/froala_editor.pkgd.min.js"></script>

    <!-- Initialize the editor. -->
    <script> 
    $(function () { $('textarea').froalaEditor({
        imageUploadURL:"http://localhost/test/public/index.php/test/Test/uploadFile",//本地测试的地址

    })}); 
    
    </script>
</body>

</html>

本地测试地址的代码

    public function uploadFile(){
        header("Access-Control-Allow-Origin:*");
        if(!isset($_FILES['file'])){
            halt($_FILES);
        }
        
        dump($_POST);dump($_GET);
        halt($_FILES);
    }

隔江千里

浏览 975回答 1