javascript를 사용하여 브라우저에서 TCP Socket에 연결

javascript를 사용하여 브라우저에서 TCP Socket에 연결

저는 소켓을 열고 그것을 듣는 vb.net 애플리케이션을 가지고 있습니다.

브라우저에서 실행되는 자바스크립트를 이용하여 이 소켓을 통해 해당 어플리케이션과 통신해야 합니다.즉, 이 소켓에서 듣고 있는 앱이 데이터를 가져가서 원격 호출을 사용하여 몇 가지 작업을 수행하고 더 많은 데이터를 가져와 자바스크립트를 읽고 브라우저에서 인쇄해야 하는 소켓에 다시 넣을 수 있도록 이 데이터를 보내야 합니다.

socket.io 을 통해 웹소키피를 시도해 보았지만 아무 것도 유용하지 않다는 것을 증명하지 못했습니다.

그래서 제가 시도하는 것이 가능한지 의문입니다.브라우저에서 실행 중인 자바스크립트가 tcp 소켓에 연결되어 데이터를 전송하고 소켓에서 더 많은 데이터 응답을 듣고 브라우저에 출력할 수 있는 방법이 있습니까?

이것이 가능하다면 누군가가 제가 목표를 세우는 데 도움이 될 올바른 방향을 알려줄 수 있을 것입니다.

문제는 현재 XHR이나 웹소켓에 의존해야 합니다.

현재 널리 사용되는 브라우저는 rawsockets를 생성하고 접근할 수 있는 그런 rawsockets api를 자바스크립트에 구현하지 않았지만, 자바스크립트에서 rawsockets api 구현을 위한 초안이 진행 중입니다.링크를 :음를다다를e:음ste .

크롬은 이제 '실험용' API에서 원시 TCP 및 UDP 소켓을 지원합니다.이러한 기능은 크롬 앱에서만 사용할 수 있으며 문서화되어 있지만 현재는 숨겨져 있습니다.그럼에도 불구하고 일부 개발자들은 이미 이 IRC 클라이언트와 같이 이를 이용한 흥미로운 프로젝트를 만들고 있습니다.

이 API에 액세스하려면 확장 매니페스트에서 실험 플래그를 활성화해야 합니다.소켓을 사용하는 것은 매우 간단합니다. 예를 들어 다음과 같습니다.

chrome.experimental.socket.create('tcp', '127.0.0.1', 8080, function(socketInfo) {
  chrome.experimental.socket.connect(socketInfo.socketId, function (result) {
        chrome.experimental.socket.write(socketInfo.socketId, "Hello, world!");         
    });
});

이 작업은 다음과 같이 네비게이터 인터페이스를 통해 수행할 수 있습니다.

navigator.tcpPermission.requestPermission({remoteAddress:"127.0.0.1", remotePort:6789}).then(
  () => {
    // Permission was granted
    // Create a new TCP client socket and connect to remote host
    var mySocket = new TCPSocket("127.0.0.1", 6789);

    // Send data to server
    mySocket.writeable.write("Hello World").then(
        () => {

            // Data sent sucessfully, wait for response
            console.log("Data has been sent to server");
            mySocket.readable.getReader().read().then(
                ({ value, done }) => {
                    if (!done) {
                        // Response received, log it:
                        console.log("Data received from server:" + value);
                    }

                    // Close the TCP connection
                    mySocket.close();
                }
            );
        },
        e => console.error("Sending error: ", e)
    );
  }
);

자세한 내용은 w3.org tcp-tcp-tcp-tcp-tcp 문서에 설명되어 있습니다.

http://raw-sockets.sysapps.org/ #interface-tcsocket

https://www.w3.org/TR/tcp-udp-sockets/

또 다른 대안은 크롬 소켓을 사용하는 것입니다.

연결 만들기

chrome.sockets.tcp.create({}, function(createInfo) {
  chrome.sockets.tcp.connect(createInfo.socketId,
    IP, PORT, onConnectedCallback);
});

데이터전송

chrome.sockets.tcp.send(socketId, arrayBuffer, onSentCallback);

입고자료

chrome.sockets.tcp.onReceive.addListener(function(info) {
  if (info.socketId != socketId)
    return;
  // info.data is an arrayBuffer.
});

를 사용할 수도 있습니다.HTML5 Web Sockets TCP 접 TCP은만 ):

var connection = new WebSocket('ws://IPAddress:Port');

connection.onopen = function () {
  connection.send('Ping'); // Send the message 'Ping' to the server
};

http://www.html5rocks.com/en/tutorials/websockets/basics/

서버가 pywebsocket과 같은 WebSocket 서버로 청취하고 있어야 합니다. 또는 Mozilla에서 개요를 나타내는 대로 자신의 서버를 쓸 수도 있습니다.

ws2s 프로젝트는 브라우저 측 js에 소켓을 가져오는 것을 목표로 합니다.웹소켓을 소켓으로 변환하는 웹소켓 서버입니다.

ws2s 모식도

코드 샘플:

var socket = new WS2S("wss://ws2s.feling.io/").newSocket()

socket.onReady = () => {
  socket.connect("feling.io", 80)
  socket.send("GET / HTTP/1.1\r\nHost: feling.io\r\nConnection: close\r\n\r\n")
}

socket.onRecv = (data) => {
  console.log('onRecv', data)
}

j소켓 참조.저도 써본 적이 없어요.마지막 업데이트 이후 3년 이상 경과(2014년 6월 26일 기준).

* 플래시 사용 :(

설명서에서:

<script type='text/javascript'>
    // Host we are connecting to
    var host = 'localhost'; 
    // Port we are connecting on
    var port = 3000;

    var socket = new jSocket();

    // When the socket is added the to document 
    socket.onReady = function(){
            socket.connect(host, port);             
    }

    // Connection attempt finished
    socket.onConnect = function(success, msg){
            if(success){
                    // Send something to the socket
                    socket.write('Hello world');            
            }else{
                    alert('Connection to the server could not be estabilished: ' + msg);            
            }       
    }
    socket.onData = function(data){
            alert('Received from socket: '+data);   
    }

    // Setup our socket in the div with the id="socket"
    socket.setup('mySocket');       
</script>

원하는 것을 달성하기 위해서는 두 가지 애플리케이션(예를 들어 Java 또는 Python)을 작성해야 합니다.

1. 클라이언트의 컴퓨터에 설치되어 TCP/IP 소켓과 WebSocket을 모두 처리할 수 있는 브리지 앱입니다.문제의 TCP/IP 소켓과 상호 작용합니다.

2. 웹소켓과 대화할 수 있는 서버측 앱(예: JSP/Servlet WAR).브라우저에서 액세스할 수 있는 HTML 페이지(필요한 경우 서버측 처리 코드 포함)가 하나 이상 포함되어 있습니다.

이렇게 작동해야 합니다.

1. 서버가 클라이언트에 연결할 수 없기 때문에 브리지가 웹 앱에 대한 WS 연결을 엽니다.
2. 웹 앱은 클라이언트에게 자신을 식별하도록 요청할 것입니다.
3. 브리지 클라이언트는 서버에 일부 ID 정보를 전송하고 서버는 브리지를 식별하기 위해 이 정보를 저장합니다.
   4. 브라우저에서 볼 수 있는 페이지는 JS를 사용하여 WS 서버에 연결됩니다.
   5. JS 기반 페이지에 대해서는 3단계를 반복합니다.
   6. JS 기반 페이지는 서버가 가야 할 브리지를 포함한 명령을 서버로 보냅니다.
   7. 서버는 명령을 브리지에 전달합니다.
   8. 브리지는 TCP/IP 소켓을 열고 해당 소켓과 상호 작용합니다(메시지 전송, 응답 수신).
   9. Bridge는 WS를 통해 서버에 응답을 전송합니다.
   10. WS는 브라우저에서 볼 수 있는 페이지로 응답을 전달합니다.
   11. JS는 응답을 처리하고 그에 따라 반응합니다.
   12. 클라이언트 연결 끊기/언로드될 때까지 반복

참고 1: 위의 단계는 광범위한 단순화이며 클라이언트의 연결이 너무 일찍 끊어지거나 서버가 종료/재시작 중임을 클라이언트에게 알려야 할 경우 오류 처리 및 keepAlive 요청에 대한 정보는 포함되지 않습니다.

참고 2: 필요에 따라 해당 TCP/IP 소켓 서버가 서버 앱과 동일한 컴퓨터에 있다면 이러한 구성 요소를 하나로 병합하는 것이 가능할 수 있습니다.

당신이 정말로 찾고 있는 해결책은 웹 소켓입니다.그러나 크롬 프로젝트는 직접 TCP 연결인 몇가지 새로운 기술을 개발했습니다. TCP 크롬

언급URL : https://stackoverflow.com/questions/12407778/connecting-to-tcp-socket-from-browser-using-javascript