React Node.js MySQL Uncaught ReferenceError：进程未定义
<p>我正在尝试在我的网站中实现搜索页面。用户应该能够输入关键字，并且网站应该从数据库返回产品表中包含该关键字的行。</p>
<p>当我尝试建立与数据库的连接时收到此错误</p>
<pre class="brush:php;toolbar:false;">_stream_writable.js:57 Uncaught ReferenceError: process is not defined
at ./node_modules/mysql/node_modules/readable-stream/lib/_stream_writable.js (_stream_writable.js:57:1)
at options.factory (react refresh:6:1)
at __webpack_require__ (bootstrap:24:1)
at fn (hot module replacement:62:1)
at ./node_modules/mysql/node_modules/readable-stream/readable-browser.js (readable-browser.js:4:1)
at options.factory (react refresh:6:1)
at __webpack_require__ (bootstrap:24:1)
at fn (hot module replacement:62:1)
at ./node_modules/mysql/lib/protocol/sequences/Query.js (Query.js:7:1)
at options.factory (react refresh:6:1)</pre>
<p>这是 Search.jsx 文件。我创造</p>
<pre class="lang-js prettyprint-override"><code>import {Component} from "react";
import ItemDisplay from "./itemDisplay";
import item from "./item";
import { test } from "./DB_functions";
class Search extends Component{
constructor() {
super();
this.state = {
items: []
}
this.handleChange = this.handleChange.bind(this);
this.handleSubmit = this.handleSubmit.bind(this);
}
handleChange(event) {
this.setState({value: event.target.value});
}
handleSubmit(event) {
console.log(this.state.value);
alert('A name was submitted: ' + this.state.value);// instead of this we send this.state.val to back
var input = this.state.value.toLowerCase()
//search in aws products
var mysql = require('mysql');
alert("SQL required");
var sql = "SELECT * FROM products WHERE productName = ?"
var con = mysql.createConnection({
host: "[Removed]",
user: "[Removed]",
password: "[Removed]",
port: '3306',
database: "hs_db"
});
alert("Connection made");
con.query(sql, input, function(err, result)
{
alert("Query Sent");
if (err)
throw err;
else
var usersRows = JSON.parse(JSON.stringify(result));
for (let i = 0; i<usersRows.length; i++){
if(usersRows[i]['name'].includes(input));{
console.log(usersRows[i]['name'])
this.state.items.push(usersRows[i]['name']);
}
}
console.log(usersRows);
})
con.end();
var items = this.state.items
// // this was demo search
// const items = [];
// for (let i = 0; i<this.state.orgitems.length; i++){
// if (this.state.orgitems[i].name.toLowerCase().includes(this.state.value.toLowerCase())){
// console.log(this.state.orgitems[i].name)
// items.push(this.state.orgitems[i]);
// }
// }
this.setState({items});
// end demo
event.preventDefault(); // recieve data, and then pass in data
}
render() {
return(
<div class='m-2'>
<div className="input-group">
<input type="search" className="form-control rounded" placeholder="Search" aria-label="Search"
aria-describedby="search-addon" onChange={this.handleChange}/>
<button onClick={this.handleSubmit} type="button" className="btn btn-outline-dark">search</button>
</div>
<ItemDisplay items={this.state.items}></ItemDisplay>
</div>
);
}
}
export default Search;
</code></pre>
<p>我知道当我尝试在这一行创建与数据库的连接时会引发错误</p>
<pre class="lang-js prettyprint-override"><code>var con = mysql.createConnection({
host: "[Removed]",
user: "[Removed]",
password: "[Removed]",
port: '3306',
database: "hs_db"
});
</code></pre>
<p>但我知道该信息是正确的。我能够在不同的客户端上毫无问题地访问数据库。该错误也非常模糊，因此很难调试</p>
1
974
![ThinkPHP5快速开发企业站点[全程实录]](https://img.php.cn/upload/course/000/000/068/6253d918a3ce7278.png)
收藏
永远不要让用户在前端访问您的数据库。为了完成您想做的事情，您需要创建一个后端服务器并使用 HTTP 请求与其通信。
您将找到有关如何执行此操作的教程 此处。