serialport / node-serialport

Access serial ports with JavaScript. Linux, OSX and Windows. Welcome your robotic JavaScript overlords. Better yet, program them!
https://serialport.io
MIT License
5.81k stars 1.01k forks source link

Select baudrate from Selector option in html to js electron app #2545

Open MaxESP opened 2 years ago

MaxESP commented 2 years ago

SerialPort Version

10.3.0

Node Version

16.15

Electron Version

17.4.11

Platform

windows 10

Architecture

No response

Hardware or chipset of serialport

FTDI cp2102

What steps will reproduce the bug?

Some Definition const Port = { comPortsOutput : [], baudRateOutput:[], //comPortsOutputOld : [], path : '', //path for Port baudRate: parseInt(X), //Baudrate for Port //baudRate,options :parseInt(X), //baudRate : parseInt(document.getElementById("BaudRate1").value), //baudRate:

OpenPortButton : document.getElementById('Connect'), //HTML Name für Connect-Button ClosePortButton : document.getElementById('Disconnect'), //HTML Name für Disconnect-Button OpenPortButton1 : document.getElementById('Connect1'), //HTML Name für Connect-Button ClosePortButton1 : document.getElementById('Disconnect1'), //HTML Name für Disconnect-Button */

parser : '', parser1 : '', SelectedPort : '', SelectedPort1 : ''

} 1Liste port connected ok work great

await SerialPort.list().then((ports ,err) => { if(err) { document.getElementById('error').textContent = err.message dialog.showErrorBox(err) return } else { document.getElementById('error').textContent = '' }

//console.log('ports', ports); //später löschen

if (ports.length === 0) {
  document.getElementById('error').textContent = 'No ports discovered'
  dialog.showMessageBox("No ports discovered")
}  

  for( let i=0;i < ports.length;i++) {
    Port.comPortsOutput =Port.comPortsOutput + "<option value = "+ ports[i].path+ ">" + ports[i].path + "</option>"

    document.getElementById('comPorts').innerHTML = Port.comPortsOutput;  

   document.getElementById('comPorts1').innerHTML = Port.comPortsOutput;    

  }
  Port.comPortsOutput = [];

}) 2 Return the value of serial baudrate from html selector

async function GetB(BaudRate1) { //var selectedText = BaudRate1.options[BaudRate1.selectedIndex].innerHTML; var X = parseInt(BaudRate1.value); console.log (X); console log the right baudrate number statut ok //X =baudRate; return X;

} 3

Port.OpenPortButton.onclick = e =>{ Port.path = document.getElementById("comPorts").value, console.log(Port.path),

Port.SelectedPort = new SerialPort({ path:Port.path, baudRate:Port.baudRate, })

Port.parser = Port.SelectedPort.pipe(new ReadlineParser({ delimiter: '\r\n' }))

Port.OpenPortButton.disabled = true
Port.ClosePortButton.disabled = false  

DataReceived()

//

};

html interface:

What happens?

C:\Users\do\Docu\node_modules\@serialport\bindings-cpp\dist\win32.js:34 Uncaught (in promise) TypeError: "baudRate" is not a valid baudRate at Object.open (C:\Users\do\node_modules\@serialport\bindings-cpp\dist\win32.js:34:19) at SerialPort.open (C:\Users\2021_2\node_modules\@serialport\stream\dist\index.js:101:31)

What should have happened?

to connect to serial baudrate choise

Additional information

No response

sinister296 commented 1 year ago

Make sure to parse the baudRate to INT before passing it in the SerialPort options. This should solve the issue. This is a follow-up from my side, please let me know if you're able to read the data from the serial port after setting the path and baudRate in the runtime.

MaxESP commented 1 year ago

Thanks a lot sinister for your reply I was able to fix this that working good now . I am facing a new problem now .

My Main electron windows is working and i have create a child parent window index2.html from main but i was not able to read the serial port in the children window

sinister296 commented 1 year ago

What is the method that you're using to send the port to the other window. Also, are you using serial port in the rederer process or the main process of your application?

MaxESP commented 1 year ago

Thank you very much for your reply I am a new in coding

I am using in the renderer.js https://github.com/electron/electron/issues/36522

I have progress a little

for my second windows i have make a new renderer js file *because serial port are allready opened in my main electron (async()=>{
try{ let ports = await SerialPort.list(); console.log(ports);

   var path= ports.find(port => port.vendorId === '10C4');
   console.log(path);

   var  baudRate = 9600;
   var x =baudRate;

   //port.BaudRate = 9600;          

    let portser = new SerialPort(path, {

        baudRate: x,
        autoOpen:true 
    });

}catch (error){
    console.log(error);

}

} )(); error

GazHank commented 1 year ago

Hi @MaxESP did you manage to resolve your issue, or do you need any extra support?

MaxESP commented 1 year ago

I did not resolve the issue and i keep all the data comming from serial ports in the main window... No child

GazHank commented 1 year ago

So if I understand correctly you fixed the issue of opening a single serialport, but when trying to open a second port in a new window you get an error that the baudrate is not a valid value?

MaxESP commented 1 year ago

yes is i can open multi Serial ports on main Electron app this issue is fixed , but if i want to open one of those serial port on a child windows I get an error . So I have to have all sensors in the same page like this https://user-images.githubusercontent.com/41333143/217280431-9ed467c4-3f9a-4ce4-accd-00c1c4b01b3c.png

GazHank commented 1 year ago

Am I right to think that you have all of your serialport logic in the renderer process? If so it might be worth taking a look at the electron IPC functionality https://www.electronjs.org/docs/latest/tutorial/ipc

With this you should be able to move your serialport logic into the main process, and then have the renderer processes (child windows) make calls to the main process to do their bidding.

We really need to update the electron-serialport example to make use of IPC as it is now the recommended appraoch (for security reasons) and I think would help for scenarios like this

MaxESP commented 1 year ago

Thanks for your comments but I am not an expert when you have to build all the process as a robust electronic pcb , sketch and the client app like photo I tried to be intuitive to make it work . It's impossible to be good in all domain of work.

MaxESP commented 1 year ago

The project is working I have a good time response between canvas gauge and Electron serial with node js . In the project just left the to make the electron exe... this i Haven't done yet hope that it would not be difficult to compile the electron app.

MaxESP commented 1 year ago

If you have some link to learn compile the elctron app i will save some time thanks again

GazHank commented 1 year ago

There are a few options for building the electron app, the main ones I see people using are electron-builder and electron forge

The choice largely comes down to the complexity of the project you are building, what platforms you want to build for, and how well the tools will be maintained in the future.

I think for simplicity I would point you to electron-builder at this stage, and suggest the quick setup guide to start with. If you have any problems then do reach out, the community is pretty friendly :-)

MaxESP commented 1 year ago

The main app will work on a small factor but power full pc with windows os on a yacth boat . I have made it work on my work Rhyzen 3900 Pc Hope that it's will work on a pc with less power is electron build is better with intel or Amd ?

GazHank commented 1 year ago

sorry by platform I meant Operating systems (Windows, Mac, Linux). It can be easier or more complicated to build for multiple OS. I don't think the build process will affect how well the executable runs on intel vs amd, but I may be wrong

MaxESP commented 1 year ago

Yes i have understand you i confirm windows os only