mirror
/
vapor-docs
mirror of https://github.com/vapor/docs.git
1
0
Fork 0
Code Issues Projects Releases Wiki Activity
vapor-docs/build/3.0/websocket/overview/index.html

2287 lines
54 KiB
HTML
Raw Blame History

<!DOCTYPE html>
<html lang="en" class="no-js">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width,initial-scale=1">
<meta http-equiv="x-ua-compatible" content="ie=edge">
<link rel="canonical" href="https://docs.vapor.codes/3.0/websocket/overview/">
<meta name="lang:clipboard.copy" content="Copy to clipboard">
<meta name="lang:clipboard.copied" content="Copied to clipboard">
<meta name="lang:search.language" content="en">
<meta name="lang:search.pipeline.stopwords" content="True">
<meta name="lang:search.pipeline.trimmer" content="True">
<meta name="lang:search.result.none" content="No matching documents">
<meta name="lang:search.result.one" content="1 matching document">
<meta name="lang:search.result.other" content="# matching documents">
<meta name="lang:search.tokenizer" content="[\s\-]+">
<link rel="shortcut icon" href="../../assets/images/favicon.png">
<meta name="generator" content="mkdocs-1.0.4, mkdocs-material-3.0.6">
<title>Overview - Vapor Docs</title>
<link rel="stylesheet" href="../../assets/stylesheets/application.451f80e5.css">
<link rel="stylesheet" href="../../assets/stylesheets/application-palette.22915126.css">
<meta name="theme-color" content="#2196f3">
<link rel="stylesheet" type="text/css" href="../../styles/carbon.css">
<script src="../../assets/javascripts/modernizr.1aa3b519.js"></script>
<script src="../../scripts/carbon.js"></script>
<link href="https://fonts.gstatic.com" rel="preconnect" crossorigin>
<link rel="stylesheet" href="https://fonts.googleapis.com/css?family=Roboto:300,400,400i,700|Roboto+Mono">
<style>body,input{font-family:"Roboto","Helvetica Neue",Helvetica,Arial,sans-serif}code,kbd,pre{font-family:"Roboto Mono","Courier New",Courier,monospace}</style>
<link rel="stylesheet" href="../../assets/fonts/material-icons.css">
</head>
<body dir="ltr" data-md-color-primary="blue" data-md-color-accent="purple">
<svg class="md-svg">
<defs>
<svg xmlns="http://www.w3.org/2000/svg" width="416" height="448"
viewBox="0 0 416 448" id="__github">
<path fill="currentColor" d="M160 304q0 10-3.125 20.5t-10.75 19-18.125
8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19 18.125-8.5
18.125 8.5 10.75 19 3.125 20.5zM320 304q0 10-3.125 20.5t-10.75
19-18.125 8.5-18.125-8.5-10.75-19-3.125-20.5 3.125-20.5 10.75-19
18.125-8.5 18.125 8.5 10.75 19 3.125 20.5zM360
304q0-30-17.25-51t-46.75-21q-10.25 0-48.75 5.25-17.75 2.75-39.25
2.75t-39.25-2.75q-38-5.25-48.75-5.25-29.5 0-46.75 21t-17.25 51q0 22 8
38.375t20.25 25.75 30.5 15 35 7.375 37.25 1.75h42q20.5 0
37.25-1.75t35-7.375 30.5-15 20.25-25.75 8-38.375zM416 260q0 51.75-15.25
82.75-9.5 19.25-26.375 33.25t-35.25 21.5-42.5 11.875-42.875 5.5-41.75
1.125q-19.5 0-35.5-0.75t-36.875-3.125-38.125-7.5-34.25-12.875-30.25-20.25-21.5-28.75q-15.5-30.75-15.5-82.75
0-59.25 34-99-6.75-20.5-6.75-42.5 0-29 12.75-54.5 27 0 47.5 9.875t47.25
30.875q36.75-8.75 77.25-8.75 37 0 70 8 26.25-20.5
46.75-30.25t47.25-9.75q12.75 25.5 12.75 54.5 0 21.75-6.75 42 34 40 34
99.5z" />
</svg>
</defs>
</svg>
<input class="md-toggle" data-md-toggle="drawer" type="checkbox" id="__drawer" autocomplete="off">
<input class="md-toggle" data-md-toggle="search" type="checkbox" id="__search" autocomplete="off">
<label class="md-overlay" data-md-component="overlay" for="__drawer"></label>
<a href="#using-websockets" tabindex="1" class="md-skip">
Skip to content
</a>
<header class="md-header" data-md-component="header">
<nav class="md-header-nav md-grid">
<div class="md-flex">
<div class="md-flex__cell md-flex__cell--shrink">
<a href="https://docs.vapor.codes/3.0/" title="Vapor Docs" class="md-header-nav__button md-logo">
<img src="../../images/droplet-white.svg" width="24" height="24">
</a>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--menu md-header-nav__button" for="__drawer"></label>
</div>
<div class="md-flex__cell md-flex__cell--stretch">
<div class="md-flex__ellipsis md-header-nav__title" data-md-component="title">
<span class="md-header-nav__topic">
Vapor Docs
</span>
<span class="md-header-nav__topic">
Overview
</span>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<label class="md-icon md-icon--search md-header-nav__button" for="__search"></label>
<div class="md-search" data-md-component="search" role="dialog">
<label class="md-search__overlay" for="__search"></label>
<div class="md-search__inner" role="search">
<form class="md-search__form" name="search">
<input type="text" class="md-search__input" name="query" placeholder="Search" autocapitalize="off" autocorrect="off" autocomplete="off" spellcheck="false" data-md-component="query" data-md-state="active">
<label class="md-icon md-search__icon" for="__search"></label>
<button type="reset" class="md-icon md-search__icon" data-md-component="reset" tabindex="-1">
&#xE5CD;
</button>
</form>
<div class="md-search__output">
<div class="md-search__scrollwrap" data-md-scrollfix>
<div class="md-search-result" data-md-component="result">
<div class="md-search-result__meta">
Type to start searching
</div>
<ol class="md-search-result__list"></ol>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<div class="md-header-nav__source">
<a href="http://github.com/vapor/vapor/" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
GitHub
</div>
</a>
</div>
</div>
</div>
</nav>
</header>
<div class="md-container">
<main class="md-main">
<div class="md-main__inner md-grid" data-md-component="container">
<div class="md-sidebar md-sidebar--primary" data-md-component="navigation">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--primary" data-md-level="0">
<label class="md-nav__title md-nav__title--site" for="__drawer">
<a href="https://docs.vapor.codes/3.0/" title="Vapor Docs" class="md-nav__button md-logo">
<img src="../../images/droplet-white.svg" width="48" height="48">
</a>
Vapor Docs
</label>
<div class="md-nav__source">
<a href="http://github.com/vapor/vapor/" title="Go to repository" class="md-source" data-md-source="github">
<div class="md-source__icon">
<svg viewBox="0 0 24 24" width="24" height="24">
<use xlink:href="#__github" width="24" height="24"></use>
</svg>
</div>
<div class="md-source__repository">
GitHub
</div>
</a>
</div>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../.." title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-2" type="checkbox" id="nav-2">
<label class="md-nav__link" for="nav-2">
Install
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-2">
Install
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../install/macos/" title="macOS" class="md-nav__link">
macOS
</a>
</li>
<li class="md-nav__item">
<a href="../../install/ubuntu/" title="Ubuntu" class="md-nav__link">
Ubuntu
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-3" type="checkbox" id="nav-3">
<label class="md-nav__link" for="nav-3">
Getting Started
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-3">
Getting Started
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../getting-started/hello-world/" title="Hello, world" class="md-nav__link">
Hello, world
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/toolbox/" title="Toolbox" class="md-nav__link">
Toolbox
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/spm/" title="SPM" class="md-nav__link">
SPM
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/xcode/" title="Xcode" class="md-nav__link">
Xcode
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/structure/" title="Folder Structure" class="md-nav__link">
Folder Structure
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/application/" title="Application" class="md-nav__link">
Application
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/controllers/" title="Controllers" class="md-nav__link">
Controllers
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/routing/" title="Routing" class="md-nav__link">
Routing
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/content/" title="Content" class="md-nav__link">
Content
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/async/" title="Async" class="md-nav__link">
Async
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/services/" title="Services" class="md-nav__link">
Services
</a>
</li>
<li class="md-nav__item">
<a href="../../getting-started/cloud/" title="Deployment" class="md-nav__link">
Deployment
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-4" type="checkbox" id="nav-4">
<label class="md-nav__link" for="nav-4">
Async
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-4">
Async
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../async/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../async/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-5" type="checkbox" id="nav-5">
<label class="md-nav__link" for="nav-5">
Auth
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-5">
Auth
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../auth/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../auth/api/" title="Stateless (API)" class="md-nav__link">
Stateless (API)
</a>
</li>
<li class="md-nav__item">
<a href="../../auth/web/" title="Sessions (Web)" class="md-nav__link">
Sessions (Web)
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-6" type="checkbox" id="nav-6">
<label class="md-nav__link" for="nav-6">
Console
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-6">
Console
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../console/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../console/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-7" type="checkbox" id="nav-7">
<label class="md-nav__link" for="nav-7">
Command
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-7">
Command
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../command/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../command/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-8" type="checkbox" id="nav-8">
<label class="md-nav__link" for="nav-8">
Crypto
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-8">
Crypto
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../crypto/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../crypto/digests/" title="Digests" class="md-nav__link">
Digests
</a>
</li>
<li class="md-nav__item">
<a href="../../crypto/ciphers/" title="Ciphers" class="md-nav__link">
Ciphers
</a>
</li>
<li class="md-nav__item">
<a href="../../crypto/asymmetric/" title="Asymmetric" class="md-nav__link">
Asymmetric
</a>
</li>
<li class="md-nav__item">
<a href="../../crypto/random/" title="Random" class="md-nav__link">
Random
</a>
</li>
<li class="md-nav__item">
<a href="../../crypto/otp/" title="TOTP & HOTP" class="md-nav__link">
TOTP & HOTP
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-9" type="checkbox" id="nav-9">
<label class="md-nav__link" for="nav-9">
Database Kit
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-9">
Database Kit
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../database-kit/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../database-kit/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-10" type="checkbox" id="nav-10">
<label class="md-nav__link" for="nav-10">
Fluent
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-10">
Fluent
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../fluent/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../fluent/models/" title="Models" class="md-nav__link">
Models
</a>
</li>
<li class="md-nav__item">
<a href="../../fluent/querying/" title="Querying" class="md-nav__link">
Querying
</a>
</li>
<li class="md-nav__item">
<a href="../../fluent/migrations/" title="Migrations" class="md-nav__link">
Migrations
</a>
</li>
<li class="md-nav__item">
<a href="../../fluent/relations/" title="Relations" class="md-nav__link">
Relations
</a>
</li>
<li class="md-nav__item">
<a href="../../fluent/transaction/" title="Transaction" class="md-nav__link">
Transaction
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-11" type="checkbox" id="nav-11">
<label class="md-nav__link" for="nav-11">
HTTP
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-11">
HTTP
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../http/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../http/client/" title="Client" class="md-nav__link">
Client
</a>
</li>
<li class="md-nav__item">
<a href="../../http/server/" title="Server" class="md-nav__link">
Server
</a>
</li>
<li class="md-nav__item">
<a href="../../http/message/" title="Message" class="md-nav__link">
Message
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-12" type="checkbox" id="nav-12">
<label class="md-nav__link" for="nav-12">
JWT
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-12">
JWT
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../jwt/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../jwt/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-13" type="checkbox" id="nav-13">
<label class="md-nav__link" for="nav-13">
Leaf
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-13">
Leaf
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../leaf/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../leaf/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
<li class="md-nav__item">
<a href="../../leaf/custom-tags/" title="Custom tags" class="md-nav__link">
Custom tags
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-14" type="checkbox" id="nav-14">
<label class="md-nav__link" for="nav-14">
Logging
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-14">
Logging
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../logging/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../logging/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-15" type="checkbox" id="nav-15">
<label class="md-nav__link" for="nav-15">
Multipart
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-15">
Multipart
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../multipart/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../multipart/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-16" type="checkbox" id="nav-16">
<label class="md-nav__link" for="nav-16">
MySQL
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-16">
MySQL
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../mysql/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-17" type="checkbox" id="nav-17">
<label class="md-nav__link" for="nav-17">
PostgreSQL
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-17">
PostgreSQL
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../postgresql/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-18" type="checkbox" id="nav-18">
<label class="md-nav__link" for="nav-18">
Redis
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-18">
Redis
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../redis/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../redis/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-19" type="checkbox" id="nav-19">
<label class="md-nav__link" for="nav-19">
Routing
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-19">
Routing
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../routing/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../routing/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-20" type="checkbox" id="nav-20">
<label class="md-nav__link" for="nav-20">
Service
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-20">
Service
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../service/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../service/services/" title="Services" class="md-nav__link">
Services
</a>
</li>
<li class="md-nav__item">
<a href="../../service/provider/" title="Provider" class="md-nav__link">
Provider
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-21" type="checkbox" id="nav-21">
<label class="md-nav__link" for="nav-21">
SQL
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-21">
SQL
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../sql/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../sql/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-22" type="checkbox" id="nav-22">
<label class="md-nav__link" for="nav-22">
SQLite
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-22">
SQLite
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../sqlite/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-23" type="checkbox" id="nav-23">
<label class="md-nav__link" for="nav-23">
Template Kit
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-23">
Template Kit
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../template-kit/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-24" type="checkbox" id="nav-24">
<label class="md-nav__link" for="nav-24">
Testing
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-24">
Testing
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../testing/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-25" type="checkbox" id="nav-25">
<label class="md-nav__link" for="nav-25">
URL-Encoded Form
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-25">
URL-Encoded Form
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../url-encoded-form/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../url-encoded-form/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-26" type="checkbox" id="nav-26">
<label class="md-nav__link" for="nav-26">
Validation
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-26">
Validation
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../validation/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../validation/overview/" title="Overview" class="md-nav__link">
Overview
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-27" type="checkbox" id="nav-27">
<label class="md-nav__link" for="nav-27">
Vapor
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-27">
Vapor
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../vapor/getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item">
<a href="../../vapor/client/" title="Client" class="md-nav__link">
Client
</a>
</li>
<li class="md-nav__item">
<a href="../../vapor/content/" title="Content" class="md-nav__link">
Content
</a>
</li>
<li class="md-nav__item">
<a href="../../vapor/sessions/" title="Sessions" class="md-nav__link">
Sessions
</a>
</li>
<li class="md-nav__item">
<a href="../../vapor/websocket/" title="WebSocket" class="md-nav__link">
WebSocket
</a>
</li>
<li class="md-nav__item">
<a href="../../vapor/middleware/" title="Middleware" class="md-nav__link">
Middleware
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--active md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-28" type="checkbox" id="nav-28" checked>
<label class="md-nav__link" for="nav-28">
WebSocket
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-28">
WebSocket
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../getting-started/" title="Getting Started" class="md-nav__link">
Getting Started
</a>
</li>
<li class="md-nav__item md-nav__item--active">
<input class="md-toggle md-nav__toggle" data-md-toggle="toc" type="checkbox" id="__toc">
<label class="md-nav__link md-nav__link--active" for="__toc">
Overview
</label>
<a href="./" title="Overview" class="md-nav__link md-nav__link--active">
Overview
</a>
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#websocket" title="WebSocket" class="md-nav__link">
WebSocket
</a>
</li>
<li class="md-nav__item">
<a href="#server" title="Server" class="md-nav__link">
Server
</a>
</li>
<li class="md-nav__item">
<a href="#client" title="Client" class="md-nav__link">
Client
</a>
</li>
<li class="md-nav__item">
<a href="#api-docs" title="API Docs" class="md-nav__link">
API Docs
</a>
</li>
<li class="md-nav__item">
<a href="#__comments" title="Comments" class="md-nav__link md-nav__link--active">
Comments
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-29" type="checkbox" id="nav-29">
<label class="md-nav__link" for="nav-29">
Extras
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-29">
Extras
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../extras/style-guide/" title="Style Guide" class="md-nav__link">
Style Guide
</a>
</li>
<li class="md-nav__item">
<a href="../../extras/yeoman/" title="Yeoman" class="md-nav__link">
Yeoman
</a>
</li>
</ul>
</nav>
</li>
<li class="md-nav__item md-nav__item--nested">
<input class="md-toggle md-nav__toggle" data-md-toggle="nav-30" type="checkbox" id="nav-30">
<label class="md-nav__link" for="nav-30">
Version (3.0)
</label>
<nav class="md-nav" data-md-component="collapsible" data-md-level="1">
<label class="md-nav__title" for="nav-30">
Version (3.0)
</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="../../version/1_5/" title="1.5" class="md-nav__link">
1.5
</a>
</li>
<li class="md-nav__item">
<a href="../../version/2_0/" title="2.0" class="md-nav__link">
2.0
</a>
</li>
<li class="md-nav__item">
<a href="../../version/3_0/" title="3.0" class="md-nav__link">
3.0
</a>
</li>
<li class="md-nav__item">
<a href="../../version/upgrading/" title="Upgrading" class="md-nav__link">
Upgrading
</a>
</li>
<li class="md-nav__item">
<a href="../../version/support/" title="Support" class="md-nav__link">
Support
</a>
</li>
</ul>
</nav>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-sidebar md-sidebar--secondary" data-md-component="toc">
<div class="md-sidebar__scrollwrap">
<div class="md-sidebar__inner">
<nav class="md-nav md-nav--secondary">
<label class="md-nav__title" for="__toc">Table of contents</label>
<ul class="md-nav__list" data-md-scrollfix>
<li class="md-nav__item">
<a href="#websocket" title="WebSocket" class="md-nav__link">
WebSocket
</a>
</li>
<li class="md-nav__item">
<a href="#server" title="Server" class="md-nav__link">
Server
</a>
</li>
<li class="md-nav__item">
<a href="#client" title="Client" class="md-nav__link">
Client
</a>
</li>
<li class="md-nav__item">
<a href="#api-docs" title="API Docs" class="md-nav__link">
API Docs
</a>
</li>
<li class="md-nav__item">
<a href="#__comments" title="Comments" class="md-nav__link md-nav__link--active">
Comments
</a>
</li>
</ul>
</nav>
</div>
</div>
</div>
<div class="md-content">
<article class="md-content__inner md-typeset">
<a href="https://github.com/vapor/documentation/edit/master/3.0/docs/websocket/overview.md" title="Edit this page" class="md-icon md-content__icon">&#xE3C9;</a>
<h1 id="using-websockets">Using WebSockets<a class="headerlink" href="#using-websockets" title="Permanent link">&para;</a></h1>
<p>Unlike HTTP, WebSockets allow you to communicate between client and server in an open, interactive way. You can send messages (called frames) in either text or binary format. Both the client and the server can send as many messages as they want at a time, without having to wait for responses.</p>
<p>Although WebSocket is its own protocol, it still uses HTTP to get setup. Every WebSocket connection will start with an HTTP request with special headers followed by an HTTP response with status <code>101 Switching Protocols</code>. After this initial handshake, the connection is a WebSocket connection.</p>
<h2 id="websocket">WebSocket<a class="headerlink" href="#websocket" title="Permanent link">&para;</a></h2>
<p>The <a href="https://api.vapor.codes/websocket/latest/WebSocket/Classes/WebSocket.html"><code>WebSocket</code></a> class represents a connected WebSocket client. You can use this to set callbacks for receiving data and to send data.</p>
<div class="codehilite"><pre><span></span><span class="kd">let</span> <span class="nv">ws</span><span class="p">:</span> <span class="n">WebSocket</span> <span class="p">=</span> <span class="p">...</span>
<span class="c1">// Send an initial message to this WebSocket</span>
<span class="n">ws</span><span class="p">.</span><span class="n">send</span><span class="p">(</span><span class="s">&quot;Hello!&quot;</span><span class="p">)</span>
<span class="c1">// Set a new callback for receiving text formatted data</span>
<span class="n">ws</span><span class="p">.</span><span class="n">onText</span> <span class="p">{</span> <span class="n">ws</span><span class="p">,</span> <span class="n">string</span> <span class="k">in</span>
<span class="c1">// Echo the text back, reversed.</span>
<span class="n">ws</span><span class="p">.</span><span class="n">send</span><span class="p">(</span><span class="n">string</span><span class="p">.</span><span class="n">reversed</span><span class="p">())</span>
<span class="p">}</span>
</pre></div>
<div class="admonition tip">
<p class="admonition-title">Tip</p>
<p>All callbacks will receive a reference to the <code>WebSocket</code>. Use these if you need to send data to avoid creating a reference cycle.</p>
</div>
<p>The <code>WebSocket</code> has an <a href="https://api.vapor.codes/websocket/latest/WebSocket/Classes/WebSocket.html#/s:9WebSocketAAC7onCloseXev"><code>onClose</code></a> future that will be completed when the connection closes. You can use <a href="https://api.vapor.codes/websocket/latest/WebSocket/Classes/WebSocket.html#/s:9WebSocketAAC5closeyyF"><code>close()</code></a> to close the connection yourself.</p>
<h2 id="server">Server<a class="headerlink" href="#server" title="Permanent link">&para;</a></h2>
<p>WebSocket servers connect to one or more WebSocket clients at a time. As mentioned previously, WebSocket connections must start via an HTTP request and response handshake. Because of this, WebSocket servers are built on top of <a href="../../http/server/">HTTP servers</a> using the HTTP upgrade mechanism.</p>
<div class="codehilite"><pre><span></span><span class="c1">// First, create an HTTPProtocolUpgrader</span>
<span class="kd">let</span> <span class="nv">ws</span> <span class="p">=</span> <span class="n">HTTPServer</span><span class="p">.</span><span class="n">webSocketUpgrader</span><span class="p">(</span><span class="n">shouldUpgrade</span><span class="p">:</span> <span class="p">{</span> <span class="n">req</span> <span class="k">in</span>
<span class="c1">// Returning nil in this closure will reject upgrade</span>
<span class="k">if</span> <span class="n">req</span><span class="p">.</span><span class="n">url</span><span class="p">.</span><span class="n">path</span> <span class="p">==</span> <span class="s">&quot;/deny&quot;</span> <span class="p">{</span> <span class="k">return</span> <span class="kc">nil</span> <span class="p">}</span>
<span class="c1">// Return any additional headers you like, or just empty</span>
<span class="k">return</span> <span class="p">[:]</span>
<span class="p">},</span> <span class="n">onUpgrade</span><span class="p">:</span> <span class="p">{</span> <span class="n">ws</span><span class="p">,</span> <span class="n">req</span> <span class="k">in</span>
<span class="c1">// This closure will be called with each new WebSocket client</span>
<span class="n">ws</span><span class="p">.</span><span class="n">send</span><span class="p">(</span><span class="s">&quot;Connected&quot;</span><span class="p">)</span>
<span class="n">ws</span><span class="p">.</span><span class="n">onText</span> <span class="p">{</span> <span class="n">ws</span><span class="p">,</span> <span class="n">string</span> <span class="k">in</span>
<span class="n">ws</span><span class="p">.</span><span class="n">send</span><span class="p">(</span><span class="n">string</span><span class="p">.</span><span class="n">reversed</span><span class="p">())</span>
<span class="p">}</span>
<span class="p">})</span>
<span class="c1">// Next, create your server, adding the WebSocket upgrader</span>
<span class="kd">let</span> <span class="nv">server</span> <span class="p">=</span> <span class="k">try</span> <span class="n">HTTPServer</span><span class="p">.</span><span class="n">start</span><span class="p">(</span>
<span class="p">...</span>
<span class="n">upgraders</span><span class="p">:</span> <span class="p">[</span><span class="n">ws</span><span class="p">],</span>
<span class="p">...</span>
<span class="p">).</span><span class="n">wait</span><span class="p">()</span>
<span class="c1">// Run the server.</span>
<span class="k">try</span> <span class="n">server</span><span class="p">.</span><span class="n">onClose</span><span class="p">.</span><span class="n">wait</span><span class="p">()</span>
</pre></div>
<div class="admonition seealso">
<p class="admonition-title">Seealso</p>
<p>Visit <a href="../../http/server/">HTTP → Server</a> for more information on setting up an HTTP server.</p>
</div>
<p>The WebSocket protocol upgrader consists of two callbacks. </p>
<p>The first callback <code>shouldUpgrade</code> receives the incoming HTTP request that is requesting upgrade. This callback decides whether or not to complete the upgrade based on the contents of the request. If <code>nil</code> is returned in this closure, the upgrade will be rejected.</p>
<p>The second callback <code>onUpgrade</code> is called each time a new WebSocket client connects. This is where you configure your callbacks and send any initial data.</p>
<div class="admonition warning">
<p class="admonition-title">Warning</p>
<p>The upgrade closures may be called on any event loop. Be careful to avoid race conditions if you must access external variables.</p>
</div>
<h2 id="client">Client<a class="headerlink" href="#client" title="Permanent link">&para;</a></h2>
<p>You can also use the WebSocket package to connect <em>to</em> a WebSocket server. Just like the WebSocket server used an HTTP server, the WebSocket client uses HTTP client.</p>
<div class="codehilite"><pre><span></span><span class="c1">// Create a new WebSocket connected to echo.websocket.org</span>
<span class="kd">let</span> <span class="nv">ws</span> <span class="p">=</span> <span class="k">try</span> <span class="n">HTTPClient</span><span class="p">.</span><span class="n">webSocket</span><span class="p">(</span><span class="n">hostname</span><span class="p">:</span> <span class="s">&quot;echo.websocket.org&quot;</span><span class="p">,</span> <span class="n">on</span><span class="p">:</span> <span class="p">...).</span><span class="n">wait</span><span class="p">()</span>
<span class="c1">// Set a new callback for receiving text formatted data.</span>
<span class="n">ws</span><span class="p">.</span><span class="n">onText</span> <span class="p">{</span> <span class="n">ws</span><span class="p">,</span> <span class="n">text</span> <span class="k">in</span>
<span class="bp">print</span><span class="p">(</span><span class="s">&quot;Server echo: </span><span class="si">\(</span><span class="n">text</span><span class="si">)</span><span class="s">&quot;</span><span class="p">)</span>
<span class="p">}</span>
<span class="c1">// Send a message.</span>
<span class="n">ws</span><span class="p">.</span><span class="n">send</span><span class="p">(</span><span class="s">&quot;Hello, world!&quot;</span><span class="p">)</span>
<span class="c1">// Wait for the Websocket to close.</span>
<span class="k">try</span> <span class="n">ws</span><span class="p">.</span><span class="n">onClose</span><span class="p">.</span><span class="n">wait</span><span class="p">()</span>
</pre></div>
<div class="admonition seealso">
<p class="admonition-title">Seealso</p>
<p>Visit <a href="../../http/client/">HTTP → Client</a> for more information on setting up an HTTP client.</p>
</div>
<h2 id="api-docs">API Docs<a class="headerlink" href="#api-docs" title="Permanent link">&para;</a></h2>
<p>Check out the <a href="https://api.vapor.codes/websocket/latest/WebSocket/index.html">API docs</a> for more in-depth information about all of the methods.</p>
<h2 id="__comments">Comments</h2>
<div id="disqus_thread"></div>
<script>
var disqus_config = function () {
this.page.url = "https://docs.vapor.codes/3.0/websocket/overview/";
this.page.identifier =
"websocket/overview/";
};
(function() {
var d = document, s = d.createElement("script");
s.src = "//vapor-docs.disqus.com/embed.js";
s.setAttribute("data-timestamp", +new Date());
(d.head || d.body).appendChild(s);
})();
</script>
</article>
</div>
</div>
</main>
<footer class="md-footer">
<div class="md-footer-nav">
<nav class="md-footer-nav__inner md-grid">
<a href="../getting-started/" title="Getting Started" class="md-flex md-footer-nav__link md-footer-nav__link--prev" rel="prev">
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-back md-footer-nav__button"></i>
</div>
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Previous
</span>
Getting Started
</span>
</div>
</a>
<a href="../../extras/style-guide/" title="Style Guide" class="md-flex md-footer-nav__link md-footer-nav__link--next" rel="next">
<div class="md-flex__cell md-flex__cell--stretch md-footer-nav__title">
<span class="md-flex__ellipsis">
<span class="md-footer-nav__direction">
Next
</span>
Style Guide
</span>
</div>
<div class="md-flex__cell md-flex__cell--shrink">
<i class="md-icon md-icon--arrow-forward md-footer-nav__button"></i>
</div>
</a>
</nav>
</div>
<div class="md-footer-meta md-typeset">
<div class="md-footer-meta__inner md-grid">
<div class="md-footer-copyright">
<div class="md-footer-copyright__highlight">
Copyright &copy; 2018 Qutheory, LLC
</div>
powered by
<a href="https://www.mkdocs.org">MkDocs</a>
and
<a href="https://squidfunk.github.io/mkdocs-material/">
Material for MkDocs</a>
</div>
<div class="md-footer-social">
<link rel="stylesheet" href="../../assets/fonts/font-awesome.css">
<a href="https://twitter.com/@codevapor" class="md-footer-social__link fa fa-twitter"></a>
<a href="http://vapor.team/" class="md-footer-social__link fa fa-slack"></a>
<a href="https://github.com/vapor" class="md-footer-social__link fa fa-github"></a>
</div>
</div>
</div>
</footer>
</div>
<script src="../../assets/javascripts/application.5e60981f.js"></script>
<script>app.initialize({version:"1.0.4",url:{base:"../.."}})</script>
<script>!function(e,a,t,n,o,c,i){e.GoogleAnalyticsObject=o,e.ga=e.ga||function(){(e.ga.q=e.ga.q||[]).push(arguments)},e.ga.l=1*new Date,c=a.createElement(t),i=a.getElementsByTagName(t)[0],c.async=1,c.src="https://www.google-analytics.com/analytics.js",i.parentNode.insertBefore(c,i)}(window,document,"script",0,"ga"),ga("create","UA-76177358-4","auto"),ga("set","anonymizeIp",!0),ga("send","pageview");var links=document.getElementsByTagName("a");if(Array.prototype.map.call(links,function(e){e.host!=document.location.host&&e.addEventListener("click",function(){var a=e.getAttribute("data-md-action")||"follow";ga("send","event","outbound",a,e.href)})}),document.forms.search){var query=document.forms.search.query;query.addEventListener("blur",function(){if(this.value){var e=document.location.pathname;ga("send","pageview",e+"?q="+this.value)}})}</script>
</body>
</html>
Reference in New Issue View Git Blame Copy Permalink