如何使用javascript和node.js-mysql而不使用php將HTML表單數據提交到MySql數據庫表中？

Question

我試圖制作一個博客，觀眾（客人）可以向博主發送消息。 准備好 HTML 表單，在 HTML 表單的提交按鈕的 onclick() 函數中，執行名為 submitData() 的 javascript（名為 Db_connect.js）函數。 在 submitData() 中，同一個 javascript 調用了另外兩個函數 - 一個用於與 mysql 建立連接，另一個用於執行 mysql 查詢以在數據庫中插入數據以存儲表單數據。 另一個名為 openWin() 的函數只不過是顯示插入到單獨的新小窗口中的內容。

這是我用來連接到數據庫的 javascript 代碼：

var con, sql;
function randomNumber(min, max) {  
    return Math.floor(Math.random()* (max - min) + min); 
}  

function submitData(objButton) {
    name = document.getElementById('name1').value; 
    email = document.getElementById('email1').value; 
    msg = document.getElementById('msg1').value; 
    i= randomNumber(1000000000000000,9999999999999999);
    document.getElementById('test').innerHTML=name;
    sql="INSERT INTO my_table(id, name, email, msg) VALUES(" + i + ", '" + name + "', '" + email + "', '" + msg +  "')";
    createConnection();
    insertData(sql);
    openWin();
}

var mysql = require('mysql');
function createConnection() {
      con = mysql.createConnection({
      host: "localhost",
      user: "username",
      password: "password",
      database: "mydb"
    });
}

function insertData(sql_insert) {
    con.connect(function(err) {
      if (err) throw err;
       con.query(sql_insert, function (err) {
        if (err) throw err;
        });
    });
}

function openWin(){
      var myBars = 'directories=no,location=no,menubar=no,status=no';
      myBars += ',titlebar=no,toolbar=no';
      var myOptions = 'scrollbars=no,width=400,height=200,resizeable=no';
      var myFeatures = myBars + ',' + myOptions;
      var newWin = open('', 'myWin', myFeatures);
      newWin.document.writeln('<form>');
      newWin.document.writeln('<table>');
      newWin.document.writeln('<tr><td>Your Message Sent...');
      newWin.document.writeln('</td></tr>');
      newWin.document.writeln('<tr valign=TOP><td>');
      newWin.document.writeln('<textarea cols=45 rows=7 wrap=SOFT>');
      newWin.document.writeln('Your Name : '+name);
      newWin.document.writeln('Your Email : '+email);
      newWin.document.writeln('Your Message : '+msg);
      newWin.document.writeln('Data Inserted!!!</textarea>');
      newWin.document.writeln('</td></tr>');
      newWin.document.writeln('<tr><td>');
      newWin.document.writeln('<input type=BUTTON value="Close"');
      newWin.document.writeln(' onClick="window.close()">');
      newWin.document.writeln('</td></tr>');
      newWin.document.writeln('</table></form>');
      newWin.document.close();
      newWin.focus();
}

這是我正在使用的 HTML 代碼：

<head>
        <script src="Db_Connect.js" type="text/javascript"></script>
   </head>
<body>

        <script type="text/javascript"></script>
        <div id="frm">
            <form>
                <label id="name"> <b>Your Name &nbsp;&nbsp;&nbsp;&nbsp;&nbsp;: </b></label><input id="name1" type="text" name="user_name" placeholder="Your Name." required><label style="color:red; font-size:18px;"><b>&nbsp;*</b></label><br><br>  <!--placeholder="Your Name."-->
                <label id="email"><b>Your E-mail &nbsp;&nbsp;&nbsp;&nbsp;: </b></label><input id="email1" type="email" name="user_email" placeholder="Your Email ID." required><label style="color:red; font-size:18px;"><b>&nbsp;*</b></label><br><br>  <!--placeholder="Your Email ID."-->
                <label id="msg">  <b>Your Message : </b></label><textarea id="msg1" name="user_msg" maxlength="200" placeholder="Maximum 200 letters." required></textarea><label style="color:red; font-size:18px;"><b>&nbsp;*</b></label><br>             <!--<span id="send"><a id="link" href="http://www.google.co.in" target="_blank"><b>Send</b></a></span>-->
                <label style="color:red;font-size:10px;"><b>* Required fields</b></label><br>
                <input type="submit" id="link" value="Send" onclick="submitData(this)">    <!--onclick="submitData(this)"-->
            </form>
        </div>
</body>

沒有來自 HTML 的數據輸入的相同 javascript 在控制台中工作正常。 但是，通過傳遞給它的 HTML 表單數據，它根本不起作用。 請注意，我沒有使用 php，也不想使用它。 請幫助我擺脫這個問題，並在不使用 php 的情況下為我提供一些解決方案。

Answer 1

您必須使用node.js和express.js創建 Web 服務器，然后從 HTML FORM POST 獲取數據。 按照鏈接和代碼示例。

https://www.tutorialsteacher.com/nodejs/expressjs-web-application

處理 POST 請求

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <meta charset="utf-8" />
    <title></title>
</head>
<body>
    <form action="/submit-student-data" method="post">
        First Name: <input name="firstName" type="text" /> <br />
        Last Name: <input name="lastName" type="text" /> <br />
        <input type="submit" />
    </form>
</body>
</html>

var express = require('express');
var app = express();

var bodyParser = require("body-parser");
app.use(bodyParser.urlencoded({ extended: false }));

app.get('/', function (req, res) {
    res.sendFile('index.html');
});

app.post('/submit-student-data', function (req, res) {
    var name = req.body.firstName + ' ' + req.body.lastName;
    
    res.send(name + ' Submitted Successfully!');
});

var server = app.listen(5000, function () {
    console.log('Node server is running..');
});

如何使用javascript和node.js-mysql而不使用php將HTML表單數據提交到MySql數據庫表中？

問題描述

1 個解決方案

解決方案1
1 2020-10-17 19:33:47

如何使用javascript和node.js-mysql而不使用php將HTML表單數據提交到MySql數據庫表中？

問題描述

1 個解決方案

解決方案1 1 2020-10-17 19:33:47

解決方案1
1 2020-10-17 19:33:47