Socket Connection in Angular

Question

i have a barcode printer i want to connect that printer using socket programming through my Angular project. the printer is on local network so i cant create socket from backend.i tried web socket and socket.io but i am not able to connect to the server.it gives connection failed. it immediatly goes to the error handling method.can some one help how can i create a socket connection using angular and send commands data to the printer

let connection = new WebSocket('wss://127.0.0.1:4000');

connection.onopen = function (e) {
  alert('[open] Connection established');
  alert('Sending to server');
  connection.send('data send');
  console.log(e, 'sendddddddddddddddddddddd');
  connection.onerror = function (error) {
    alert('Please check the server connection1: ' + error);
  };

  connection.onmessage = function (e) {
    console.log('onmessage');
    var respData = e.data;
    alert(respData);
  };

I also tried XHR but same thing happend it only goes to error

let captureUrl = 'wss://javascript.info/article/websocket/chat/ws';

 const xhr = new XMLHttpRequest();
 xhr.open('POST', captureUrl);
 console.log(xhr);

 xhr.responseType = 'json';
   xhr.setRequestHeader('Content-Type', 'application/json');
 const reqParam: any = {
   command: 'STAR',
   startpage: 'startPages',
   endpage: 'endpage',
 };
 const reqParam: any = { command: 'DATA', data: 'none' };
 var res = await xhr.send(JSON.stringify(reqParam));
 console.log(res, 'aaaaaaaaaaaaaaaaaaaaaaaaaaaaa');

console.log(xhr.readyState);

xhr.onload = function () {
  
   alert('onmload');
 };

 xhr.onerror = function () {
    only triggers if the request couldn't be made at all
  alert('Network Error');
 };