UEditor编辑器可以保存到数据库有多种方式,常见的有以下几种:
-
直接将UEditor返回的内容(包括HTML和图片等)存储到数据库中的富文本字段中;
-
将UEditor返回的HTML存储到数据库中,而将图片等资源上传到服务器上的指定目录,记录其对应的路径和文件名等信息,然后在HTML中使用这些路径进行引用;
-
将UEditor返回的HTML和图片等资源保存到第三方云存储服务中(如七牛云、阿里云、腾讯云等),然后在数据库中存储这些资源的链接和相关信息。
以下是示例代码,以第二种方式为例:
前端上传图片时使用的UEditor的配置代码:
var editor = UE.getEditor("editor", {
/* 配置项 */
/* ... */
serverUrl: "/upload.php" // 上传图片的接口地址
});
后端接收并处理上传请求的PHP代码:
<?php
/* 检查是否是上传文件请求 */
if(!isset($_FILES["upfile"])) {
echo json_encode(array(
"state" => "fail",
"msg" => "Invalid Request"
));
exit;
}
/* 根据时间生成上传文件的新文件名 */
$filename = time() . "_" . rand(10000, 99999) . "." . pathinfo($_FILES["upfile"]["name"], PATHINFO_EXTENSION);
/* 将上传的文件移动到指定目录下 */
$dest = "/path/to/upload/" . $filename;
if(move_uploaded_file($_FILES["upfile"]["tmp_name"], $dest)) {
/* 返回成功的响应,包含新的文件名和其访问路径等信息 */
echo json_encode(array(
"state" => "success",
"url" => "/upload/" . $filename,
"title" => $_FILES["upfile"]["name"],
"original" => $_FILES["upfile"]["name"]
));
} else {
/* 返回失败的响应 */
echo json_encode(array(
"state" => "fail",
"msg" => "Upload Failed"
));
}
存储富文本内容接口的PHP代码:
<?php
/* 获取POST数据 */
$content = $_POST["content"];
/* 将富文本内容存储到数据库中 */
/* ... */
一般情况下,富文本内容需要进行安全过滤和处理,以防止XSS攻击等问题,具体实现方式可以参考UESafe插件。