网络套接字连接.为什么我们要调用 ws://echo.websocket.org? [英] Websocket connection. Why are we making a call to ws://echo.websocket.org?

问题描述

我正在编写一些 websocket 代码，到目前为止我已经有了:

I am writing some websocket code and I have this so far:

window.onload = function() {

  // Get references to elements on the page.
  var form = document.getElementById('message-form');
  var messageField = document.getElementById('message');
  var messagesList = document.getElementById('messages');
  var socketStatus = document.getElementById('status');
  var closeBtn = document.getElementById('close');

  var socket = new WebSocket('ws://echo.websocket.org');

  // Show a connected message when the WebSocket is opened.
  socket.onopen = function(event) {
    socketStatus.innerHTML = 'Connected to: ' + event.currentTarget.url;
    socketStatus.className = 'open';
  };

  // Handle any errors that occur.
  socket.onerror =  function(error) {
    console.log('WebSocket Error: ' + error);
  };

  form.onsubmit = function(e) {
    e.preventDefault();

    // Retrieve the message from the textarea.
    var message = messageField.value;

    // Send the message through the WebSocket.
    socket.send(message);

    // Add the message to the messages list.
    messagesList.innerHTML += '<li class="sent"><span>Sent:</span>' + message +
                              '</li>';

    // Clear out the message field.
    messageField.value = '';

    return false;
  };

  socket.onmessage = function(event) {
    var message = event.data;
    messagesList.innerHTML += '<li class="received"><span>Received:</span>' +
                             message + '</li>';
  };

  closeBtn.onclick = function(e) {
    e.preventDefault();

    // Close the WebSocket.
    socket.close();

    return false;
  };

  socket.onclose = function(event) {
    socketStatus.innerHTML = 'Disconnected from WebSocket.';
    socketStatus.className = 'closed';
  };
};

这段代码在做什么:

 var socket = new WebSocket('ws://echo.websocket.org');

那是什么网址?当我用浏览器访问那里时，它不存在，但这似乎很重要，因为我不能简单地用随机字符串替换该 url.它有什么作用?Websocket 是外部 API 吗?

What url is that? When I visit there with my browser it does not exist but it seems to be important as I can't simply jus replace that url with random strings. What does it do? Is Websocket an external API?

我正在查看网络标签，我看到了这个:

I'm looking at the network tab and I see this:

Request URL: ws://echo.websocket.org/
Request Method: GET
Status Code: 101 Web Socket Protocol Handshake

从概念上讲，这是怎么回事?为什么我需要向外部站点发出请求才能使用 Websockets?

conceptually, what is going on? Why do I need to make a request to an external site to use Websockets?

推荐答案

echo.websocket.org 提供了一个 webSocket 服务器，可以让你建立一个 webSocket 连接到它，然后它简单地回显给你你发送的任何东西.它主要用于测试和演示目的.

echo.websocket.org provides a webSocket server that lets you make a webSocket connection to it and then it simply echos back to you anything that you send it. It's there primarily for testing and demo purposes.

您显示的代码看起来像一个演示/测试应用程序，旨在为 webSocket 连接在浏览器网页中运行，您可以在此处访问类似的内容:https://websocket.org/echo.html.

The code you show looks like a demo/testing app designed to run in a browser web page for a webSocket connection which you can access something similar here: https://websocket.org/echo.html.

以 ws:// 开头的 URL 表示打算使用 webSocket 协议的连接.

A URL starting with ws:// indicates a connection that intends to use the webSocket protocol.

这段代码在做什么:

var socket = new WebSocket('ws://echo.websocket.org');

它正在与 echo.websocket.org 上的 webSocket 服务器建立 webSocket 连接.

It is making a webSocket connection to a webSocket server at echo.websocket.org.

那是什么网址?

这是一个 webSocket URL，表示使用 webSocket 协议连接和与该主机对话的意图.这不是您在浏览器的 URL 栏中键入的内容.它是一种编程语言(例如浏览器中的 Javascript)使用的东西.

That is a webSocket URL that indicates the intent to use the webSocket protocol to connect and talk to that host. This is not something you type in the URL bar of a browser. It's something that is used by a programming language (such as Javascript in your browser).

Websocket 是外部 API 吗?

Is Websocket an external API?

它是一个协议，它指定了一种连接方式、一个安全方案、一种数据包数据格式等......你可以说http协议对于webSocket协议就像英语对于日语一样.它们是不同的通信方式.webSocket 协议的规范在这里:https://tools.ietf.org/html/rfc6455.

It's a protocol that specifies a means of connecting, a security scheme, a packet data format, etc... You could say that the http protocol is to the webSocket protocol as the English language is to Japanese. They are different means of communicating. The specification for the webSocket protocol is here: https://tools.ietf.org/html/rfc6455.

它还旨在很好地适应 http/浏览器世界，并与最初为 http 请求设计的基础设施友好.只需搜索什么是 websocket"即可在 Google 上会出现各种描述性文章.webSocket 的维基百科页面 提供了很好的概述.

It's also designed to fit well into the http/browser world and to be friendly with infrastructure that was originally designed for http requests. Just searching for "what is websocket" on Google will turn up all sorts of descriptive articles. The Wikipedia page for webSocket provides a pretty good overview.

网上有很多关于 webSocket 协议是什么以及对它有用的文章，所以我不会在这里重复.您可以在此处查看有关 webSocket 客户端的教程和webSocket 服务器教程此处.

There is tons written on the web about what the webSocket protocol is and is useful for so I won't repeat that here. You can see a tutorial on webSocket clients here and a tutorial on webSocket servers here.

简而言之，它被设计为一种持久、连续的连接(所有现代浏览器都支持)，允许客户端连接到服务器，然后(可能)长时间保持连续连接.当该连接打开时，可以通过 webSocket 轻松地双向发送数据.人们使用它的主要原因是他们希望服务器能够及时将数据直接发送到客户端，而不必让客户端不断地一遍又一遍地询问服务器是否有任何新数据.一旦建立了 webSocket 连接，服务器就可以直接推送"它.随时向客户提供数据.

In a nutshell, it's designed to be a long lasting, continuous connection (supported in all modern browsers) that allows a client to connect to a server and then maintain a continuous connection for (potentially) a long duration. While that connection is open, data can be easily sent both ways over the webSocket. The primary reason people use it is when they want the server to be able to send data directly to the client in a timely fashion without making the client continuously ask the server over and over again if it has any new data. Once a webSocket connection is established, the server can just "push" data to the client at any time.

我正在查看网络选项卡，我看到了这个.从概念上讲，发生了什么?

I'm looking at the network tab and I see this. Conceptually, what is going on?

请求网址:ws://echo.websocket.org/

Request URL: ws://echo.websocket.org/

请求方法:GET 状态码:

Request Method: GET Status Code:

101 Web Socket 协议握手

101 Web Socket Protocol Handshake

这些是建立 webSocket 连接的第一步.您可以在此处查看有关该连接如何工作的更完整说明:socket.io 的工作原理.那个帖子谈到了 socket.io，它是构建在 webSocket 之上的另一层，但底层协议是 webSocket.

Those are the first steps of establishing a webSocket connection. You can see a more complete description of how that connection works here: How socket.io works. That post talks about socket.io which is another layer built on top of webSocket, but the underlying protocol is webSocket.

为什么我需要向外部站点发出请求才能使用 Websockets?

Why do I need to make a request to an external site to use Websockets?

webSocket 的目的是将客户端连接到服务器(因此可以在它们之间发送数据)，因此它只会在连接到某处的某个服务器时使用.

A webSocket's purpose is to connect a client to a server (so data can then be sent between them) so it would only be used when connecting to some server somewhere.

这篇关于网络套接字连接.为什么我们要调用 ws://echo.websocket.org?的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！