當前位置:首頁 » 網頁前端 » web應用使用串口
擴展閱讀
webinf下怎麼引入js 2023-08-31 21:54:13
堡壘機怎麼打開web 2023-08-31 21:54:11

web應用使用串口

發布時間: 2023-03-11 06:21:27

1. 串口伺服器如何使用

設備連線:
首先將串口伺服器的串口和設備串口連接,串口伺服器的 RJ45介面和路由器(或者直接連接PC)連接,然後對串口伺服器上電。

配置串口參數:
串口伺服器可以通過Web網頁進行參數修改。通過 Web網頁修改參數時需要串口伺服器必須和計算機處於同一個子網中。串口參數包括:波特率、數據位、停止位、校驗位。


配置網路參數:
串口伺服器必須具有一個 IP,可以配置為靜態或者通過 DHCP伺服器獲得。配置串口聯網伺服器的工作模式:包括 TCP SERVER模式(是指計算機主動尋找串口聯網伺服器)、 TCP CLIENT模式(是指串口聯網伺服器主動找計算機)、 UDP模式。配置網路參數的目的 是讓計算機能夠順利地和聯網伺服器建立連接。

啟用虛擬串口:
由於一般用戶的 PC端軟體還是打開串口和設備通信的,此時由於改用了網路所以必須在計算機上虛擬一個串口,虛擬串口負責與串口伺服器建立連接,並將數據轉發給打開虛擬串口的用戶程序。運行用戶設備通信程序,並打開虛擬串口。之後用戶應用程序即可和設備通信。

飛暢科技,專業做工業交換機的廠家,歡迎前來了解、交流。

2. 如何在web頁面上獲取客戶端的串口數據

web頁面上獲取客戶端的串口數據的方法:

可以寫一個串口代理程序,讀取本地串口,將獲取到的數據存入資料庫。web通過ajax+定時器獲取資料庫中的數據顯示就好了。

如果要交互,可以搞一個讓上面提到的串口程序開一個socket.將串口通信獲取的數據,通過socket發出去,web頁面可以用websocket。

下面一個通過flash操作ardiuno的demo.用的是類似於第二種交互的方法。只不過用的是ActionScript.原理是一樣的。

串列介面是一種可以將接收來自CPU的並行數據字元轉換為連續的串列數據流發送出去,同時可將接收的串列數據流轉換為並行的數據字元供給CPU的器件。一般完成這種功能的電路,我們稱為串列介面電路。

串口通信(Serial Communications)的概念非常簡單,串口按位(bit)發送和接收位元組的通信方式。

注意事項:

戶端的系統數據如果能隨便被web頁面讀取,那大家也不敢隨便打開網頁了,至於說用IE的ActiveX 控制項,這個也沒有前途,IE默認不開啟,現在有IE的也沒什麼人,當然如果是用於特定客戶的話可以了,反正你想幹嘛就幹嘛。



3. 求做一個web頁面控制伺服器串口,可用Mscomm控制項做!滿意會繼續最佳。htm頁面都能操作本地串口。

看了你的留言直接在這回吧,其實網頁方面我也是個菜鳥。去年我做過一個類似的,當時也是自學了1個月的iis的配置,asp.net,vb串口操作等,大二假期比較閑。
做法:用DS18B20溫度感測器連接51單片機,然後單片機通過串口與電腦通信,電腦成為伺服器,手機連接網頁,進行溫度監控,開關單片機外接的繼電器等等操作。
硬體端的代碼對你沒用,伺服器端我的基本思路就是asp.net連接資料庫,然後用vb實時掃描資料庫,通過vb中的MScomm控制項連接串口,vb的代碼對你也沒啥用,因為MScomm連接單片機的代碼的「通信協議」我是寫在單片機上的,不配套就沒用了

這是網頁的代碼,不精簡,高手莫笑...
主要功能就是連接資料庫。。。裡面沒能直接通過asp.net控制串口,貌似也有C#直接控制的,你去CSDN看看吧,我試過是沒問題的,就是操作不太方便(可能我太菜了)

using System;
using System.Configuration;
using System.Data;
using System.Linq;
using System.Web;
using System.Web.Security;
using System.Web.UI;
using System.Web.UI.HtmlControls;
using System.Web.UI.WebControls;
using System.Web.UI.WebControls.WebParts;
using System.Xml.Linq;
using System.Data.SqlClient;

public partial class _Default : System.Web.UI.Page
{
protected void Page_Load(object sender, EventArgs e)
{
//溫度
SqlConnection cnn1 = new SqlConnection(@"Data Source=YINGJHSHP541\SQLEXPRESS;Initial Catalog=test3;User ID=sa;Password=yingjh");
cnn1.Open();

//表
SqlCommand cmd1 = new SqlCommand();
cmd1.Connection = cnn1;
cmd1.CommandText = "select * from T";
SqlDataReader data1;
data1 = cmd1.ExecuteReader();
GridView1.DataSource = data1;
GridView1.DataBind();
cnn1.Close();
//圖
cnn1.Open();
SqlDataAdapter Da = new SqlDataAdapter();
Da.SelectCommand = new SqlCommand("select 時間,[溫度(℃)] from T", cnn1);
DataSet ds = new DataSet();
Da.Fill(ds);
DataView myView = new DataView(ds.Tables[0]);
Chart1.Series["Series1"].Points.DataBindXY(myView, "時間", myView, "溫度(℃)");

cnn1.Close();
cnn1.Dispose();

//狀態
SqlConnection cnn2 = new SqlConnection();
cnn2.ConnectionString = @"Data Source=YINGJHSHP541\SQLEXPRESS;Initial Catalog=test3;User ID=sa;Password=yingjh";
cnn2.Open();
SqlCommand cmd2 = new SqlCommand();
cmd2.Connection = cnn2;
cmd2.CommandText = "select * from ST";
SqlDataReader data2;
data2 = cmd2.ExecuteReader();
data2.Read();
string a = data2.GetString(0);
switch (a)
{
case "1":
Label2.Text = "打開";
break;
case "0":
Label2.Text = "預設";
break;
case "-1":
Label2.Text = "關閉";
break;
default:
break;
}
Label4.Text = data2.GetString(1) + "℃";
cnn2.Close();
cnn2.Dispose();
}
protected void Button1_Click(object sender, EventArgs e)
{
SqlConnection cnn = new SqlConnection(@"Data Source=YINGJHSHP541\SQLEXPRESS;Initial Catalog=test3;User ID=sa;Password=yingjh");
SqlCommand cmd = new SqlCommand();
cnn.Open();
cmd.Connection = cnn;
//設置開關,flag為開關控制權
switch (DropDownList1.Text)
{
case "1":
cmd.CommandText = "update ST set STATE='1'" + ",flag='1'";
break;
case "0":
cmd.CommandText = "update ST set STATE='0'" + ",STEMP='" + TextBox1.Text + "',flag='1'";
break;
case "-1":
cmd.CommandText = "update ST set STATE='-1'" + ",flag='1'";
break;
default:
cmd.CommandText = "update ST set STATE='0'" + ",STEMP='" + TextBox1.Text + "',flag='1'";
break;
}
cmd.ExecuteNonQuery();
cnn.Close();
cnn.Dispose();
//溫度
SqlConnection cnn1 = new SqlConnection(@"Data Source=YINGJHSHP541\SQLEXPRESS;Initial Catalog=test3;User ID=sa;Password=yingjh");
cnn1.Open();

//表
SqlCommand cmd1 = new SqlCommand();
cmd1.Connection = cnn1;
cmd1.CommandText = "select * from T";
SqlDataReader data1;
data1 = cmd1.ExecuteReader();
GridView1.DataSource = data1;
GridView1.DataBind();
cnn1.Close();
//圖
cnn1.Open();
SqlDataAdapter Da = new SqlDataAdapter();
Da.SelectCommand = new SqlCommand("select 時間,[溫度(℃)] from T", cnn1);
DataSet ds = new DataSet();
Da.Fill(ds);
DataView myView = new DataView(ds.Tables[0]);
Chart1.Series["Series1"].Points.DataBindXY(myView, "時間", myView, "溫度(℃)");

cnn1.Close();
cnn1.Dispose();

//狀態
SqlConnection cnn2 = new SqlConnection();
cnn2.ConnectionString = @"Data Source=YINGJHSHP541\SQLEXPRESS;Initial Catalog=test3;User ID=sa;Password=yingjh";
cnn2.Open();
SqlCommand cmd2 = new SqlCommand();
cmd2.Connection = cnn2;
cmd2.CommandText = "select * from ST";
SqlDataReader data2;
data2 = cmd2.ExecuteReader();
data2.Read();
string a = data2.GetString(0);
switch (a)
{
case "1":
Label2.Text = "打開";
break;
case "0":
Label2.Text = "預設";
break;
case "-1":
Label2.Text = "關閉";
break;
default:
break;
}
Label4.Text = data2.GetString(1) + "℃";
cnn2.Close();
cnn2.Dispose();
}
protected void DropDownList1_SelectedIndexChanged(object sender, EventArgs e)
{

}
protected void GridView1_SelectedIndexChanged(object sender, EventArgs e)
{

}
}

4. web實現串口調試助手

最近受朋友之託試圖用web前端實現串口調試助手,一開始覺得不太有可行性,以前用過的串口調試助手都是客戶端程序。覺得瀏覽器怎麼會有調用電腦上的串口的功能呢。後來朋友找了幾個資料給我,說網上有人實現,他看不懂。我看了之後恍然大悟,原來是用node。如此萬能。

node 實現操作串口的模塊是一個 serialport 的模塊,網上一搜有很多好文,此處記錄一下實現過程中遇到的一些問題以及解決方法。

一開始被忽略的問題 ,我把 node 服務搭在自己的伺服器上,後來返回的串口數組全是一堆令我懵逼的數據。後來想起那是 node 讀取了我的
Linux 伺服器的串口,而不是用戶使用的 pc。

由此引出的兩個問題。第一,node 服務必須搭建在用戶使用的 pc 上,因此用戶使用的電腦必須有 node 環境。第二,用戶 pc 一般是 windows 系統, node 的模塊很多在 Linux 上很容易安裝成功,在 Windows 上安裝比較困難。

首先解決的是第二個問題:在Windows上安裝serialport失敗
解決方法: npm install --global --proction windows-build-tools
參考鏈接1: https://stackoverflow.com/questions/33142357/unable-to-install-node-js-serialport-npm-package-on-windows
參考鏈接2: https://github.com/nodejs/node-gyp#installation

安裝好之後就可以安裝 serialport 模塊了。

解決第一個問題:用戶電腦的 node 環境
解決方法: electron ——使用 JavaScript, HTML 和 CSS 構建跨平台的桌面應用 (官網鏈接: https://electronjs.org/ )(w3c: https://www.w3cschool.cn/electronmanual/wcx31ql6.html )
使用 electron 搭建的桌面應用可以像平常我們使用的 exe 應用程序一樣直接運行,不需要搭建環境。

npm install -g electron-prebuilt //提示electron-prebuilt已經更名為electron
npm install -g electron //安裝失敗
使用淘寶鏡像安裝問題解決: cnpm install -g electron
參考鏈接: http://blog.csdn.net/upc_xbt/article/details/53342129

解決方法: npm install -g electron-rebuild
以後每次重新運行 electron . 的時候再執行一次 ``./node_moles/.bin/electron-rebuild` 對原生模塊進行rebuild
參考鏈接: https://www.w3cschool.cn/electronmanual/eqsc1qko.html

參考鏈接: http://m.blog.csdn.net/u014563989/article/details/75045052
cnpm install -g electron-packager //安裝打包工具
electron-packager . 可執行文件的文件名 --win --out 打包成的文件夾名 --arch=x64位還是32位 --version版本號 --overwrite --ignore=node_moles

因為打包的時候執行的命令帶有 --ignore=node_moles , 即不將 node_moles 裡面的依賴包打包,所以在打包後的新文件中,進入resource 目錄會發現 node_moles 是一個空文件夾,所以自然找不到依賴包。如果去掉打包時的命令參數 --ignore=node_moles ,則需要非常長的打包時間。我的解決方法是將原來 node_moles 文件夾中的相關的依賴包文件復制進打包後的 node_moles 中,雖然是一個比較無腦的方法,每次打包都要拖動相關文件進去,不過我備份了一個 node_moles 文件夾,下一次打包後就把備份的 node_moles 直接復制進去。

node 模塊 ccap : 用於生成驗證碼圖片,可以在 express 後台
res.send(圖片) ,前端的 img 的 src設置為請求這個介面。
ccap的用法可以參考鏈接: https://cnodejs.org/topic/50f90d8edf9e9fcc58a5ee0b

5. WEB瀏覽器直接讀取串口數據

好像 不行吧

但是 串口設備能通過轉換為 TCP/IP 連入 乙太網

6. asp.net開發的web程序,怎麼操作和控制客戶端的串口。

關於 串口 有本 基礎 的 書

Visual_Basic與_RS-232_串列通信控制

網路上有電子文檔的

7. 在c#的web中怎樣實現與串口通訊

使用使用serialport這個類,
可以在DataReceived事件中作處理。
也可以直接使用Read、和Write函數對串口進行操作。