JavaScriptとNode.jsを初めて使用するAJAXコールとシリアルポートメッセージの後にデータをWebページに戻します。
Node.jsを実行しているラズベリーパイがあります。ラズベリーパイは、ラズベリーパイに差し込まれたUSBを使って、USBからUART接続を介していくつかの組み込み機器に接続されています。私はこの基本レベルでデータを送受信することができます。 piはルータに接続されており、IPとブラウザを介してアクセスします。
タイトル、テキスト、およびボタンを持つ簡単なWebページをホストしたいと思います。私がボタンをクリックすると、クライアントマシンがnode.jsサーバーに接続して、組み込みデバイスへのシリアルポート経由でpiがメッセージを送信するようにします（私は使用する必要があります）。私は、返信されるデータを待つ/しない（提案によります）とし、そのデータを使ってウェブページのテキストを再作成したいと思います。
私が持っているものはこれに近いですが、完全ではありません。
私はpiからnode.jsで 'server'を実行します。 expressとstaticページを使用します。静的ページには、ボタンがクリックされたときにAJAXリクエストを実行するクライアント側JavaScriptファイルがあります。 node.js側では、AJAXリクエストを見ることができます。私は構築し、serialportを使用してシリアルポート経由で組み込みデバイスにメッセージを送信します。この時点で、Node.js側では、文字列/ etcを返すことができます。ウェブページで表示することはできますが、何らかの理由で待っているか他の方法でデータを受信して表示するためにウェブページに送信するかはわかりません。
クライアントの.html：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Request Sensor Data</title>
<style type="text/css" media="screen"></style>
</head>
<body>
<p>Sensor Data</p>
<p><TEXTAREA id="myTxtArea" NAME="sensorDataTxtBox" ROWS=3 COLS=30 ></TEXTAREA></br>
<button type="button" name="sensorButton" id="mySensorButton" onClick="getSensorData()" >Get Sensor Data</button></p>
<script src="clientCode.js"></script>
</body>
</html>
クライアントの.js：
function getSensorData()
{
console.log('getSensorData() button pushed.');
var xhr = new XMLHttpRequest();
xhr.open('GET', 'sensorGET');
xhr.send(null);
xhr.onreadystatechange = function() {
var DONE = 4; // readyState 4 means the request is done.
var OK = 200; // status 200 is a successful return.
if (xhr.readyState === DONE)
{
if (xhr.status === OK)
{
//insert DOM grabs to set text in html textbox.
console.log(xhr.responseText); // 'This is the returned text.'
var textAreaDOM = document.getElementById('myTxtArea');
textAreaDOM.value = textAreaDOM.value + 'inserted sensor data here\n';
}
else
{
console.log('Error: ' + xhr.status); // An error occurred during the request.
}
}
};
}
のNode.jsの.js：
var express = require('express'),
app = express();
app.use('/', express.static(__dirname + '/'));
app.get('/sensorGET', function (req, res) {
var sensorData = getSensorData();
res.send('sensorData');
})
var serialport = require('serialport'),
portname = '/dev/ttyUSB0';
var myPort = new serialport(portname, {
baudRate: 115200,
dataBits: 8,
parity: 'none',
stopBits: 1,
flowControl: false,
parser: serialport.parsers.byteLength(1)
});
myPort.on('open', showPortOpen);
myPort.on('data', recSerialData);
myPort.on('close', showPortClosed);
myPort.on('error', showError);
myPort.on('disconnect', showDisconnect);
function showDisconnect() {
console.log('Someone disconnected');
}
function showPortOpen()
{
console.log('port open. Data rate: ' + myPort.options.baudRate);
}
function recSerialData(data)
{
parseMessage(data);//This function is not shown but parses a message that is sent on the wire
}
function showPortClosed()
{
console.log('port closed.');
}
function showError(error)
{
console.log('Serial port error: ' + error);
}
function getSensorData()
{
myPort.write(Assume correct message is sent here);
//Can return some set text here and it will be written to the webpage.
//example: return "Temp data was asked for...";
//is there a way to wait here for the next message that comes in?
}