refactor: replace localStorage with HTTP-only cookies for auth tokens (#24365)

Signed-off-by: NeatGuyCoding <15627489+NeatGuyCoding@users.noreply.github.com>
Signed-off-by: lyzno1 <yuanyouhuilyz@gmail.com>
Signed-off-by: kenwoodjw <blackxin55+@gmail.com>
Co-authored-by: Copilot Autofix powered by AI <62310815+github-advanced-security[bot]@users.noreply.github.com>
Co-authored-by: autofix-ci[bot] <114827586+autofix-ci[bot]@users.noreply.github.com>
Co-authored-by: Yunlu Wen <wylswz@163.com>
Co-authored-by: Joel <iamjoel007@gmail.com>
Co-authored-by: GareArc <chen4851@purdue.edu>
Co-authored-by: NFish <douxc512@gmail.com>
Co-authored-by: Davide Delbianco <davide.delbianco@outlook.com>
Co-authored-by: minglu7 <1347866672@qq.com>
Co-authored-by: Ponder <ruan.lj@foxmail.com>
Co-authored-by: crazywoola <100913391+crazywoola@users.noreply.github.com>
Co-authored-by: gemini-code-assist[bot] <176961590+gemini-code-assist[bot]@users.noreply.github.com>
Co-authored-by: heyszt <270985384@qq.com>
Co-authored-by: Asuka Minato <i@asukaminato.eu.org>
Co-authored-by: Guangdong Liu <liugddx@gmail.com>
Co-authored-by: Eric Guo <eric.guocz@gmail.com>
Co-authored-by: NeatGuyCoding <15627489+NeatGuyCoding@users.noreply.github.com>
Co-authored-by: XlKsyt <caixuesen@outlook.com>
Co-authored-by: Dhruv Gorasiya <80987415+DhruvGorasiya@users.noreply.github.com>
Co-authored-by: crazywoola <427733928@qq.com>
Co-authored-by: github-actions[bot] <41898282+github-actions[bot]@users.noreply.github.com>
Co-authored-by: lyzno1 <92089059+lyzno1@users.noreply.github.com>
Co-authored-by: hj24 <mambahj24@gmail.com>
Co-authored-by: GuanMu <ballmanjq@gmail.com>
Co-authored-by: 非法操作 <hjlarry@163.com>
Co-authored-by: Copilot <175728472+Copilot@users.noreply.github.com>
Co-authored-by: Tonlo <123lzs123@gmail.com>
Co-authored-by: Yusuke Yamada <yamachu.dev@gmail.com>
Co-authored-by: Novice <novice12185727@gmail.com>
Co-authored-by: kenwoodjw <blackxin55+@gmail.com>
Co-authored-by: Ademílson Tonato <ademilsonft@outlook.com>
Co-authored-by: znn <jubinkumarsoni@gmail.com>
Co-authored-by: yangzheli <43645580+yangzheli@users.noreply.github.com>

web/app/components/app/app-access-control/access-control-dialog.tsx

@@ -22,7 +22,7 @@ const AccessControlDialog = ({
   }, [onClose])
   return (
     <Transition appear show={show} as={Fragment}>
-      <Dialog as="div" open={true} className="relative z-20" onClose={() => null}>
+      <Dialog as="div" open={true} className="relative z-[99]" onClose={() => null}>
         <Transition.Child
           as={Fragment}
           enter="ease-out duration-300"
@@ -32,7 +32,7 @@ const AccessControlDialog = ({
           leaveFrom="opacity-100"
           leaveTo="opacity-0"
         >
-          <div className="bg-background-overlay/25 fixed inset-0" />
+          <div className="fixed inset-0 bg-background-overlay" />
         </Transition.Child>
 
         <div className="fixed inset-0 flex items-center justify-center">

web/app/components/app/app-access-control/add-member-or-group-pop.tsx

@@ -52,7 +52,7 @@ export default function AddMemberOrGroupDialog() {
       </Button>
     </PortalToFollowElemTrigger>
     {open && <FloatingOverlay />}
-    <PortalToFollowElemContent className='z-[25]'>
+    <PortalToFollowElemContent className='z-[100]'>
       <div className='relative flex max-h-[400px] w-[400px] flex-col overflow-y-auto rounded-xl border-[0.5px] border-components-panel-border bg-components-panel-bg-blur shadow-lg backdrop-blur-[5px]'>
         <div className='sticky top-0 z-10 bg-components-panel-bg-blur p-2 pb-0.5 backdrop-blur-[5px]'>
           <Input value={keyword} onChange={handleKeywordChange} showLeftIcon placeholder={t('app.accessControlDialog.operateGroupAndMember.searchPlaceholder') as string} />

web/app/components/base/chat/chat-with-history/index.tsx

@@ -4,7 +4,6 @@ import {
   useEffect,
   useState,
 } from 'react'
-import { useAsyncEffect } from 'ahooks'
 import { useThemeContext } from '../embedded-chatbot/theme/theme-context'
 import {
   ChatWithHistoryContext,
@@ -18,8 +17,6 @@ import ChatWrapper from './chat-wrapper'
 import type { InstalledApp } from '@/models/explore'
 import Loading from '@/app/components/base/loading'
 import useBreakpoints, { MediaType } from '@/hooks/use-breakpoints'
-import { checkOrSetAccessToken } from '@/app/components/share/utils'
-import AppUnavailable from '@/app/components/base/app-unavailable'
 import cn from '@/utils/classnames'
 import useDocumentTitle from '@/hooks/use-document-title'
 
@@ -201,36 +198,6 @@ const ChatWithHistoryWrapWithCheckToken: FC<ChatWithHistoryWrapProps> = ({
   installedAppInfo,
   className,
 }) => {
-  const [initialized, setInitialized] = useState(false)
-  const [appUnavailable, setAppUnavailable] = useState<boolean>(false)
-  const [isUnknownReason, setIsUnknownReason] = useState<boolean>(false)
-
-  useAsyncEffect(async () => {
-    if (!initialized) {
-      if (!installedAppInfo) {
-        try {
-          await checkOrSetAccessToken()
-        }
-        catch (e: any) {
-          if (e.status === 404) {
-            setAppUnavailable(true)
-          }
-          else {
-            setIsUnknownReason(true)
-            setAppUnavailable(true)
-          }
-        }
-      }
-      setInitialized(true)
-    }
-  }, [])
-
-  if (!initialized)
-    return null
-
-  if (appUnavailable)
-    return <AppUnavailable isUnknownReason={isUnknownReason} />
-
   return (
     <ChatWithHistoryWrap
       installedAppInfo={installedAppInfo}

web/app/components/header/account-dropdown/index.tsx

@@ -25,7 +25,6 @@ import Compliance from './compliance'
 import PremiumBadge from '@/app/components/base/premium-badge'
 import Avatar from '@/app/components/base/avatar'
 import ThemeSwitcher from '@/app/components/base/theme-switcher'
-import { logout } from '@/service/common'
 import { useAppContext } from '@/context/app-context'
 import { useProviderContext } from '@/context/provider-context'
 import { useModalContext } from '@/context/modal-context'
@@ -33,6 +32,7 @@ import { IS_CLOUD_EDITION } from '@/config'
 import cn from '@/utils/classnames'
 import { useGlobalPublicStore } from '@/context/global-public-context'
 import { useDocLink } from '@/context/i18n'
+import { useLogout } from '@/service/use-common'
 
 export default function AppSelector() {
   const itemClassName = `
@@ -49,15 +49,12 @@ export default function AppSelector() {
   const { isEducationAccount } = useProviderContext()
   const { setShowAccountSettingModal } = useModalContext()
 
+  const { mutateAsync: logout } = useLogout()
   const handleLogout = async () => {
-    await logout({
-      url: '/logout',
-      params: {},
-    })
+    await logout()
 
     localStorage.removeItem('setup_status')
-    localStorage.removeItem('console_token')
-    localStorage.removeItem('refresh_token')
+    // Tokens are now stored in cookies and cleared by backend
 
     // To avoid use other account's education notice info
     localStorage.removeItem('education-reverify-prev-expire-at')

web/app/components/rag-pipeline/hooks/use-nodes-sync-draft.ts

@@ -77,7 +77,7 @@ export const useNodesSyncDraft = () => {
 
     if (postParams) {
       navigator.sendBeacon(
-        `${API_PREFIX}${postParams.url}?_token=${localStorage.getItem('console_token')}`,
+        `${API_PREFIX}${postParams.url}`,
         JSON.stringify(postParams.params),
       )
     }

web/app/components/share/text-generation/menu-dropdown.tsx

@@ -20,6 +20,7 @@ import type { SiteInfo } from '@/models/share'
 import cn from '@/utils/classnames'
 import { AccessMode } from '@/models/access-control'
 import { useWebAppStore } from '@/context/web-app-context'
+import { webAppLogout } from '@/service/webapp-auth'
 
 type Props = {
   data?: SiteInfo
@@ -49,11 +50,11 @@ const MenuDropdown: FC<Props> = ({
     setOpen(!openRef.current)
   }, [setOpen])
 
-  const handleLogout = useCallback(() => {
-    localStorage.removeItem('token')
-    localStorage.removeItem('webapp_access_token')
+  const shareCode = useWebAppStore(s => s.shareCode)
+  const handleLogout = useCallback(async () => {
+    await webAppLogout(shareCode!)
     router.replace(`/webapp-signin?redirect_url=${pathname}`)
-  }, [router, pathname])
+  }, [router, pathname, webAppLogout, shareCode])
 
   const [show, setShow] = useState(false)
 

web/app/components/share/utils.ts

@@ -1,7 +1,3 @@
-import { CONVERSATION_ID_INFO } from '../base/chat/constants'
-import { fetchAccessToken } from '@/service/share'
-import { getProcessedSystemVariablesFromUrlParams } from '../base/chat/utils'
-
 export const isTokenV1 = (token: Record<string, any>) => {
   return !token.version
 }
@@ -9,55 +5,3 @@ export const isTokenV1 = (token: Record<string, any>) => {
 export const getInitialTokenV2 = (): Record<string, any> => ({
   version: 2,
 })
-
-export const checkOrSetAccessToken = async (appCode?: string | null) => {
-  const sharedToken = appCode || globalThis.location.pathname.split('/').slice(-1)[0]
-  const userId = (await getProcessedSystemVariablesFromUrlParams()).user_id
-  const accessToken = localStorage.getItem('token') || JSON.stringify(getInitialTokenV2())
-  let accessTokenJson = getInitialTokenV2()
-  try {
-    accessTokenJson = JSON.parse(accessToken)
-    if (isTokenV1(accessTokenJson))
-      accessTokenJson = getInitialTokenV2()
-  }
-  catch {
-
-  }
-
-  if (!accessTokenJson[sharedToken]?.[userId || 'DEFAULT']) {
-    const webAppAccessToken = localStorage.getItem('webapp_access_token')
-    const res = await fetchAccessToken({ appCode: sharedToken, userId, webAppAccessToken })
-    accessTokenJson[sharedToken] = {
-      ...accessTokenJson[sharedToken],
-      [userId || 'DEFAULT']: res.access_token,
-    }
-    localStorage.setItem('token', JSON.stringify(accessTokenJson))
-    localStorage.removeItem(CONVERSATION_ID_INFO)
-  }
-}
-
-export const setAccessToken = (sharedToken: string, token: string, user_id?: string) => {
-  const accessToken = localStorage.getItem('token') || JSON.stringify(getInitialTokenV2())
-  let accessTokenJson = getInitialTokenV2()
-  try {
-    accessTokenJson = JSON.parse(accessToken)
-    if (isTokenV1(accessTokenJson))
-      accessTokenJson = getInitialTokenV2()
-  }
-  catch {
-
-  }
-
-  localStorage.removeItem(CONVERSATION_ID_INFO)
-
-  accessTokenJson[sharedToken] = {
-    ...accessTokenJson[sharedToken],
-    [user_id || 'DEFAULT']: token,
-  }
-  localStorage.setItem('token', JSON.stringify(accessTokenJson))
-}
-
-export const removeAccessToken = () => {
-  localStorage.removeItem('token')
-  localStorage.removeItem('webapp_access_token')
-}

web/app/components/swr-initializer.tsx

@@ -19,10 +19,7 @@ const SwrInitializer = ({
 }: SwrInitializerProps) => {
   const router = useRouter()
   const searchParams = useSearchParams()
-  const consoleToken = decodeURIComponent(searchParams.get('access_token') || '')
-  const refreshToken = decodeURIComponent(searchParams.get('refresh_token') || '')
-  const consoleTokenFromLocalStorage = localStorage?.getItem('console_token')
-  const refreshTokenFromLocalStorage = localStorage?.getItem('refresh_token')
+  // Tokens are now stored in cookies, no need to check localStorage
   const pathname = usePathname()
   const [init, setInit] = useState(false)
 
@@ -57,21 +54,12 @@ const SwrInitializer = ({
           router.replace('/install')
           return
         }
-        if (!((consoleToken && refreshToken) || (consoleTokenFromLocalStorage && refreshTokenFromLocalStorage))) {
-          router.replace('/signin')
-          return
-        }
-        if (searchParams.has('access_token') || searchParams.has('refresh_token')) {
-          if (consoleToken)
-            localStorage.setItem('console_token', consoleToken)
-          if (refreshToken)
-            localStorage.setItem('refresh_token', refreshToken)
-          const redirectUrl = resolvePostLoginRedirect(searchParams)
-          if (redirectUrl)
-            location.replace(redirectUrl)
-          else
-            router.replace(pathname)
-        }
+
+        const redirectUrl = resolvePostLoginRedirect(searchParams)
+        if (redirectUrl)
+          location.replace(redirectUrl)
+        else
+          router.replace(pathname)
 
         setInit(true)
       }
@@ -79,7 +67,7 @@ const SwrInitializer = ({
         router.replace('/signin')
       }
     })()
-  }, [isSetupFinished, router, pathname, searchParams, consoleToken, refreshToken, consoleTokenFromLocalStorage, refreshTokenFromLocalStorage])
+  }, [isSetupFinished, router, pathname, searchParams])
 
   return init
     ? (

web/app/components/workflow-app/hooks/use-nodes-sync-draft.ts

@@ -97,7 +97,7 @@ export const useNodesSyncDraft = () => {
 
     if (postParams) {
       navigator.sendBeacon(
-        `${API_PREFIX}/apps/${params.appId}/workflows/draft?_token=${localStorage.getItem('console_token')}`,
+        `${API_PREFIX}/apps/${params.appId}/workflows/draft`,
         JSON.stringify(postParams.params),
       )
     }