python读取传感器实时数据_使用python在web页面上显示实时传感器数据的可能方法...

我正在尝试制作一个网络应用程序,它从传感器获取温度和(电机)转速,通过我的电脑串行连接到一台机械机器,并显示在网页上。在

我在使用Python Flask和AJAX。到目前为止,我尝试的是从后端获取jsonify数据并显示在html页面上。但我没有得到或看到任何实时数据在网页上的变化,没有重新加载网页。我每次都需要重新加载页面才能看到数据的变化。在

我怎样才能让这些数据显示在网页上。在

这是我为flask app编写的python脚本:from flask import Flask, render_template, request, jsonify

import random

import time

import serial

app = Flask(__name__)

@app.route('/')

def hello_world():

return render_template("index.html")

@app.route('/ret_num', methods = ['POST', 'GET'])

def ret_num():

s = serial.Serial('COM7')

res = s.read()

time.sleep(1)

return jsonify(res)

if __name__ == '__main__':

app.run(debug = True)

和HTML代码:

^{pr2}$

  • 1
    点赞
  • 5
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要实现将文件上传到数据库并返回到网页显示,你需要使用前端(HTML、CSS、JavaScript)和后端(服务器端语言如PHP、Node.js)来完成这个过程。下面是一个简单的示例,以供参考: 1. 前端HTML代码(index.html): ```html <!DOCTYPE html> <html> <head> <title>文件上传</title> </head> <body> <h1>选择文件上传</h1> <input type="file" id="fileInput"> <button onclick="uploadFile()">上传</button> <div id="fileList"></div> <script src="script.js"></script> </body> </html> ``` 2. 前端JavaScript代码(script.js): ```javascript function uploadFile() { var fileInput = document.getElementById('fileInput'); var file = fileInput.files[0]; var formData = new FormData(); formData.append('file', file); // 使用AJAX将文件发送到后端 var xhr = new XMLHttpRequest(); xhr.open('POST', 'upload.php', true); xhr.onload = function() { if (xhr.status === 200) { // 上传成功,处理返回的数据 var response = JSON.parse(xhr.responseText); if (response.success) { // 显示文件列表 displayFiles(response.files); } else { alert('文件上传失败!'); } } else { alert('发生错误:' + xhr.status); } }; xhr.send(formData); } function displayFiles(files) { var fileListDiv = document.getElementById('fileList'); fileListDiv.innerHTML = ''; for (var i = 0; i < files.length; i++) { var file = files[i]; var fileLink = document.createElement('a'); fileLink.href = file.url; fileLink.textContent = file.name; fileListDiv.appendChild(fileLink); fileListDiv.appendChild(document.createElement('br')); } } ``` 3. 后端代码(upload.php): ```php <?php // 连接数据库 $servername = "localhost"; $username = "your_username"; $password = "your_password"; $dbname = "your_database"; $conn = new mysqli($servername, $username, $password, $dbname); if ($conn->connect_error) { die("数据库连接失败: " . $conn->connect_error); } // 处理上传的文件 $targetDir = "uploads/"; // 上传文件保存的目录 $fileName = basename($_FILES["file"]["name"]); $targetFilePath = $targetDir . $fileName; $fileType = pathinfo($targetFilePath, PATHINFO_EXTENSION); // 将文件移动到目标目录 if (move_uploaded_file($_FILES["file"]["tmp_name"], $targetFilePath)) { // 文件上传成功,将文件信息保存到数据库 $sql = "INSERT INTO files (name, url) VALUES ('$fileName', '$targetFilePath')"; if ($conn->query($sql) === TRUE) { // 获取所有文件列表 $result = $conn->query("SELECT * FROM files"); $files = array(); if ($result->num_rows > 0) { while ($row = $result->fetch_assoc()) { $files[] = array( 'name' => $row['name'], 'url' => $row['url'] ); } } // 返回文件列表给前端 echo json_encode(array( 'success' => true, 'files' => $files )); } else { echo json_encode(array('success' => false)); } } else { echo json_encode(array('success' => false)); } $conn->close(); ?> ``` 请确保你已经创建了一个名为`uploads`的文件夹来保存上传的文件,并在数据库中创建了一个名为`files`的数据表,其中包含`name`和`url`两个字段。此外,你还需要将`your_username`、`your_password`和`your_database`替换为你自己的数据库连接信息。 运行上述代码后,用户选择文件后点击上传按钮,前端JavaScript代码将文件通过AJAX发送到后端的upload.php文件。后端将文件保存到服务器上的uploads文件夹,并将文件信息存储到数据库中。然后,后端返回文件列表给前端,并在网页显示这些文件的链接。 这只是一个简单的示例,实际应用中可能需要更多的验证和安全措施来保护上传的文件和数据库。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值