docs.waku.org/assets/js/e610d71e.365aa55a.js

"use strict";(self.webpackChunkwaku_guide=self.webpackChunkwaku_guide||[]).push([[617],{3905:(e,t,n)=>{n.d(t,{Zo:()=>c,kt:()=>m});var a=n(67294);function o(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 a=Object.getOwnPropertySymbols(e);t&&(a=a.filter((function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable}))),n.push.apply(n,a)}return n}function i(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){o(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 l(e,t){if(null==e)return{};var n,a,o=function(e,t){if(null==e)return{};var n,a,o={},r=Object.keys(e);for(a=0;a<r.length;a++)n=r[a],t.indexOf(n)>=0||(o[n]=e[n]);return o}(e,t);if(Object.getOwnPropertySymbols){var r=Object.getOwnPropertySymbols(e);for(a=0;a<r.length;a++)n=r[a],t.indexOf(n)>=0||Object.prototype.propertyIsEnumerable.call(e,n)&&(o[n]=e[n])}return o}var s=a.createContext({}),p=function(e){var t=a.useContext(s),n=t;return e&&(n="function"==typeof e?e(t):i(i({},t),e)),n},c=function(e){var t=p(e.components);return a.createElement(s.Provider,{value:t},e.children)},u="mdxType",d={inlineCode:"code",wrapper:function(e){var t=e.children;return a.createElement(a.Fragment,{},t)}},k=a.forwardRef((function(e,t){var n=e.components,o=e.mdxType,r=e.originalType,s=e.parentName,c=l(e,["components","mdxType","originalType","parentName"]),u=p(n),k=o,m=u["".concat(s,".").concat(k)]||u[k]||d[k]||r;return n?a.createElement(m,i(i({ref:t},c),{},{components:n})):a.createElement(m,i({ref:t},c))}));function m(e,t){var n=arguments,o=t&&t.mdxType;if("string"==typeof e||o){var r=n.length,i=new Array(r);i[0]=k;var l={};for(var s in t)hasOwnProperty.call(t,s)&&(l[s]=t[s]);l.originalType=e,l[u]="string"==typeof e?e:o,i[1]=l;for(var p=2;p<r;p++)i[p]=n[p];return a.createElement.apply(null,i)}return a.createElement.apply(null,n)}k.displayName="MDXCreateElement"},92247:(e,t,n)=>{n.r(t),n.d(t,{assets:()=>s,contentTitle:()=>i,default:()=>d,frontMatter:()=>r,metadata:()=>l,toc:()=>p});var a=n(87462),o=(n(67294),n(3905));const r={title:"Debug Your Waku DApp and WebSocket",hide_table_of_contents:!0},i=void 0,l={unversionedId:"guides/js-waku/debug-waku-dapp",id:"guides/js-waku/debug-waku-dapp",title:"Debug Your Waku DApp and WebSocket",description:"This guide provides detailed steps to enable and use debug logs to troubleshoot your Waku DApp, whether in a NodeJS or browser environment and check your WebSocket connections in nwaku.",source:"@site/docs/guides/js-waku/debug-waku-dapp.md",sourceDirName:"guides/js-waku",slug:"/guides/js-waku/debug-waku-dapp",permalink:"/guides/js-waku/debug-waku-dapp",draft:!1,editUrl:"https://github.com/waku-org/docs.waku.org/tree/develop/docs/guides/js-waku/debug-waku-dapp.md",tags:[],version:"current",lastUpdatedAt:1700737292,formattedLastUpdatedAt:"23 Nov 2023",frontMatter:{title:"Debug Your Waku DApp and WebSocket",hide_table_of_contents:!0},sidebar:"guides",previous:{title:"Run @waku/sdk in a NodeJS Application",permalink:"/guides/js-waku/run-waku-nodejs"},next:{title:"Manage Your Filter Subscriptions",permalink:"/guides/js-waku/manage-filter"}},s={},p=[{value:"Enabling debug logs",id:"enabling-debug-logs",level:2},{value:"NodeJS environments",id:"nodejs-environments",level:3},{value:"Browser environments",id:"browser-environments",level:3},{value:"Checking WebSocket setup",id:"checking-websocket-setup",level:2},{value:"Try Websocat for connection",id:"try-websocat-for-connection",level:3},{value:"Check certificate validity",id:"check-certificate-validity",level:3},{value:"Check WebSocket port accessibility",id:"check-websocket-port-accessibility",level:3}],c={toc:p},u="wrapper";function d(e){let{components:t,...n}=e;return(0,o.kt)(u,(0,a.Z)({},c,n,{components:t,mdxType:"MDXLayout"}),(0,o.kt)("p",null,"This guide provides detailed steps to enable and use debug logs to troubleshoot your Waku DApp, whether in a NodeJS or browser environment and check your WebSocket connections in ",(0,o.kt)("a",{parentName:"p",href:"/guides/nwaku/run-node"},"nwaku"),"."),(0,o.kt)("h2",{id:"enabling-debug-logs"},"Enabling debug logs"),(0,o.kt)("p",null,"When resolving issues in your Waku DApp, debug logs can be helpful. The ",(0,o.kt)("inlineCode",{parentName:"p"},"@waku/sdk")," and ",(0,o.kt)("inlineCode",{parentName:"p"},"libp2p")," packages use the debug tool to handle and show logs that help you debug effectively."),(0,o.kt)("h3",{id:"nodejs-environments"},"NodeJS environments"),(0,o.kt)("p",null,"To enable debug logs for ",(0,o.kt)("inlineCode",{parentName:"p"},"@waku/sdk")," on NodeJS, you must set the ",(0,o.kt)("inlineCode",{parentName:"p"},"DEBUG")," environment variable. To only enable debug logs for ",(0,o.kt)("inlineCode",{parentName:"p"},"@waku/sdk"),":"),(0,o.kt)("pre",null,(0,o.kt)("code",{parentName:"pre",className:"language-shell"},"export DEBUG=waku*\n")),(0,o.kt)("p",null,"To enable debug logs for both ",(0,o.kt)("inlineCode",{parentName:"p"},"@waku/sdk")," and ",(0,o.kt)("inlineCode",{parentName:"p"},"libp2p"),":"),(0,o.kt)("pre",null,(0,o.kt)("code",{parentName:"pre",className:"language-shell"},"export DEBUG=waku*,libp2p*\n")),(0,o.kt)("p",null,"To enable debug logs for all components:"),(0,o.kt)("pre",null,(0,o.kt)("code",{parentName:"pre",className:"language-shell"},"export DEBUG=*\n")),(0,o.kt)("h3",{id:"browser-environments"},"Browser environments"),(0,o.kt)("p",null,"To view debug logs in your browser's console, modify the local storage and add the ",(0,o.kt)("inlineCode",{parentName:"p"},"debug")," key. Here are guides for various modern browsers:"),(0,o.kt)("ul",null,(0,o.kt)("li",{parentName:"ul"},(0,o.kt)("a",{parentName:"li",href:"https://developer.chrome.com/docs/devtools/storage/localstorage/"},"Google Chrome")),(0,o.kt)("li",{parentName:"ul"},(0,o.kt)("a",{parentName:"li",href:"https://firefox-source-docs.mozilla.org/devtools-user/storage_inspector/local_storage_session_storage/index.html"},"Firefox")),(0,o.kt)("li",{parentName:"ul"},(0,o.kt)("a",{parentName:"li",href:"https://developer.mozilla.org/en-US/docs/Web/API/Window/localStorage"},"JavaScript"))),(0,o.kt)("table",null,(0,o.kt)("thead",{parentName:"table"},(0,o.kt)("tr",{parentName:"thead"},(0,o.kt)("th",{parentName:"tr",align:null},"KEY"),(0,o.kt)("th",{parentName:"tr",align:null},"VALUE"),(0,o.kt)("th",{parentName:"tr",align:null},"DESCRIPTION"))),(0,o.kt)("tbody",{parentName:"table"},(0,o.kt)("tr",{parentName:"tbody"},(0,o.kt)("td",{parentName:"tr",align:null},(0,o.kt)("inlineCode",{parentName:"td"},"debug")),(0,o.kt)("td",{parentName:"tr",align:null},(0,o.kt)("inlineCode",{parentName:"td"},"waku*")),(0,o.kt)("td",{parentName:"tr",align:null},"Enables ",(0,o.kt)("inlineCode",{parentName:"td"},"@waku/sdk")," debug logs")),(0,o.kt)("tr",{parentName:"tbody"},(0,o.kt)("td",{parentName:"tr",align:null},(0,o.kt)("inlineCode",{parentName:"td"},"debug")),(0,o.kt)("td",{parentName:"tr",align:null},(0,o.kt)("inlineCode",{parentName:"td"},"waku*,libp2p*")),(0,o.kt)("td",{parentName:"tr",align:null},"Enables ",(0,o.kt)("inlineCode",{parentName:"td"},"@waku/sdk")," and ",(0,o.kt)("inlineCode",{parentName:"td"},"libp2p")," debug logs")),(0,o.kt)("tr",{parentName:"tbody"},(0,o.kt)("td",{parentName:"tr",align:null},(0,o.kt)("inlineCode",{parentName:"td"},"debug")),(0,o.kt)("td",{parentName:"tr",align:null},(0,o.kt)("inlineCode",{parentName:"td"},"*")),(0,o.kt)("td",{parentName:"tr",align:null},"Enables all debug logs")))),(0,o.kt)("h2",{id:"checking-websocket-setup"},"Checking WebSocket setup"),(0,o.kt)("p",null,(0,o.kt)("a",{parentName:"p",href:"/guides/nwaku/run-node"},"Nwaku")," provides native support for WebSocket (",(0,o.kt)("inlineCode",{parentName:"p"},"ws"),") and WebSocket Secure (",(0,o.kt)("inlineCode",{parentName:"p"},"wss"),") protocols. These are the only ",(0,o.kt)("a",{parentName:"p",href:"/learn/concepts/transports"},"transports")," supported for connecting to the Waku Network via browsers."),(0,o.kt)("p",null,"It's important to note that browsers impose certain limitations on WebSocket usage:"),(0,o.kt)("ul",null,(0,o.kt)("li",{parentName:"ul"},(0,o.kt)("strong",{parentName:"li"},"Secure Context Requirement"),": Insecure subroutines are prohibited in secure contexts. On an ",(0,o.kt)("inlineCode",{parentName:"li"},"https://")," webpage, only ",(0,o.kt)("inlineCode",{parentName:"li"},"wss")," connections are permitted, while ",(0,o.kt)("inlineCode",{parentName:"li"},"ws")," connections are not allowed. This restriction does not apply if the webpage is served locally, like on ",(0,o.kt)("inlineCode",{parentName:"li"},"localhost")," or ",(0,o.kt)("inlineCode",{parentName:"li"},"127.0.0.1"),"."),(0,o.kt)("li",{parentName:"ul"},(0,o.kt)("strong",{parentName:"li"},"Certificate Validation"),": Certificate validation rules are consistent for ",(0,o.kt)("inlineCode",{parentName:"li"},"https")," and ",(0,o.kt)("inlineCode",{parentName:"li"},"wss")," connections. Certificates must not be expired, issued by a recognized Certificate Authority (CA), and match the domain name, among other criteria."),(0,o.kt)("li",{parentName:"ul"},(0,o.kt)("strong",{parentName:"li"},"User Feedback on Errors"),": Web browsers do not display errors related to subroutines to the user. If a WebSocket connection encounters an issue, users won't be alerted directly; you'll need to check the browser's console for error details.")),(0,o.kt)("p",null,"If you encounter difficulties when connecting to a remote node using ",(0,o.kt)("inlineCode",{parentName:"p"},"wss"),", follow these steps:"),(0,o.kt)("h3",{id:"try-websocat-for-connection"},"Try Websocat for connection"),(0,o.kt)("p",null,"Attempt to connect using ",(0,o.kt)("a",{parentName:"p",href:"https://github.com/vi/websocat"},"websocat"),", a tool for WebSocket interactions. Test the WebSocket port using the command:"),(0,o.kt)("pre",null,(0,o.kt)("code",{parentName:"pre",className:"language-shell"},"websocat -v wss://[WEBSOCKET HOST]:[WEBSOCKET PORT]\n")),(0,o.kt)("p",null,"For example, consider a ",(0,o.kt)("inlineCode",{parentName:"p"},"nwaku")," node with the multiaddr as ",(0,o.kt)("inlineCode",{parentName:"p"},"/dns4/nwakunode.com/tcp/1234/wss/p2p/16..."),":"),(0,o.kt)("pre",null,(0,o.kt)("code",{parentName:"pre",className:"language-shell"},"$ websocat -v wss://nwakunode.com:1234\n# ...\n[INFO  websocat::ws_client_peer] Connected to ws\n")),(0,o.kt)("p",null,"The connection works if the ",(0,o.kt)("inlineCode",{parentName:"p"},"[INFO  websocat::ws_client_peer] Connected to ws")," log entry appears. If not, ",(0,o.kt)("a",{parentName:"p",href:"#check-certificate-validity"},"check that the certificate is valid")),(0,o.kt)("h3",{id:"check-certificate-validity"},"Check certificate validity"),(0,o.kt)("p",null,"Verify the certificate's validity by passing the ",(0,o.kt)("inlineCode",{parentName:"p"},"-k")," or ",(0,o.kt)("inlineCode",{parentName:"p"},"--insecure")," flag to handle invalid certificates in ",(0,o.kt)("inlineCode",{parentName:"p"},"websocat"),":"),(0,o.kt)("pre",null,(0,o.kt)("code",{parentName:"pre",className:"language-shell"},"websocat -v -k wss://nwakunode.com:1234\n")),(0,o.kt)("p",null,"If this works, the certificate's invalidity is the problem, and you should investigate the cause of the error if not, ",(0,o.kt)("a",{parentName:"p",href:"#check-websocket-port-accessibility"},"check if the WebSocket port is accessible"),"."),(0,o.kt)("h3",{id:"check-websocket-port-accessibility"},"Check WebSocket port accessibility"),(0,o.kt)("p",null,"Use ",(0,o.kt)("inlineCode",{parentName:"p"},"telnet")," or another networking tool to verify if the WebSocket port is open and accessible. For example, if the multiaddr is ",(0,o.kt)("inlineCode",{parentName:"p"},"/dns4/nwakunode.com/tcp/1234/wss/p2p/16..."),", use the command:"),(0,o.kt)("pre",null,(0,o.kt)("code",{parentName:"pre",className:"language-shell"},"$ telnet nwakunode.com 1234\nTrying 123.123.123.123...\nConnected to nwakunode.com.\n# ...\n")),(0,o.kt)("p",null,"If the connection succeeds, there might be an issue with ",(0,o.kt)("inlineCode",{parentName:"p"},"nwaku"),". Consider seeking support on the ",(0,o.kt)("a",{parentName:"p",href:"https://discord.waku.org"},"Waku Discord")," or ",(0,o.kt)("a",{parentName:"p",href:"https://github.com/waku-org/nwaku/issues/new"},"raise an issue"),". If the connection fails, ensure that the WebSocket port is open."))}d.isMDXComponent=!0}}]);