https://socket.io/assets/js/4d1f7f88.6e4ad2cb.js

1"use strict";(self.webpackChunksample_website=self.webpackChunksample_website||[]).push([[825],{3905:(e,t,n)=>{n.d(t,{Zo:()=>p,kt:()=>h});var o=n(7294);function i(e,t,n){return t in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function r(e,t){var n=Object.keys(e);if(Object.getOwnPropertySymbols){var o=Object.getOwnPropertySymbols(e);t&&(o=o.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,o)}return n}function a(e){for(var t=1;t<arguments.length;t++){var n=null!=arguments[t]?arguments[t]:{};t%2?r(Object(n),!0).forEach((function(t){i(e,t,n[t])})):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(n)):r(Object(n)).forEach((function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(n,t))}))}return e}function s(e,t){if(null==e)return{};var n,o,i=function(e,t){if(null==e)return{};var n,o,i={},r=Object.keys(e);for(o=0;o<r.length;o++)n=r[o],t.indexOf(n)>=0||(i[n]=e[n]);return i}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(o=0;o<r.length;o++)n=r[o],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(i[n]=e[n])}return i}var l=o.createContext({}),c=function(e){var t=o.useContext(l),n=t;return e&&(n="function"==typeof e?e(t):a(a({},t),e)),n},p=function(e){var t=c(e.components);return o.createElement(l.Provider,{value:t},e.children)},u="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return o.createElement(o.Fragment,{},t)}},k=o.forwardRef((function(e,t){var n=e.components,i=e.mdxType,r=e.originalType,l=e.parentName,p=s(e,["components","mdxType","originalType","parentName"]),u=c(n),k=i,h=u["".concat(l,".").concat(k)]||u[k]||d[k]||r;return n?o.createElement(h,a(a({ref:t},p),{},{components:n})):o.createElement(h,a({ref:t},p))}));function h(e,t){var n=arguments,i=t&&t.mdxType;if("string"==typeof e||i){var r=n.length,a=new Array(r);a[0]=k;var s={};for(var l in t)hasOwnProperty.call(t,l)&&(s[l]=t[l]);s.originalType=e,s[u]="string"==typeof e?e:i,a[1]=s;for(var c=2;c<r;c++)a[c]=n[c];return o.createElement.apply(null,a)}return o.createElement.apply(null,n)}k.displayName="MDXCreateElement"},4981:(e,t,n)=>{n.r(t),n.d(t,{contentTitle:()=>a,default:()=>u,frontMatter:()=>r,metadata:()=>s,toc:()=>l});var o=n(3117),i=(n(7294),n(3905));const r={title:"How to deal with cookies"},a="How to deal with cookies",s={type:"mdx",permalink:"/how-to/deal-with-cookies",source:"@site/src/pages/how-to/deal-with-cookies.md",title:"How to deal with cookies",description:"Cookie-based sticky session",frontMatter:{title:"How to deal with cookies"}},l=[{value:"Cookie-based sticky session",id:"cookie-based-sticky-session",level:2},{value:"Application cookies",id:"application-cookies",level:2},{value:"Node.js client and cookies",id:"nodejs-client-and-cookies",level:2}],c={toc:l},p="wrapper";

1function u(e){let{components:t,...n}=e;return(0,i.kt)(p,(0,o.Z)({},c,n,{components:t,mdxType:"MDXLayout"}),(0,i.kt)("h1",{id:"how-to-deal-with-cookies"},"How to deal with cookies"),(0,i.kt)("h2",{id:"cookie-based-sticky-session"},"Cookie-based sticky session"),(0,i.kt)("p",null,"When using the ",(0,i.kt)("a",{parentName:"p",href:"/docs/v4/server-options/#cookie"},(0,i.kt)("inlineCode",{parentName:"a"},"cookie"))," option, the server will send a cookie upon handshake (the first HTTP request of the session), with the value of the Engine.IO session ID."),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-js"},'const io = new Server(httpServer, {\n  cookie: true\n});\n\n// is similar to\n\nconst io = new Server(httpServer, {\n  cookie: {\n    name: "io",\n    path: "/",\n    httpOnly: true,\n    sameSite: "lax"\n  }\n});\n')),(0,i.kt)("p",null,"You can test it with a ",(0,i.kt)("inlineCode",{parentName:"p"},"curl"),":"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre"},'$ curl "https://mydomain.com/socket.io/?EIO=4&transport=polling" -v\n< HTTP/1.1 200 OK\n< Content-Type: text/plain; charset=UTF-8\n< Content-Length: 97\n< Set-Cookie: io=G4J3Ci0cNDWd_Fz-AAAC; Path=/; HttpOnly; SameSite=Lax\n<\n0{"sid":"G4J3Ci0cNDWd_Fz-AAAC","upgrades":["websocket"],"pingInterval":25000,"pingTimeout":20000}\n')),(0,i.kt)("p",null,"Available options (from the ",(0,i.kt)("a",{parentName:"p",href:"https://github.com/jshttp/cookie/"},(0,i.kt)("inlineCode",{parentName:"a"},"cookie"))," package):"),(0,i.kt)("ul",null,(0,i.kt)("li",{parentName:"ul"},"domain"),(0,i.kt)("li",{parentName:"ul"},"encode"),(0,i.kt)("li",{parentName:"ul"},"expires"),(0,i.kt)("li",{parentName:"ul"},"httpOnly"),(0,i.kt)("li",{parentName:"ul"},"maxAge"),(0,i.kt)("li",{parentName:"ul"},"path"),(0,i.kt)("li",{parentName:"ul"},"sameSite"),(0,i.kt)("li",{parentName:"ul"},"secure")),(0,i.kt)("p",null,"This cookie can then be used for cookie-based sticky session, when scaling to multiple nodes (example with HAProxy ",(0,i.kt)("a",{parentName:"p",href:"/docs/v4/using-multiple-nodes/#haproxy-configuration"},"here"),")."),(0,i.kt)("h2",{id:"application-cookies"},"Application cookies"),(0,i.kt)("p",null,"You can also customize the headers sent by the server:"),(0,i.kt)("pre",null,(0,i.kt)("code",{parentName:"pre",className:"language-js"},'import { serialize, parse } from "cookie";\n\n// called during the handshake\nio.engine.on("initial_headers", (headers, request) => {\n  headers["set-cookie"] = serialize("uid", "1234", { sameSite: "strict" });\n});\n\n// called for each HTTP request (including the WebSocket upgrade)\nio.engine.on("headers", (headers, request) => {\n  if (!request.headers.cookie) return;\n  const cookies = parse(request.headers.cookie);\n  if (!cookies.randomId) {\n    headers["set-cookie"] = serialize("randomId", "abc", { maxAge: 8

16400 });\n  }\n});\n')),(0,i.kt)("admonition",{type:"caution"},(0,i.kt)("p",{parentName:"admonition"},"Please note that event emitters are synchronous:"),(0,i.kt)("pre",{parentName:"admonition"},(0,i.kt)("code",{parentName:"pre",className:"language-js"},'io.engine.on("initial_headers", async (headers, request) => {\n  // WARNING! this won\'t work\n  const session = await fetchSession(request);\n  headers["set-cookie"] = serialize("sid", session.id, { sameSite: "strict" });\n});\n')),(0,i.kt)("p",{parentName:"admonition"},"If you need to do some async operations, you will need to use the ",(0,i.kt)("a",{parentName:"p",href:"/docs/v4/server-options/#allowrequest"},(0,i.kt)("inlineCode",{parentName:"a"},"allowRequest"))," option."),(0,i.kt)("p",{parentName:"admonition"},"Please check ",(0,i.kt)("a",{parentName:"p",href:"/how-to/use-with-express-session"},"this example")," with ",(0,i.kt)("inlineCode",{parentName:"p"},"express-session")," for reference.")),(0,i.kt)("h2",{id:"nodejs-client-and-cookies"},"Node.js client and cookies"),(0,i.kt)("p",null,"Starting with version ",(0,i.kt)("inlineCode",{parentName:"p"},"4.7.0"),", when setting the ",(0,i.kt)("inlineCode",{parentName:"p"},"withCredentials")," option to ",(0,i.kt)("inlineCode",{parentName:"p"},"true"),", the Node.js client will now include the cookies in the HTTP requests, making it easier to use it with cookie-based sticky sessions."))}u.isMDXComponent=!0}}]);