第一次接触Froala的时候还是Froala1.0的时候，当时毫不犹豫的使用了它接入了项目中，当时从下载区提供API接口并不完善，由于由于国外插件国内也比较少有资料；并且我看中的是Froala处理文本功能，也用不上文件/图片上传功能就不了了之。
后来我从Froala.com官方上看到了有大版本的变动，也就是Froala2，本篇文章重点内容，我从官网中查看了大量API接口，并且提供例子，因此有了本文章。好了进入正题，如何使用Froala2来部署上传功能呢，首先你需要准备几个插件/包。
- Froala
- Composer
- 非虚拟机机器(面板机保证能提供)
- Froala Php SDK
接下来你需要把上面几个插件/包逐一的上传到你的服务器上，按照Froala官方你需要先把SDK包（https://github.com/froala/wysiwyg-editor-php-sdk/archive/master.zip）上传到服务器上，在包中找到composer.json，向里面添加上：
{
"require" : {
"froala/wysiwyg-editor-php-sdk" : ""
}
}
注意了如果composer.json内包含了require，你仅需要在括号里面添加"froala/wysiwyg-editor-php-sdk" : ""即可；接着官方要求安装composer.phar，在以命令形式写入php composer.phar install，你需要注意你的composer.phar位置。(如果你安装了composer.phar可以跳过下方)
什么不知道如何安装composer.phar？
好的，那么接下来进行安装composer.phar，打开composer的官方：https://getcomposer.org/download，从官方文档中下载windows版本（windows下载地址：）或以linux命令行下载它，其中linux安装方式是：
php -r "copy('https://getcomposer.org/installer', 'composer-setup.php');"
php -r "if (hash_file('SHA384', 'composer-setup.php') === '55d6ead61b29c7bdee5cccfb50076874187bd9f21f65d8991d46ec5cc90518f447387fb9f76ebae1fbbacf329e583e30') { echo 'Installer verified'; } else { echo 'Installer corrupt'; unlink('composer-setup.php'); } echo PHP_EOL;"
php composer-setup.php
php -r "unlink('composer-setup.php');" //你可以考虑保留不执行它
如果以上composer-setup.php没有警告，那么你可以执行php composer-setup.php来运行composer.phar，附上运行截图
很好，如果你看到这里，这表示着你已经部署好了composer与SDK
- 如果你从官方中无法下载，你可以考虑使用国人提供的镜像Composer（http://www.phpcomposer.com/）
现在在你从Froala下创建一份php代码，用于处理上传的文件并且返回地址给Froala，还有的是官方提供的SDK包具有处理图片/文件格式等功能(如果在Froala js初始的代码中默认那么会以SDK的方式来进行),并且以upload_image.php来命名，完成后丢到服务器上。同时你要注意一下几点：
- 目录包含uploads文件夹
- uploads文件夹是公开可访问的
<?php
// Include the editor SDK.
require 'PATH_TO_FROALA_SDK/lib/froala_editor.php';
// Store the image.
try {
$response = FroalaEditor_Image::upload('/uploads/');
echo stripslashes(json_encode($response));
}
catch (Exception $e) {
http_response_code(404);
}
?>
现在接着向你初始化Froala js中添加
imageUploadURL: '/upload_image.php';
如果你不知道在哪里添加它，你可以看看下发完整的js代码来识别添加位置。
<script>
$(function() {
$('.selector').froalaEditor({
// Set the image upload URL.
imageUploadURL: '/upload_image.php'
})
});
</script>
确保你地址无误后，现在你可以在项目中尝试在文本框内拖拽图片或者点击插入图片按钮来上传图片。
如果你想了解更多Froala的一些图片处理后/处理错误/处理中的响应，你可以访问https://www.froala.com/wysiwyg-editor/docs/events#image.beforePasteUpload了解接口
—感谢你抽出时间来阅读