【发布时间】：2021-10-20 18:58:48
【问题描述】：
我想知道有什么方法可以使用 TinyMCE 中的本地文件选择器上传图片，我们可以指定图片上传路径？以前我已经制作了一个本地文件（图像）选择器，但是当我上传它时，图像将作为 base64 编码图像存储在 txt 文件中。我想要的是将图像直接保存到我的服务器，并将“img src”作为指定的上传路径。有人知道执行此操作的代码吗？感谢所有帮助，非常感谢！
28/8/2021 我想根据@Dmitry D 建议的答案更新我当前的代码。我已经将 automatic_uploads 设置为“true”，并指定了习惯于我的本地目录的上传目录，但它仍然返回 405 http 错误。
目前我正在使用 TinyMCE 5.8.2 生产包 我已经设置了 FLASK_ENV = development 和 FLASK_APP = app
这是我的 index.html
<body>
<div class="container">
<div class="row">
<h2>TinyMCE Upload Image with Python Flask</h2>
<form id="posts" name="posts" method="post" action="./static/tinymce/postAcceptor.php">
<textarea name="message" id="message"></textarea><br>
</form>
</div>
</div>
<script src="./static/tinymce/tinymce.min.js"></script>
<script>
tinymce.init({
selector: "textarea#message",
plugins: "code image",
toolbar: 'undo redo image',
image_title: true,
automatic_uploads: true,
images_upload_url: './static/tinymce/postAcceptor.php',
images_upload_credentials: true,
file_picker_types: 'image',
});
</body>
app.py（Flask 框架）
from flask import Flask, render_template, jsonify, request
from werkzeug.utils import secure_filename
import os
import urllib.request
app = Flask(__name__)
@app.route('/')
def main():
return render_template('index.html')
if __name__ == '__main__':
app.run(debug=True)
postAcceptor.php
<?php
/***************************************************
* Only these origins are allowed to upload images *
***************************************************/
$accepted_origins = array("http://localhost", "http://127.0.0.1");
/*********************************************
* Change this line to set the upload folder *
*********************************************/
$imageFolder = "./static/uploads/";
if (isset($_SERVER['HTTP_ORIGIN'])) {
// same-origin requests won't set an origin. If the origin is set, it must be valid.
if (in_array($_SERVER['HTTP_ORIGIN'], $accepted_origins)) {
header('Access-Control-Allow-Origin: ' . $_SERVER['HTTP_ORIGIN']);
} else {
header("HTTP/1.1 403 Origin Denied");
return;
}
}
// Don't attempt to process the upload on an OPTIONS request
if ($_SERVER['REQUEST_METHOD'] == 'OPTIONS') {
header("Access-Control-Allow-Methods: POST, OPTIONS");
return;
}
reset ($_FILES);
$temp = current($_FILES);
if (is_uploaded_file($temp['tmp_name'])){
/*
If your script needs to receive cookies, set images_upload_credentials : true in
the configuration and enable the following two headers.
*/
// header('Access-Control-Allow-Credentials: true');
// header('P3P: CP="There is no P3P policy."');
// Sanitize input
if (preg_match("/([^\w\s\d\-_~,;:\[\]\(\).])|([\.]{2,})/", $temp['name'])) {
header("HTTP/1.1 400 Invalid file name.");
return;
}
// Verify extension
if (!in_array(strtolower(pathinfo($temp['name'], PATHINFO_EXTENSION)), array("gif", "jpg", "png"))) {
header("HTTP/1.1 400 Invalid extension.");
return;
}
// Accept upload if there was no origin, or if it is an accepted origin
$filetowrite = $imageFolder . $temp['name'];
move_uploaded_file($temp['tmp_name'], $filetowrite);
// Determine the base URL
$protocol = isset($_SERVER['HTTPS']) && $_SERVER['HTTPS'] == 'on' ? "https://" : "http://";
$baseurl = $protocol . $_SERVER["HTTP_HOST"] . rtrim(dirname($_SERVER['REQUEST_URI']), "/") . "/";
// Respond to the successful upload with JSON.
// Use a location key to specify the path to the saved image resource.
// { location : '/your/uploaded/image/file'}
echo json_encode(array('location' => $baseurl . $filetowrite));
} else {
// Notify editor that the upload failed
header("HTTP/1.1 500 Server Error");
}
?>
我的目录大致是这样的：
图片上传/
-app.py
-venv
-静态
----上传
----小小
--------tinymce.min.js
--------postAcceptor.php
-模板
----index.html
在我编写flask run，然后单击图像按钮后，上传菜单就在那里，我可以从本地目录浏览，但是当我尝试上传它时，它显示“HTTP：错误405”。我试图检查它，并在控制台菜单上发现了一个错误，上面写着“POST http://localhost:5000/static/tinymce/postAcceptor.php 405 (METHOD NOT ALLOWED)”
有人知道这是怎么发生的以及如何解决吗？非常感谢你们！
【问题讨论】：
标签： javascript html jquery css tinymce