js串口调试

一.常用API介绍

  1. requestPort----获取授权串口
  2. open-----打开串口
  3. close—关闭串口(串口关闭前,需要释放锁住的流)
  4. cancel—立即退出读取的循环,然后去调用releaseLock,最后调用close方法
  5. releaseLock—Reader和.Writer的释放方法
  6. read—port.readable.getReader()的读取字节数组方法
  7. write—port.writable.getWriter()的写入方法

二.代码示例

<button onclick="sendMsg()">发送</button>
<button onclick="serial()">启动串口调试</button>
<script type="text/javascript">
	let writer = null, getData = [],timeOut;
    async function sendMsg() {  
        //信息 49, 50, 51, 13---123  116,101, 115, 116, 13---test
        const data = new Uint8Array(toUint8Arr('test1234'))
        await writer.write(data);
    }
    async function serial() {
        // 浏览器支持serial
        console.log(navigator);
        if ('serial' in navigator) {
            console.log('当前浏览器支持serial')
            // 提示用户选择一个串口
            const port = await navigator.serial.requestPort();
            // 获取用户之前授予网站访问权限的所有串口.
            // const ports = await navigator.serial.getPorts();
            //打开串口
            //baudRate:波特率
            //dataBits:数据位(7 或 8)
			//stopBits:停止位(1 或 2)
			//parity:校验位"none"、"偶even"、"奇odd"
			//bufferSize:读写缓冲区大小(必须小于 16MB)
			//flowControl:流量控制模式。"none"、"hardware"
            await port.open({ baudRate: 115200})
            const reader = port.readable.getReader();
            writer = port.writable.getWriter();
            try {
                while (true) {
                    const { value, done } = await reader.read();
                    if (done) {
                        reader.releaseLock();
                        break;
                    }
                    let arr=Array.from(value);
                     getData.push(...arr);
                     if(timeOut)clearTimeout(timeOut);  //不知道为什么返回数据会分批,所以做了防抖
	                    timeOut=setTimeout(()=>{
	                      console.log(Uint8ArrayToString(new Uint8Array(getData)));
	                       getData=[];
	                       timeOut=null;
	                    },200)
                	}
            } catch (error) {
                console.error(error)
            } finally {
                reader.releaseLock();
                console.log('允许稍后关闭串口。');
                await port.close();
            }
        }else{
            console.log('不支持');
        }
    }
    //string转uint8array
    function toUint8Arr(str) {
        const buffer = [];
        for (let i of str) {
            const _code = i.charCodeAt(0);
            if (_code < 0x80) {
                buffer.push(_code);
            } else if (_code < 0x800) {
                buffer.push(0xc0 + (_code >> 6));
                buffer.push(0x80 + (_code & 0x3f));
            } else if (_code < 0x10000) {
                buffer.push(0xe0 + (_code >> 12));
                buffer.push(0x80 + (_code >> 6 & 0x3f));
                buffer.push(0x80 + (_code & 0x3f));
            }
        }
        return Uint8Array.from(buffer);
    }
    //uint8array转String
    function Uint8ArrayToString(serialData) {
        var out, i, len, c;
        var char2, char3;
        out = "";
        len = serialData.length;
        i = 0;
        while (i < len) {
            c = serialData[i++];
            switch (c >> 4) {
                case 0: case 1: case 2: case 3: case 4: case 5: case 6: case 7:
                    // 0xxxxxxx
                    out += String.fromCharCode(c);
                    break;
                case 12: case 13:
                    // 110x xxxx   10xx xxxx
                    char2 = serialData[i++];
                    out += String.fromCharCode(((c & 0x1F) << 6) | (char2 & 0x3F));
                    break;
                case 14:
                    // 1110 xxxx  10xx xxxx  10xx xxxx
                    char2 = serialData[i++];
                    char3 = serialData[i++];
                    out += String.fromCharCode(((c & 0x0F) << 12) |
                        ((char2 & 0x3F) << 6) |
                        ((char3 & 0x3F) << 0));
                    break;
            }
        }
        return out;
    }
</script >

三.示例截图

1.启动串口调试
在这里插入图片描述
2.使用串口工具调试发送和接收
在这里插入图片描述
注:

  • 此功能仅支持chromium内核89版本以上的浏览器;
  • 域名或IP访问时需要HTTPS,localhost没有限制。

参考:
https://developer.mozilla.org/en-US/docs/Web/API/Web_Serial_API

  • 3
    点赞
  • 26
    收藏
    觉得还不错? 一键收藏
  • 15
    评论
### 回答1: 串口调试是指通过串口与设备进行数据交互和通信的过程中进行调试操作。而Javascript脚本主要是一种用于网页开发的脚本语言,用于实现网页动态交互和行为控制。所以如果需要进行串口调试Javascript脚本,可以考虑以下几个方面: 1. 串口通信库:首先需要在Javascript脚本中使用合适的串口通信库,以便能够与设备建立串口通信。可以选择第三方的串口通信库,或是使用浏览器提供的Web Serial API。 2. 打开串口:在脚本中需要调用相应的函数或方法来打开串口,并进行相应的串口设置,例如波特率、数据位、校验位等。这样就可以建立与设备的串口连接。 3. 数据读写:通过调用相应的串口读写函数或方法,可以向设备发送数据或从设备接收数据。可以根据设备的通信协议进行相应的数据处理和解析。 4. 调试输出:在脚本中可以添加调试输出的代码,以便进行调试和错误追踪。可以使用console.log()函数输出调试信息到浏览器的控制台。 5. 错误处理:在脚本中需要针对可能出现的错误情况进行相应的处理,例如串口连接失败、数据读取异常等。可以使用try-catch语句来捕捉和处理异常情况。 总之,通过合适的串口通信库和相应的串口读写函数,结合调试输出和错误处理,可以在Javascript脚本中进行串口调试操作,以实现与设备的数据交互和通信。 ### 回答2: 串口调试是指通过串口与外部设备进行通信,并进行调试工作。在使用javascript脚本进行串口调试时,以下是一些常见的方法和步骤: 1. 打开串口:使用javascript串口库或插件,可以通过指定串口号、波特率和其他参数来打开串口。例如,使用SerialPort库的open函数来打开串口。 2. 设置串口参数:在打开串口之后,需要设置串口的相关参数,例如数据位、停止位和校验位等。可以通过调用库提供的函数来设置这些参数。 3. 发送数据:要向外部设备发送数据,可以通过写入串口的方式实现。使用javascript串口库提供的函数,将要发送的数据写入串口。 4. 接收数据:外部设备将数据发送回来后,需要通过读取串口的方式来接收数据。可以使用串口库提供的函数,读取串口中的数据。 5. 数据处理:当接收到数据后,可以通过javascript脚本对接收到的数据进行处理和解析。例如,可以将数据显示在网页上或进行其他操作。 6. 关闭串口串口调试结束后,需要关闭串口。可以使用库提供的函数,关闭已打开的串口。 需要注意的是,进行串口调试时,需要保证使用的串口与外部设备的参数一致,例如波特率、数据位等。此外,还需要了解外部设备的通信协议和数据格式,以便正确解析和处理接收到的数据。 总之,通过以上步骤,可以使用javascript脚本进行串口调试,实现与外部设备的通信和数据处理。 ### 回答3: 串口调试是一种用于检测和调试串口通信的方法,可以帮助我们确定串口通信是否正常。在使用JavaScript脚本进行串口调试时,我们可以通过以下步骤进行操作。 首先,我们需要通过编写JavaScript代码来打开串口。可以使用`serial.open()`函数来打开串口,传入参数包括串口的设备名称、波特率和其他相关参数。例如,`serial.open('COM1', 9600)`表示打开COM1串口并将波特率设置为9600。 接下来,我们可以使用`serial.send()`函数发送数据串口。该函数可以将字符串或字节数组作为参数,并将数据发送到串口上。例如,`serial.send('Hello')`将发送字符串"Hello"到串口。 在发送数据后,我们可以使用`serial.onDataReceived`事件来监听串口数据的接收。当从串口接收到数据时,该事件将被触发,并将接收到的数据作为参数传递给事件处理程序。我们可以在事件处理程序中获取到接收到的数据,并进行相应的处理。例如, ``` serial.onDataReceived(function(data) { console.log('Received data: ' + data); }); ``` 最后,在进行串口调试时,我们还可以通过使用`serial.close()`函数来关闭串口,以释放相关资源。例如,`serial.close()`表示关闭当前已打开的串口。 总之,通过以上步骤,我们可以使用JavaScript脚本进行串口调试,通过打开串口、发送数据、监听数据接收等操作,来实现对串口通信的检测和调试。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 15
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值