我正在创建一个 Web 应用程序,我很好奇如何将数据发送到其中的 MySQL 数据库。我有一个在用户按下按钮时调用的函数,我希望这个函数以某种方式将数据发送到 MySQL 服务器。有谁知道如何解决这个问题?我尝试了 npm MySQL module,但似乎连接不起作用,因为它是客户端。有没有其他方法可以做到?我需要一个想法来让我开始。
问候
我正在创建一个 Web 应用程序,我很好奇如何将数据发送到其中的 MySQL 数据库。我有一个在用户按下按钮时调用的函数,我希望这个函数以某种方式将数据发送到 MySQL 服务器。有谁知道如何解决这个问题?我尝试了 npm MySQL module,但似乎连接不起作用,因为它是客户端。有没有其他方法可以做到?我需要一个想法来让我开始。
问候
您将需要一个服务器来处理来自您的 React 应用程序的请求并相应地更新数据库。一种方法是使用 NodeJS、Express 和node-mysql作为服务器:
var mysql = require('mysql');
var express = require('express');
var app = express();
// Set up connection to database.
var connection = mysql.createConnection({
host: 'localhost',
user: 'me',
password: 'secret',
database: 'my_db',
});
// Connect to database.
// connection.connect();
// Listen to POST requests to /users.
app.post('/users', function(req, res) {
// Get sent data.
var user = req.body;
// Do a MySQL query.
var query = connection.query('INSERT INTO users SET ?', user, function(err, result) {
// Neat!
});
res.end('Success');
});
app.listen(3000, function() {
console.log('Example app listening on port 3000!');
});
然后你可以fetch
在 React 组件中使用向服务器发出 POST 请求,有点像这样:
class Example extends React.Component {
constructor() {
super();
this.state = { user: {} };
this.onSubmit = this.handleSubmit.bind(this);
}
handleSubmit(e) {
e.preventDefault();
var self = this;
// On submit of the form, send a POST request with the data to the server.
fetch('/users', {
method: 'POST',
data: {
name: self.refs.name,
job: self.refs.job
}
})
.then(function(response) {
return response.json()
}).then(function(body) {
console.log(body);
});
}
render() {
return (
<form onSubmit={this.onSubmit}>
<input type="text" placeholder="Name" ref="name"/>
<input type="text" placeholder="Job" ref="job"/>
<input type="submit" />
</form>
);
}
}
请记住,这只是实现这一目标的无限方式之一。
这取决于您的应用程序的组织方式,我猜您有一个提供 React 应用程序代码的服务器。我建议您使用基于您的偏好的module将必要的信息发送到您的服务器(如果有的话):
fetch
内置 XHR api ( https://developer.mozilla.org/en/docs/Web/API/Fetch_API )request
基于回调的 npm module ( https://www.npmjs.com/package/request )axios
基于 promise 的 npm module(https://www.npmjs.com/package/axios)如果您正在寻找一个module/插件来完成从客户端到数据库的所有工作,我不知道任何并且不确定是否存在,因为通常建议使用代理(服务器进行重定向,但也用于格式化或阻止请求之间的请求)您的客户和数据库)。
然后,在您的服务器中格式化必要的信息(如果有)以供您的 MySQL 数据库使用,然后使用您选择的module联系您的 MySQL 数据库,第一个最受欢迎的module似乎是: https://www。 npmjs.com/package/mysql,但如果您知道另一个或有其他偏好。(例如使用 MongoDB,我们可以使用 Mongoose 使请求更容易)