diff --git a/webapp/components/layout.tsx b/webapp/components/layout.tsx
index 6a20e16..7304008 100644
--- a/webapp/components/layout.tsx
+++ b/webapp/components/layout.tsx
@@ -46,6 +46,29 @@ export default function Layout(props: { meetingId: string }) {
     setMeetingJoined(false)
   }
 
+  useEffect(() => {
+    const cleanup = () => {
+      delStream(props.meetingId, localStreamId)
+    }
+    // NOTE:
+    // https://github.com/binbat/woom/pull/27
+    // https://developer.mozilla.org/en-US/docs/Web/API/Window/unload_event
+    // `unload` event is Deprecated, But Firefox need `unload`
+    //
+    // event                        | Chrome                    | Firefox                   | Safari
+    // ---------------------------- | ------------------------- | ------------------------- | -----
+    // `beforeunload`               | ok                        | console error, no request | console error, request ok
+    // `unload`                     | console error, no request | ok                        | console no request log, no request
+    // `beforeunload` + `keepalive` | ok                        | console error, no request | console error, request ok
+    // `unload` +  `keepalive`      | console error, request ok | ok                        | console no request log, request ok
+    window.addEventListener('beforeunload', cleanup)
+    window.addEventListener('unload', cleanup)
+    return () => {
+      window.removeEventListener('beforeunload', cleanup)
+      window.removeEventListener('unload', cleanup)
+    }
+  }, [props.meetingId, localStreamId])
+
   //useEffect(() => {
   //  let shareScreenId = ""
   //  const setShareScreenId = (id: string) => shareScreenId = id
diff --git a/webapp/lib/api.ts b/webapp/lib/api.ts
index 28b7171..78bf21a 100644
--- a/webapp/lib/api.ts
+++ b/webapp/lib/api.ts
@@ -114,6 +114,7 @@ async function delStream(roomId: string, streamId: string): Promise<any> {
       'Authorization': `Bearer ${token}`,
     },
     method: 'DELETE',
+    keepalive: true,
   })
 }