,可以通过以下步骤实现:
CREATE TABLE tinymce_data (
id INT AUTO_INCREMENT PRIMARY KEY,
content TEXT
);
上述SQL语句创建了一个名为tinymce_data
的表,包含两个字段:id
和content
。id
字段是自增的主键,content
字段用于存储TinyMCE表单数据。
const express = require('express');
const mysql = require('mysql');
const app = express();
// 创建MySQL数据库连接
const connection = mysql.createConnection({
host: 'localhost',
user: 'username',
password: 'password',
database: 'database_name'
});
// 处理POST请求,将表单数据存储到数据库
app.post('/save', (req, res) => {
const content = req.body.content;
// 执行数据库插入操作
const query = 'INSERT INTO tinymce_data (content) VALUES (?)';
connection.query(query, [content], (error, results) => {
if (error) {
console.error(error);
res.status(500).send('Error saving data');
} else {
res.send('Data saved successfully');
}
});
});
// 处理GET请求,从数据库中获取表单数据并返回
app.get('/data', (req, res) => {
// 执行数据库查询操作
const query = 'SELECT content FROM tinymce_data ORDER BY id DESC LIMIT 1';
connection.query(query, (error, results) => {
if (error) {
console.error(error);
res.status(500).send('Error retrieving data');
} else {
if (results.length > 0) {
const content = results[0].content;
res.send(content);
} else {
res.send('No data found');
}
}
});
});
// 启动服务器
app.listen(3000, () => {
console.log('Server is running on port 3000');
});
上述代码创建了一个基于Express框架的Node.js服务器,监听在端口3000上。其中,/save
路由用于将表单数据存储到数据库,/data
路由用于从数据库中获取表单数据并返回。
<!DOCTYPE html>
<html>
<head>
<title>TinyMCE Form</title>
<script src="https://cdn.tiny.cloud/1/apikey/tinymce/5/tinymce.min.js" referrerpolicy="origin"></script>
<script>
document.addEventListener("DOMContentLoaded", function() {
tinymce.init({
selector: '#myTextarea'
});
});
function saveData() {
const content = tinymce.get('myTextarea').getContent();
// 发送POST请求将表单数据存储到后端
fetch('/save', {
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body: JSON.stringify({ content: content })
})
.then(response => response.text())
.then(data => {
console.log(data);
})
.catch(error => {
console.error(error);
});
}
function loadData() {
// 发送GET请求从后端获取表单数据
fetch('/data')
.then(response => response.text())
.then(data => {
tinymce.get('myTextarea').setContent(data);
})
.catch(error => {
console.error(error);
});
}
</script>
</head>
<body>
<textarea id="myTextarea"></textarea>
<br>
<button onclick="saveData()">Save</button>
<button onclick="loadData()">Load</button>
</body>
</html>
上述代码创建了一个包含一个TinyMCE编辑器和两个按钮的HTML页面。其中,saveData()
函数用于将表单数据发送到后端进行存储,loadData()
函数用于从后端获取表单数据并在TinyMCE编辑器中显示。
通过以上步骤,可以实现在MySQL数据库中存储TinyMCE表单数据并按原样返回。请注意,以上代码仅为示例,实际应用中可能需要根据具体需求进行适当的修改和优化。
领取专属 10元无门槛券
手把手带您无忧上云