我有一个带有单个按钮的简单 HTML。 JavaScript(客户端脚本)捕获每次点击的时间。我陷入了如何传递
click
的事件/时间发生并使用 Node.js 显示以稍后将其传输到 Snowflake 数据库中的问题。
从我的评论来看,解决方法似乎是
JSDOM
,但目前它给我带来了一个错误。
以下是我回顾过的主题:
https://stackoverflow.com/questions/13840429/what-is-the-difference-between-client-side-and-server-side-programming
https://stackoverflow.com/questions/38748996/using-document-object-in-nodejs
[更新 - 2020 年 11 月]
查看下面的内容后,我想出了将项目分成 3 个文件的新代码。仍然需要帮助将数据插入 Snowflake,不知道如何将单击事件绑定到 sql 文本。总体目标是将点击事件的日期时间插入 Snowflake 的表中:
https://gist.github.com/aerrity/fd393e5511106420fba0c9602cc05d35
正在进行中的代码:
服务器.js
console.log('Server-side code running');
const express = require('express');
const app = express();
// serve files from the public directory
app.use(express.static('public'));
//connect to snowflake and load data
var snowflake = require('snowflake-sdk');
var connection = snowflake.createConnection( {
account: 'xxxx',
username: 'xxxx',
password: 'xxxx'
}
);
//confirm connection is working
connection.connect(
function(err, conn) {
if (err) {
console.error('Unable to connect: ' + err.message);
}
else {
console.log('Successfully connected to Snowflake.');
// Optional: store the connection ID.
connection_ID = conn.getId();
}
}
);
// start the express web server listening on 8080
app.listen(8080, () => {
console.log('listening on 8080');
});
// serve the homepage
app.get('/', (req, res) => {
res.sendFile(__dirname + '/countClicks.html');
});
// insert data into snowflake isues, how to bind click event?
connection.execute({
sqlText: 'INSERT INTO DEMO_DB.PUBLIC.INPUT_NODEJS(CLICK_DATETIME)',
binds: [/clicked]
});
countClicks.js
const button = document.getElementById('clicks');
button.addEventListener('click', function(e) {
console.log('button was clicked');
fetch('/clicked', {method: 'POST'})
.then(function(response) {
if(response.ok) {
console.log('Click was recorded');
return;
}
throw new Error('Request failed.');
})
.catch(function(error) {
console.log(error);
});
});
countClicks.html
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Node + Express + Snowflake example</title>
</head>
<body>
<h1>Node + Express + Snowflake example</h1>
<p id="counter">Loading button click data.</p>
<button id="myButton">Click me!</button>
</body>
<script src="countClicks.js"></script>
</html>
首先需要在server.js中创建一个post路由,并在回调函数中执行sql查询。 另外,您应该在 connection.execute 方法中提供一个函数(完整),该函数将在查询执行后执行
app.post("/fetch", async (req, res, next) => {
try {
const { clickDateTime } = req.body;
const data = await connection.execute({
sqlText: 'INSERT INTO DEMO_DB.PUBLIC.INPUT_NODEJS (DATE_TIME) VALUES (?)',
binds: [clickDateTime]
});
console.log(data); // If inserted successfully, it should print something like { "number of rows inserted": 1 }
res.json({
ok: true,
message: 'Data inserted successfully',
data: data
});
} catch (error) {
console.error('Error executing query:', error);
res.status(500).json({
ok: false,
message: 'Error inserting data',
error: error.message
});
next(error);
}
});
在您的 countClicks.js 文件中,您需要在请求正文中传递当前日期时间,在事件监听器中像这样
const button = document.getElementById('clicks');
button.addEventListener('click', function(e) {
console.log('button was clicked');
const currentDateTimeUTC = new Date().toUTCString() // Assuming you want to add date time in UTC
fetch('/clicked', {method: 'POST', clickDateTime: currentDateTimeUTC}) // add clickDateTime in the request body
.then(function(response) {
if(response.ok) {
console.log('Click was recorded');
return;
}
throw new Error('Request failed.');
})
.catch(function(error) {
console.log(error);
});
});