네트워크 통신

Chrome 앱이 TCP 및 UDP 연결을 위한 네트워크 클라이언트 역할을 할 수 있습니다. 이 문서에서는 TCP 및 UDP를 사용하여 네트워크를 통해 데이터를 주고받는 방법을 보여줍니다. 자세한 내용은 소켓 UDP, 소켓 TCP, 소켓 TCP 서버 API를 참고하세요.

매니페스트 요구사항

TCP 또는 UDP를 사용하는 Chrome 앱의 경우 매니페스트에 소켓 항목을 추가하고 IP 엔드포인트 권한 규칙을 지정합니다. 예를 들면 다음과 같습니다.

"sockets": {
    "udp": {
      "send": ["host-pattern1", ...],
      "bind": ["host-pattern2", ...],
      ...
    },
    "tcp" : {
      "connect": ["host-pattern1", ...],
      ...
    },
    "tcpServer" : {
      "listen": ["host-pattern1", ...],
      ...
    }
  }

소켓 'host-pattern' 항목의 구문은 다음 규칙을 따릅니다.

<host-pattern> := <host> | ':' <port> | <host> ':' <port>
<host> := '*' | '*.' <anychar except '/' and '*'>+
<port> := '*' | <port number between 1 and 65535>)

문법에 관한 자세한 설명은 소켓 매니페스트 키를 참고하세요.

소켓 매니페스트 항목의 예:

  • { "tcp": { "connect" : "*:23" } }: 임의의 호스트의 포트 23에서 연결
  • { "tcp": { "connect" : ["*:23", "*:80"] } }: 호스트의 포트 23 또는 80에서 연결
  • { "tcp": { "connect" : "www.example.com:23" } }: www.example.com의 포트 23 연결
  • { "tcp": { "connect" : "" } }: 호스트의 포트 연결
  • { "udp": { "send" : ":99" } }: 임의의 호스트의 포트 99로 UDP 패킷 전송
  • { "udp": { "bind" : ":8899" } }: UDP 패킷을 수신하도록 로컬 포트 8899 연결
  • { "tcpServer": { "listen" : ":8080" } }: 로컬 포트 8080에서 리슨하는 TCP

TCP 사용

Chrome 앱은 TCP를 지원하는 모든 서비스에 연결할 수 있습니다.

소켓에 연결

다음은 소켓에 연결하는 방법 (sockets.tcp.connect)을 보여주는 샘플입니다.

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

나중에 이 소켓으로 데이터(sockets.tcp.send)를 수신하고 보낼 수 있도록 핸들을 socketId에 유지합니다.

소켓에서 수신 및 소켓 전송

(sockets.tcp.onReceive)에서 수신하고 소켓으로 전송하는 데는 ArrayBuffer 객체가 사용됩니다. ArrayBuffer에 관한 자세한 내용은 개요, JavaScript 유형 배열 및 튜토리얼인 ArrayBuffer를 String으로 또는 String에서 변환하는 방법을 참고하세요.

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

소켓에서 연결 해제

연결을 해제하는 방법은 다음과 같습니다 (sockets.tcp.disconnect).

chrome.sockets.tcp.disconnect(socketId);

UDP 사용

Chrome 앱은 UDP를 지원하는 모든 서비스에 연결할 수 있습니다.

데이터 전송

다음은 UDP를 사용하여 네트워크를 통해 데이터 (sockets.udp.send)를 전송하는 방법을 보여주는 샘플입니다.

// Create the Socket
chrome.sockets.udp.create({}, function(socketInfo) {
  // The socket is created, now we can send some data
  var socketId = socketInfo.socketId;
  chrome.sockets.udp.send(socketId, arrayBuffer,
    '127.0.0.1', 1337, function(sendInfo) {
      console.log("sent " + sendInfo.bytesSent);
  });
});

데이터 수신

이 예는 데이터 수신을 위해 이벤트 핸들러를 설정한다는 점을 제외하면 '데이터 전송' 예와 매우 유사합니다.

var socketId;

// Handle the "onReceive" event.
var onReceive = function(info) {
  if (info.socketId !== socketId)
    return;
  console.log(info.data);
};

// Create the Socket
chrome.sockets.udp.create({}, function(socketInfo) {
  socketId = socketInfo.socketId;
  // Setup event handler and bind socket.
  chrome.sockets.udp.onReceive.addListener(onReceive);
  chrome.sockets.udp.bind(socketId,
    "0.0.0.0", 0, function(result) {
      if (result < 0) {
        console.log("Error binding socket.");
        return;
      }
      chrome.sockets.udp.send(socketId, arrayBuffer,
        '127.0.0.1', 1337, function(sendInfo) {
          console.log("sent " + sendInfo.bytesSent);
      });
  });
});

TCP 서버 사용

Chrome 앱은 sockets.tcpServer API를 사용하여 TCP 서버 역할을 할 수 있습니다.

TCP 서버 소켓 만들기

sockets.tcpServer.create를 사용하여 TCP 서버 소켓을 만듭니다.

chrome.sockets.tcpServer.create({}, function(createInfo) {
  listenAndAccept(createInfo.socketId);
});

클라이언트 연결 수락

다음은 TCP 서버 소켓에서 연결 (sockets.tcpServer.listen)을 수락하는 방법을 보여주는 샘플입니다.

function listenAndAccept(socketId) {
  chrome.sockets.tcpServer.listen(socketId,
    IP, PORT, function(resultCode) {
      onListenCallback(socketId, resultCode)
  });
}

나중에 새 연결(sockets.tcpServer.onAccept)을 수락할 수 있도록 핸들을 socketId에 유지합니다.

var serverSocketId;
function onListenCallback(socketId, resultCode) {
  if (resultCode < 0) {
    console.log("Error listening:" +
      chrome.runtime.lastError.message);
    return;
  }
  serverSocketId = socketId;
  chrome.sockets.tcpServer.onAccept.addListener(onAccept)
}

새 연결이 설정되면 새 TCP 연결의 clientSocketId와 함께 onAccept가 호출됩니다. 클라이언트 소켓 ID는 sockets.tcp API와 함께 사용되어야 합니다. 새 연결의 소켓은 기본적으로 일시중지됩니다. sockets.tcp.setPaused에서 일시중지를 해제하여 데이터 수신을 시작합니다.

function onAccept(info) {
  if (info.socketId != serverSocketId)
    return;

  // A new TCP connection has been established.
  chrome.sockets.tcp.send(info.clientSocketId, data,
    function(resultCode) {
      console.log("Data sent to new TCP client connection.")
  });
  // Start receiving data.
  chrome.sockets.tcp.onReceive.addListener(function(recvInfo) {
    if (recvInfo.socketId != info.clientSocketId)
      return;
    // recvInfo.data is an arrayBuffer.
  });
  chrome.sockets.tcp.setPaused(false);
}

클라이언트 연결 수락 중지

서버 소켓 ID에서 sockets.tcp.disconnect를 호출하여 새 연결 수락을 중지합니다.

chrome.sockets.tcpServer.onAccept.removeListener(onAccept);
chrome.sockets.tcpServer.disconnect(serverSocketId);