1"use strict";(globalThis.webpackChunkcloudbase_docs=globalThis.webpackChunkcloudbase_docs||[]).push([[32],{98716(e,n,s){s.r(n),s.d(n,{assets:()=>t,contentTitle:()=>r,default:()=>h,frontMatter:()=>d,metadata:()=>o,toc:()=>l});const o=JSON.parse('{"id":"recipes/add-auth-nextjs","title":"\u5728 Next.js \u4e2d\u63a5\u5165 CloudBase \u7528\u6237\u8ba4\u8bc1","description":"\u7528 @cloudbase/js-sdk \u5728 Next.js 14+ App Router \u91cc\u505a\u533f\u540d/\u624b\u673a\u53f7/\u5fae\u4fe1\u626b\u7801\u767b\u5f55,\u767b\u5f55\u6001\u7528 cookie \u5b58,Server Component \u901a\u8fc7 cookies() \u62ff\u8eab\u4efd,middleware \u62e6\u672a\u767b\u5f55\u8bf7\u6c42\u3002","source":"@site/docs/recipes/add-auth-nextjs.md","sourceDirName":"recipes","slug":"/recipes/add-auth-nextjs","permalink":"/recipes/add-auth-nextjs","draft":false,"unlisted":false,"editUrl":"https://git.woa.com/QBase/cloudbase-docs/edit/master/docs/recipes/add-auth-nextjs.md","tags":[{"inline":true,"label":"recipe","permalink":"/tags/recipe"},{"inline":true,"label":"nextjs","permalink":"/tags/nextjs"},{"inline":true,"label":"auth","permalink":"/tags/auth"},{"inline":true,"label":"add","permalink":"/tags/add"}],"version":"current","frontMatter":{"title":"\u5728 Next.js \u4e2d\u63a5\u5165 CloudBase \u7528\u6237\u8ba4\u8bc1","description":"\u7528 @cloudbase/js-sdk \u5728 Next.js 14+ App Router \u91cc\u505a\u533f\u540d/\u624b\u673a\u53f7/\u5fae\u4fe1\u626b\u7801\u767b\u5f55,\u767b\u5f55\u6001\u7528 cookie \u5b58,Server Component \u901a\u8fc7 cookies() \u62ff\u8eab\u4efd,middleware \u62e6\u672a\u767b\u5f55\u8bf7\u6c42\u3002","sidebar_label":"Next.js + CloudBase \u8ba4\u8bc1","tags":["recipe","nextjs","auth","add"],"keywords":["cloudbase","\u4e91\u5f00\u53d1","Next.js","App Router","\u7528\u6237\u8ba4\u8bc1","cookies","middleware","Server Component"]},"sidebar":"recipes","previous":{"title":"Resend \u90ae\u4ef6","permalink":"/recipes/connect-resend-email-cloud-function"},"next":{"title":"Next.js + \u4e91\u6570\u636e\u5e93","permalink":"/recipes/add-database-nextjs"}}');var c=s(74848),i=s(28453);const d={title:"\u5728 Next.js \u4e2d\u63a5\u5165 CloudBase \u7528\u6237\u8ba4\u8bc1",description:"\u7528 @cloudbase/js-sdk \u5728 Next.js 14+ App Router \u91cc\u505a\u533f\u540d/\u624b\u673a\u53f7/\u5fae\u4fe1\u626b\u7801\u767b\u5f55,\u767b\u5f55\u6001\u7528 cookie \u5b58,Server Component \u901a\u8fc7 cookies() \u62ff\u8eab\u4efd,middleware \u62e6\u672a\u767b\u5f55\u8bf7\u6c42\u3002",sidebar_label:"Next.js + CloudBase \u8ba4\u8bc1",tags:["recipe","nextjs","auth","add"],keywords:["cloudbase","\u4e91\u5f00\u53d1","Next.js","App Router","\u7528\u6237\u8ba4\u8bc1","cookies","middleware","Server Component"]},r="\u5728 Next.js \u4e2d\u63a5\u5165 CloudBase \u7528\u6237\u8ba4\u8bc1",t={},l=[{value:"\u9002\u7528\u573a\u666f",id:"\u9002\u7528\u573a\u666f",level:2},{value:"\u73af\u5883\u8981\u6c42",id:"\u73af\u5883\u8981\u6c42",level:2},{value:"\u7b2c\u4e00\u6b65.js \u9879\u76ee\u88c5 @cloudbase/js-sdk",id:"\u7b2c\u4e00\u6b65js-\u9879\u76ee\u88c5-cloudbasejs-sdk",level:2},{value:"\u7b2c\u4e8c\u6b65 Component \u5199\u767b\u5f55\u9875(\u77ed\u4fe1\u9a8c\u8bc1\u7801 + \u5fae\u4fe1\u626b\u7801)",id:"\u7b2c\u4e8c\u6b65-component-\u5199\u767b\u5f55\u9875\u77ed\u4fe1\u9a8c\u8bc1\u7801--\u5fae\u4fe1\u626b\u7801",level:2},{value:"\u7b2c\u4e09\u6b65:\u767b\u5f55\u6001\u7528 httpOnly cookie \u5b58(Server Action \u5199 cookie)",id:"\u7b2c\u4e09\u6b65\u767b\u5f55\u6001\u7528-httponly-cookie-\u5b58server-action-\u5199-cookie",level:2},{value:"\u7b2c\u56db\u6b65 Component \u901a\u8fc7 cookies() \u62ff\u8eab\u4efd",id:"\u7b2c\u56db\u6b65-component-\u901a\u8fc7-cookies-\u62ff\u8eab\u4efd",level:2},{value:"\u7b2c\u4e94\u6b65.ts \u62e6\u672a\u767b\u5f55\u8bf7\u6c42",id:"\u7b2c\u4e94\u6b65ts-\u62e6\u672a\u767b\u5f55\u8bf7\u6c42",level:2},{value:"\u7b2c\u516d\u6b65 Action \u8c03 CloudBase API(\u5199\u6570\u636e)",id:"\u7b2c\u516d\u6b65-action-\u8c03-cloudbase-api\u5199\u6570\u636e",level:2},{value:"\u9000\u51fa\u767b\u5f55",id:"\u9000\u51fa\u767b\u5f55",level:2},{value:"\u8fd0\u884c\u9a8c\u8bc1",id:"\u8fd0\u884c\u9a8c\u8bc1",level:2},{value:"\u5e38\u89c1\u9519\u8bef",id:"\u5e38\u89c1\u9519\u8bef",level:2},{value:"\u76f8\u5173\u6587\u6863",id:"\u76f8\u5173\u6587\u6863",level:2}];function a(e){const n={a:"a",admonition:"admonition",blockquote:"blockquote",code:"code",h1:"h1",h2:"h2",header:"header",li:"li",ol:"ol",p:"p",pre:"pre",strong:"strong",table:"table",tbody:"tbody",td:"td",th:"th",thead:"thead",tr:"tr",ul:"ul",...(0,i.R)(),...e.components};return(0,c.jsxs)(c.Fragment,{children:[(0,c.jsx)(n.header,{children:(0,c.jsx)(n.h1,{id:"\u5728-nextjs-\u4e2d\u63a5\u5165-cloudbase-\u7528\u6237\u8ba4\u8bc1",children:"\u5728 Next.js \u4e2d\u63a5\u5165 CloudBase \u7528\u6237\u8ba4\u8bc1"})}),"\n",(0,c.jsxs)(n.blockquote,{children:["\n",(0,c.jsxs)(n.p,{children:["\u4e00\u53e5\u8bdd\u5b9a\u4e49:\u7528 ",(0,c.jsx)(n.code,{children:"@cloudbase/js-sdk"})," \u5728 Next.js 14+ App Router \u91cc\u505a\u624b\u673a\u77ed\u4fe1\u9a8c\u8bc1\u7801 / \u5fae\u4fe1\u5f00\u653e\u5e73\u53f0\u626b\u7801\u767b\u5f55,\u767b\u5f55\u6001\u7528 ",(0,c.jsx)(n.code,{children:"httpOnly"})," cookie \u5b58,Server Component \u901a\u8fc7 ",(0,c.jsx)(n.code,{children:"cookies()"})," \u62ff\u8eab\u4efd,middleware \u5728 Edge Runtime \u505a\u8f7b\u6821\u9a8c\u62e6\u672a\u767b\u5f55\u8bf7\u6c42,\u91cd\u4e1a\u52a1\u5728 ",(0,c.jsx)(n.code,{children:"runtime: 'nodejs'"})," \u7684 Route Handler \u91cc\u8dd1\u3002"]}),"\n",(0,c.jsx)(n.p,{children:"\u9884\u8ba1\u8017\u65f6:35 \u5206\u949f | \u96be\u5ea6:\u8fdb\u9636"}),"\n"]}),"\n",(0,c.jsx)(n.h2,{id:"\u9002\u7528\u573a\u666f",children:"\u9002\u7528\u573a\u666f"}),"\n",(0,c.jsxs)(n.ul,{children:["\n",(0,c.jsxs)(n.li,{children:["\u9002\u7528",":Next",".js 14 / 15 App Router \u5168\u6808\u5e94\u7528,SSR \u9875\u9762\u8981\u62ff\u7528\u6237\u8eab\u4efd\u505a\u4e2a\u6027\u5316\u6e32\u67d3"]}),"\n",(0,c.jsxs)(n.li,{children:["\u9002\u7528:\u5df2\u7ecf\u7528 ",(0,c.jsx)(n.a,{href:"./add-auth-web-with-cloudbase-sdk",children:"add-auth-web-with-cloudbase-sdk"})," \u7684 React SPA,\u60f3\u8fc1\u5230 Next.js \u62ff\u5230 SSR + middleware \u62e6\u622a\u80fd\u529b"]}),"\n",(0,c.jsx)(n.li,{children:"\u9002\u7528:\u7528 middleware \u505a\u672a\u767b\u5f55\u62e6\u622a / \u7070\u5ea6\u8def\u7531 / A-
1B \u5206\u6d41"}),"\n",(0,c.jsxs)(n.li,{children:["\u4e0d\u9002\u7528:\u7eaf Pages Router \u9879\u76ee,\u76f4\u63a5\u8d70 ",(0,c.jsx)(n.a,{href:"./add-auth-web-with-cloudbase-sdk",children:"add-auth-web-with-cloudbase-sdk"})," \u7684 SPA \u6a21\u677f\u5373\u53ef,Pages Router \u6ca1\u6709 Server Component / Server Action \u7684\u6982\u5ff5"]}),"\n",(0,c.jsxs)(n.li,{children:["\u4e0d\u9002\u7528:\u5728 Node.js \u7aef\u62ff admin \u7ea7\u767b\u5f55\u6001(\u90a3\u8981\u8d70 ",(0,c.jsx)(n.code,{children:"@cloudbase/node-sdk"})," \u7684 server token,\u4e0d\u662f\u672c\u7bc7\u8303\u7574)"]}),"\n"]}),"\n",(0,c.jsx)(n.h2,{id:"\u73af\u5883\u8981\u6c42",children:"\u73af\u5883\u8981\u6c42"}),"\n",(0,c.jsxs)(n.table,{children:[(0,c.jsx)(n.thead,{children:(0,c.jsxs)(n.tr,{children:[(0,c.jsx)(n.th,{children:"\u4f9d\u8d56"}),(0,c.jsx)(n.th,{children:"\u7248\u672c"})]})}),(0,c.jsxs)(n.tbody,{children:[(0,c.jsxs)(n.tr,{children:[(0,c.jsx)(n.td,{children:"Node.js"}),(0,c.jsxs)(n.td,{children:["\u2265 ",(0,c.jsx)(n.code,{children:"18.18.0"})]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsx)(n.td,{children:(0,c.jsx)(n.code,{children:"next"})}),(0,c.jsxs)(n.td,{children:[(0,c.jsx)(n.code,{children:"14.2.x"})," \u6216 ",(0,c.jsx)(n.code,{children:"15.x"})]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsx)(n.td,{children:(0,c.jsx)(n.code,{children:"@cloudbase/js-sdk"})}),(0,c.jsxs)(n.td,{children:[(0,c.jsx)(n.code,{children:"3.3.x"}),"\uff08latest\uff09\u6216 ",(0,c.jsx)(n.code,{children:"@cloudbase/js-sdk@v2"})," \u5373 ",(0,c.jsx)(n.code,{children:"2.28.x"})]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsxs)(n.td,{children:[(0,c.jsx)(n.code,{children:"react"})," / ",(0,c.jsx)(n.code,{children:"react-dom"})]}),(0,c.jsxs)(n.td,{children:[(0,c.jsx)(n.code,{children:"^18.3.0"}),"(Next.js 15 \u7528 ",(0,c.jsx)(n.code,{children:"^19.0.0"}),")"]})]})]})]}),"\n",(0,c.jsx)(n.p,{children:"\u5916\u90e8\u4f9d\u8d56:"}),"\n",(0,c.jsxs)(n.ul,{children:["\n",(0,c.jsxs)(n.li,{children:["\u5df2\u521b\u5efa\u7684 CloudBase \u73af\u5883 ID,",(0,c.jsx)(n.strong,{children:"\u5730\u57df\u9009\u300c\u4e0a\u6d77\u300d"}),"(\u77ed\u4fe1\u9a8c\u8bc1\u7801\u767b\u5f55\u4ec5\u652f\u6301\u4e0a\u6d77\u5730\u57df)"]}),"\n",(0,c.jsxs)(n.li,{children:["\u63a7\u5236\u53f0 \u2192 ",(0,c.jsx)(n.strong,{children:"\u8eab\u4efd\u8ba4\u8bc1 \u2192 \u767b\u5f55\u65b9\u5f0f"}),",\u628a\u8981\u7528\u7684\u65b9\u5f0f\u5f00\u542f:","\n",(0,c.jsxs)(n.ul,{children:["\n",(0,c.jsx)(n.li,{children:"\u300c\u77ed\u4fe1\u9a8c\u8bc1\u7801\u767b\u5f55\u300d"}),"\n",(0,c.jsxs)(n.li,{children:["\u300c\u5fae\u4fe1\u5f00\u653e\u5e73\u53f0\u767b\u5f55\u300d,\u586b\u5165 ",(0,c.jsx)(n.a,{href:"https://open.weixin.qq.com/",children:"\u5fae\u4fe1\u5f00\u653e\u5e73\u53f0"})," \u7f51\u7ad9\u5e94\u7528\u7684 AppID \u548c AppSecret"]}),"\n"]}),"\n"]}),"\n"]}),"\n",(0,c.jsx)(n.admonition,{title:"Next.js 15 cookies() \u662f async",type:"tip",children:(0,c.jsxs)(n.p,{children:["Next.js 15 \u628a ",(0,c.jsx)(n.code,{children:"cookies()"})," / ",(0,c.jsx)(n.code,{children:"headers()"})," / ",(0,c.jsx)(n.code,{children:"params"})," / ",(0,c.jsx)(n.code,{children:"searchParams"})," \u90fd\u6539\u6210\u4e86 async,\u5fc5\u987b ",(0,c.jsx)(n.code,{children:"await"})," \u518d\u7528\u3002Next.js 14 \u662f sync \u7684,\u6cbf\u7528\u65e7\u5199\u6cd5\u5373\u53ef\u3002\u672c\u7bc7\u6309 Next.js 15 \u5199,Next.js 14 \u628a ",(0,c.jsx)(n.code,{children:"await cookies()"})," \u6539\u6210 ",(0,c.jsx)(n.code,{children:"cookies()"})," \u5373\u53ef\u3002"]})}),"\n",(0,c.jsxs)(n.h2,{id:"\u7b2c\u4e00\u6b65js-\u9879\u76ee\u88c5-cloudbasejs-sdk",children:["\u7b2c\u4e00\u6b65",":Next",".js \u9879\u76ee\u88c5 @cloudbase/js-sdk"]}),"\n",(0,c.jsx)(n.pre,{children:(0,c.jsx)(n.code,{className:"language-bash",children:'npx create-next-app@latest my-cloudbase-app --typescript --app --tailwind=false --eslint --src-dir=false --import-alias="@/*"\ncd my-cloudbase-app\nnpm i @cloudbase/js-sdk\n'})}),"\n",(0,c.jsxs)(n.p,{children:["\u65b0\u5efa ",(0,c.jsx)(n.code,{children:"lib/cloudbase.ts"}),"(\u7eaf\u5ba2\u6237\u7aef\u7528,SDK \u7528\u4e86 ",(0,c.jsx)(n.code,{children:"crypto"})," / ",(0,c.jsx)(n.code,{children:"localStorage"}),"):"]}),"\n",(0,c.jsx)(n.pre,{children:(0,c.jsx)(n.code,{className:"language-ts",children:'"use client";\n\nimport cloudbase from "@cloudbase/js-sdk";\n\nexport const app = cloudbase.init({\n env: "your-env-id",\n // \u4e0d\u4f20 region \u9ed8\u8ba4\u4e0a\u6d77;\u77ed\u4fe1\u767b\u5f55\u53ea\u5728\u4e0a\u6d77\u652f\u6301\n});\n\nexport const auth = app.auth({ persistence: "local" });\n'})}),"\n",(0,c.jsxs)(n.h2,{id:"\u7b2c\u4e8c\u6b65-component-\u5199\u767b\u5f55\u9875\u77ed\u4fe1\u9a8c\u8bc1\u7801--\u5fae\u4fe1\u626b\u7801",children:["\u7b2c\u4e8c\u6b65",":Client"," Component \u5199\u767b\u5f55\u9875(\u77ed\u4fe1\u9a8c\u8bc1\u7801 + \u5fae\u4fe1\u626b\u7801)"]}),"\n",(0,c.jsxs)(n.p,{children:[(0,c.jsx)(n.code,{children:"app/login/page.tsx"}),"(\u6807 ",(0,c.jsx)(n.code,{children:"'use client'"})," \u56e0\u4e3a\u8981\u7528 SDK):"]}),"\n",(0,c.jsx)(n.pre,{children:(0,c.jsx)(n.code,{className:"language-tsx",children:'"use client";
1\n\nimport { useState } from "react";\nimport { useRouter } from "next/navigation";\nimport { auth } from "@/lib/cloudbase";\nimport { setSessionCookie } from "./actions";\n\nexport default function LoginPage() {\n const router = useRouter();\n const [phone, setPhone] = useState("");\n const [code, setCode] = useState("");\n const [verificationInfo, setVerificationInfo] = useState<any>(null);\n const [countdown, setCountdown] = useState(0);\n const [err, setErr] = useState("");\n\n const sendCode = async () => {\n setErr("");\n if (!/^\\+86\\s?\\d{11}$/.test(phone)) {\n setErr("\u624b\u673a\u53f7\u683c\u5f0f\u5e94\u4e3a +86 13800000000");\n return;\n }\n try {\n const info = await auth.getVerification({ phone_number: phone });\n setVerificationInfo(info);\n setCountdown(60);\n const t = setInterval(() => {\n setCountdown((c) => {\n if (c <= 1) {\n clearInterval(t);\n return 0;\n }\n return c - 1;\n });\n }, 1000);\n } catch (e: any) {\n setErr(e.message || "\u53d1\u9001\u5931\u8d25");\n }\n };\n\n const submit = async (e: React.FormEvent) => {\n e.preventDefault();\n setErr("");\n try {\n await auth.signInWithSms({\n verificationInfo,\n verificationCode: code,\n phoneNum: phone,\n });\n // \u767b\u5f55\u6210\u529f,\u62ff access token \u5199\u5230 httpOnly cookie\n const loginState = await auth.getLoginState();\n if (!loginState) throw new Error("\u767b\u5f55\u6001\u4e3a\u7a7a");\n await setSessionCookie(loginState.accessToken);\n router.push("/");\n } catch (e: any) {\n setErr(e.message || "\u767b\u5f55\u5931\u8d25");\n }\n };\n\n return (\n <form onSubmit={submit}>\n <input\n placeholder="+86 13800000000"\n value={phone}\n onChange={(e) => setPhone(e.target.value)}\n />\n <button type="button" onClick={sendCode} disabled={countdown > 0}>\n {countdown > 0 ? `${countdown}s \u540e\u91cd\u53d1` : "\u83b7\u53d6\u9a8c\u8bc1\u7801"}\n </button>\n <input\n placeholder="6 \u4f4d\u9a8c\u8bc1\u7801"\n value={code}\n onChange={(e) => setCode(e.target.value)}\n />\n <button type="submit">\u767b\u5f55</button>\n {err && <div style={{ color: "red" }}>{err}</div>}\n </form>\n );\n}\n'})}),"\n",(0,c.jsx)(n.p,{children:"\u8981\u70b9:"}),"\n",(0,c.jsxs)(n.ul,{children:["\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:"auth.signInWithSms"})," \u8d70\u7684\u662f\u300c",(0,c.jsx)(n.code,{children:"getVerification"})," \u2192 ",(0,c.jsx)(n.code,{children:"signInWithSms"}),"\u300d\u4e24\u6b65,",(0,c.jsx)(n.code,{children:"verificationInfo"})," \u662f ",(0,c.jsx)(n.code,{children:"getVerification"})," \u8fd4\u56de\u7684\u5bf9\u8c61,\u539f\u6837\u4f20\u56de\u53bb"]}),"\n",(0,c.jsxs)(n.li,{children:["\u5ba2\u6237\u7aef\u767b\u5f55\u6210\u529f\u540e,\u901a\u8fc7 Server Action ",(0,c.jsx)(n.code,{children:"setSessionCookie"})," \u628a ",(0,c.jsx)(n.code,{children:"accessToken"})," \u5199\u8fdb ",(0,c.jsx)(n.code,{children:"httpOnly"})," cookie,\u8fd9\u6837 Server Component \u548c middleware \u624d\u80fd\u62ff\u5230"]}),"\n",(0,c.jsxs)(n.li,{children:["\u5fae\u4fe1\u626b\u7801\u767b\u5f55\u8d70 OAuth \u8df3\u8f6c,\u6d41\u7a0b\u89c1 ",(0,c.jsx)(n.a,{href:"./add-auth-web-with-cloudbase-sdk",children:"add-auth-web-with-cloudbase-sdk"})," \u7b2c\u4e94\u6b65,\u5728 Next.js \u91cc\u53ea\u9700\u628a\u56de\u8c03\u9875\u6362\u6210 ",(0,c.jsx)(n.code,{children:"app/login/wechat-callback/page.tsx"})," \u5373\u53ef,\u903b\u8f91\u4e0d\u53d8"]}),"\n"]}),"\n",(0,c.jsx)(n.h2,{id:"\u7b2c\u4e09\u6b65\u767b\u5f55\u6001\u7528-httponly-cookie-\u5b58server-action-\u5199-cookie",children:"\u7b2c\u4e09\u6b65:\u767b\u5f55\u6001\u7528 httpOnly cookie \u5b58(Server Action \u5199 cookie)"}),"\n",(0,c.jsxs)(n.p,{children:[(0,c.jsx)(n.code,{children:"app/login/actions.ts"}),"(\u6807 ",(0,c.jsx)(n.code,{children:"'use server'"}),"):"]}),"\n",(0,c.jsx)(n.pre,{children:(0,c.jsx)(n.code,{className:"language-ts",children:'"use server";\n\nimport { cookies } from "next/headers";\n\nexport async function setSessionCookie(accessToken: string) {\n const cookieStore = await cookies();\n cookieStore.set("cloudbase_session", accessToken, {\n httpOnly: true,\n secure: process.env.NODE_ENV === "production",\n sameSite: "lax",\n path: "/",\n maxAge: 60 * 60 * 24 * 30, // 30 \u5929,\u548c SDK \u7684 persistence: \'local\' \u5bf9\u9f50\n });\n}\n\nexport async function clearSessionCookie() {\n const cookieStore = await cookies();\n cookieStore.delete("cloudbase_session");\n}\n'})}),"\n",(0,c.jsx)(n.p,{children:"\u8981\u70b9:"}),"\n",(0,c.jsxs)(n.ul,{children:["\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:"httpOnly: true"})," \u8ba9 JS \u8bfb\u4e0d\u5230 cookie,XSS \u62ff\u4e0d\u8d70 token"]}),"\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:"sameSite: 'lax'"})," \u662f\u9ed8\u8ba4\u63a8\u8350;",(0,c.jsxs)(n.strong,{children:["\u4e0d\u8981\u5199 ",(0,c.jsx)(n.code,{children:"'strict'"})]}),",\u8de8\u7ad9\u8df3\u8f6c(\u6bd4\u5982\u5fae\u4fe1\u626b\u7801\u56de\u8c03)\u5c31\u4e0d\u53d1 cookie \u4e86"]}),"\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:"secure: true"})," \u751f\u4ea7\u73af\u5883\u5fc5\u5f00,\u672c\u5730\u5f00\u53d1\u6539\u6210 ",(0,c.jsx)(n.code,{children:"process.env.NODE_ENV === 'production'"}),",\u672c\u5730 HTTP \u4e5f\u80fd\u7528"]}),"\n",(0,c.jsxs)(n.li,{children:["Server Component ",(0,c.jsxs)(n.strong,{children:["\u4e0d\u80fd\u76f4\u63a5 ",(0,c.jsx)(n.code,{children:"set"}),"/",(0,c.jsx)(n.code,{children:"delete"})," cookie"]}),",\u53ea\u80fd\u8bfb;\u5199\u64cd\u4f5c\u5fc5\u987b\u653e\u5728 Server Action \u6216 Route Handler \u91cc"]}),"\n"]}),"\n",(0,c.jsxs)(n.h2,{id:"\u7b2c\u56db\u6b65-component-\u901a\u8fc7-cookies-\u62ff\u8eab\u4efd",children:["\u7b2c\u56db\u6b65",":Server"," Component \u901a\u8fc7 cookies() \u62ff\u8eab\u4efd"]}),"\n",(0,c.jsxs)(n.p,{children:[(0,c.jsx)(n.code,{children:"app/page.tsx"}),"(\u9ed8\u8ba4\u5c31\u662f Server Component,",(0,c.jsx)(n.strong,{children:"\u4e0d\u8981"}),"\u52a0 ",(0,c.jsx)(n.code,{children:"'use client'"}),"):"]}),"\n",(0,c.jsx)(n.pre,{children:(0,c.jsx)(n.code,{className:"language-tsx",children:'import { cookies } from "next/headers";\nimport { redirect } from "next/navigation";\n\nexport default async function HomePage() {\n const cookieStore = await cookies(); // Next.js 15 \u5fc5\u987b await\n const accessToken = cookieStore.get("cloudbase_session")?.value;\n\n if (!accessToken) {\n redirect("/login");\n }\n\n // \u8fd9\u91cc\u5982\u679c\u53ea\u9700\u8981\u5c55\u793a\u300c\u5df2\u767b\u5f55\u300d\u72b6\u6001,\u6709 cookie \u5c31\u591f\u4e86\n // \u8981\u62ff\u7528\u6237\u8be6\u7ec6\u4fe1\u606f,\u901a\u8fc7 Route Handler \u8c03 CloudBase \u670d\u52a1\u7aef API,\u6216\u8005\u628a uid \u4e00\u8d77\u585e\u8fdb cookie\n return (\n <div>\n <h1>\u6b22\u8fce</h1>\n <p>\u5f53\u524d\u5df2\u767b\u5f55(token \u957f\u5ea6 {accessToken.length})</p>\n </div>\n );\n}\n'})}),"\n",(0,c.jsxs)(n.p,{children:["\u5982\u679c\u8981\u5728 Server Component \u91cc\u62ff\u5230\u7528\u6237 ",(0,c.jsx)(n.code,{children:"uid"}),"\u3001\u624b\u673a\u53f7\u8fd9\u4e9b\u4fe1\u606f,\u6709\u4e24\u79cd\u505a\u6cd5:"]}),"\n",(0,c.jsxs)(n.ol,{children:["\n",(0,c.jsxs)(n.li,{children:["\u7b2c\u4e8c\u6b65\u767b\u5f55\u6210\u529f\u65f6,\u9664\u4e86\u5199 ",(0,c.jsx)(n.code,{children:"accessToken"}),",\u518d\u5199\u4e00\u4e2a ",(0,c.jsx)(n.code,{children:"cloudbase_uid"})," cookie,Server Component \u76f4\u63a5\u8bfb\u8fd9\u4e2a"]}),"\n",(0,c.jsxs)(n.li,{children:["Server Component \u8c03\u4e00\u4e2a\u5185\u90e8 Route Handler(",(0,c.jsx)(n.code,{children:"runtime: 'nodejs'"}),"),Route Handler \u7528 ",(0,c.jsx)(n.code,{children:"accessToken"})," \u8c03 CloudBase \u670d\u52a1\u7aef\u63a5\u53e3\u6362\u8be6\u7ec6\u4fe1\u606f(\u89c1\u7b2c\u516d\u6b65)"]}),"\n"]}),"\n",(0,c.jsxs)(n.h2,{id:"\u7b2c\u4e94\u6b65ts-\u62e6\u672a\u767b\u5f55\u8bf7\u6c42",children:["\u7b2c\u4e94\u6b65",":middleware",".ts \u62e6\u672a\u767b\u5f55\u8bf7\u6c42"]}),"\n",(0,c.jsxs)(n.p,{children:[(0,c.jsx)(n.code,{children:"middleware.ts"}),"(\u653e\u9879\u76ee\u6839\u76ee\u5f55,",(0,c.jsx)(n.strong,{children:"\u4e0d\u662f"})," ",(0,c.jsx)(n.code,{children:"app/"})," \u4e0b):"]}),"\n",(0,c.jsx)(n.pre,{children:(0,c.jsx)(n.code,{className:"language-ts",children:'import { NextRequest, NextResponse } from "next/server";
1\n\nexport function middleware(request: NextRequest) {\n const session = request.cookies.get("cloudbase_session");\n const { pathname } = request.nextUrl;\n\n // \u5df2\u767b\u5f55\u7528\u6237\u8bbf\u95ee /login,\u63a8\u56de\u9996\u9875\n if (session && pathname.startsWith("/login")) {\n return NextResponse.redirect(new URL("/", request.url));\n }\n\n // \u672a\u767b\u5f55\u7528\u6237\u8bbf\u95ee\u53d7\u4fdd\u62a4\u8def\u7531,\u8e22\u5230 /login\n if (!session && !pathname.startsWith("/login")) {\n const loginUrl = new URL("/login", request.url);\n loginUrl.searchParams.set("from", pathname);\n return NextResponse.redirect(loginUrl);\n }\n\n return NextResponse.next();\n}\n\nexport const config = {\n matcher: ["/((?!login|_next/static|_next/image|favicon.ico|api/public).*)"],\n};\n'})}),"\n",(0,c.jsx)(n.p,{children:"\u8981\u70b9:"}),"\n",(0,c.jsxs)(n.ul,{children:["\n",(0,c.jsxs)(n.li,{children:["middleware ",(0,c.jsx)(n.strong,{children:"\u8dd1\u5728 Edge Runtime"}),",",(0,c.jsx)(n.code,{children:"@cloudbase/js-sdk"})," \u7528\u4e86 Node API(",(0,c.jsx)(n.code,{children:"crypto"}),"\u3001",(0,c.jsx)(n.code,{children:"fs"}),"),",(0,c.jsxs)(n.strong,{children:["\u4e0d\u80fd\u5728 middleware \u91cc\u76f4\u63a5 ",(0,c.jsx)(n.code,{children:"import"})]})]}),"\n",(0,c.jsxs)(n.li,{children:["middleware \u53ea\u505a\u8f7b\u6821\u9a8c",":cookie"," \u662f\u5426\u5b58\u5728\u3001\u683c\u5f0f\u662f\u5426\u5408\u6cd5\u3002token \u662f\u5426\u771f\u6709\u6548\u3001\u662f\u5426\u8fc7\u671f\u3001\u5bf9\u5e94\u54ea\u4e2a uid,\u8fd9\u4e9b\u653e Server Component \u6216 Route Handler"]}),"\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:"matcher"})," \u7528\u5426\u5b9a lookahead ",(0,c.jsx)(n.code,{children:"(?!...)"})," \u6392\u9664\u4e0d\u9700\u8981\u62e6\u622a\u7684\u8def\u5f84;\u9057\u6f0f ",(0,c.jsx)(n.code,{children:"_next/static"})," \u4f1a\u8ba9\u9996\u5c4f chunk \u4e5f\u88ab\u91cd\u5b9a\u5411,\u9875\u9762\u76f4\u63a5\u767d\u5c4f"]}),"\n",(0,c.jsxs)(n.li,{children:["\u5df2\u767b\u5f55\u7528\u6237\u8bbf\u95ee ",(0,c.jsx)(n.code,{children:"/login"})," \u63a8\u56de\u9996\u9875,\u4f53\u9a8c\u4e0a\u907f\u514d\u300c\u70b9\u767b\u5f55\u4f46\u5df2\u767b\u5f55\u300d\u7684\u6b7b\u5faa\u73af"]}),"\n"]}),"\n",(0,c.jsxs)(n.h2,{id:"\u7b2c\u516d\u6b65-action-\u8c03-cloudbase-api\u5199\u6570\u636e",children:["\u7b2c\u516d\u6b65",":Server"," Action \u8c03 CloudBase API(\u5199\u6570\u636e)"]}),"\n",(0,c.jsxs)(n.p,{children:["\u4e1a\u52a1\u91cc\u8981\u7528 ",(0,c.jsx)(n.code,{children:"accessToken"})," \u8c03 CloudBase \u670d\u52a1\u7aef\u63a5\u53e3(\u8bfb\u6570\u636e\u5e93 / \u8c03\u4e91\u51fd\u6570),\u5efa\u8bae\u653e Server Action \u6216 Route Handler,\u800c\u4e14\u8981 ",(0,c.jsx)(n.code,{children:"runtime: 'nodejs'"}),"\u3002"]}),"\n",(0,c.jsxs)(n.p,{children:[(0,c.jsx)(n.code,{children:"app/api/profile/route.ts"}),":"]}),"\n",(0,c.jsx)(n.pre,{children:(0,c.jsx)(n.code,{className:"language-ts",children:'import { cookies } from "next/headers";\nimport { NextResponse } from "next/server";\n\n// \u5173\u952e:\u5f3a\u5236 Node Runtime,@cloudbase/js-sdk \u4e0d\u80fd\u8dd1\u5728 Edge\nexport const runtime = "nodejs";\n\nexport async function GET() {\n const cookieStore = await cookies();\n const accessToken = cookieStore.get("cloudbase_session")?.value;\n if (!accessToken) {\n return NextResponse.json({ error: "unauthenticated" }, { status: 401 });\n }\n\n // \u5728 Node Runtime \u91cc,\u53ef\u4ee5\u6b63\u5e38 import \u548c\u7528 SDK / \u8c03 HTTP\n // \u7528 accessToken \u76f4\u63a5\u8c03 CloudBase \u670d\u52a1\u7aef OpenAPI,\u6216\u8005\u7528 @cloudbase/node-sdk\n // \u672c\u4f8b\u53ea\u6f14\u793a\u76f4\u63a5\u8f6c\u53d1 cookie\n return NextResponse.json({ ok: true, hasSession: true });\n}\n'})}),"\n",(0,c.jsx)(n.p,{children:"\u8981\u70b9:"}),"\n",(0,c.jsxs)(n.ul,{children:["\n",(0,c.jsxs)(n.li,{children:["\u4efb\u4f55\u8981 ",(0,c.jsx)(n.code,{children:"import '@cloudbase/js-sdk'"})," \u6216 ",(0,c.jsx)(n.code,{children:"import '@cloudbase/node-sdk'"})," \u7684\u670d\u52a1\u7aef\u4ee3\u7801,",(0,c.jsx)(n.strong,{children:"\u5fc5\u987b"})," ",(0,c.jsx)(n.code,{children:"export const runtime = 'nodejs'"})]}),"\n",(0,c.jsxs)(n.li,{children:["\u9ed8\u8ba4 Route Handler \u5
1728 Next.js \u91cc\u4f1a\u8ddf\u968f\u7236\u7ea7 ",(0,c.jsx)(n.code,{children:"route.ts"})," \u7684\u914d\u7f6e,\u663e\u5f0f\u58f0\u660e\u6700\u7a33"]}),"\n"]}),"\n",(0,c.jsx)(n.h2,{id:"\u9000\u51fa\u767b\u5f55",children:"\u9000\u51fa\u767b\u5f55"}),"\n",(0,c.jsx)(n.pre,{children:(0,c.jsx)(n.code,{className:"language-tsx",children:'"use client";\n\nimport { auth } from "@/lib/cloudbase";\nimport { clearSessionCookie } from "@/app/login/actions";\nimport { useRouter } from "next/navigation";\n\nexport function SignOutButton() {\n const router = useRouter();\n\n const handleSignOut = async () => {\n await auth.signOut(); // \u6e05\u6389 SDK \u7684\u672c\u5730\u767b\u5f55\u6001\n await clearSessionCookie(); // Server Action \u5220 cookie\n router.push("/login");\n };\n\n return <button onClick={handleSignOut}>\u9000\u51fa\u767b\u5f55</button>;\n}\n'})}),"\n",(0,c.jsxs)(n.p,{children:[(0,c.jsx)(n.code,{children:"signOut()"})," \u6e05 SDK \u7aef,",(0,c.jsx)(n.code,{children:"clearSessionCookie()"})," \u6e05\u670d\u52a1\u7aef;\u4e24\u6b65\u90fd\u8981\u505a,\u7f3a\u4e00\u4f1a\u51fa\u73b0\u300c\u5ba2\u6237\u7aef\u5df2\u767b\u51fa\u4f46 SSR \u8fd8\u663e\u793a\u5df2\u767b\u5f55\u300d\u3002"]}),"\n",(0,c.jsx)(n.h2,{id:"\u8fd0\u884c\u9a8c\u8bc1",children:"\u8fd0\u884c\u9a8c\u8bc1"}),"\n",(0,c.jsxs)(n.ol,{children:["\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.code,{children:"npm run dev"})," \u8d77\u670d\u52a1,\u6d4f\u89c8\u5668\u8bbf\u95ee ",(0,c.jsx)(n.code,{children:"http://localhost:3000"}),",\u5e94\u8be5\u88ab middleware \u91cd\u5b9a\u5411\u5230 ",(0,c.jsx)(n.code,{children:"/login?from=/"})]}),"\n",(0,c.jsxs)(n.li,{children:["\u7528\u771f\u5b9e\u624b\u673a\u53f7\u8d70\u77ed\u4fe1\u9a8c\u8bc1\u7801\u6d41\u7a0b,\u767b\u5f55\u6210\u529f\u540e\u56de\u5230 ",(0,c.jsx)(n.code,{children:"/"}),",Server Component \u6e32\u67d3\u300c\u6b22\u8fce\u300d\u9875"]}),"\n",(0,c.jsxs)(n.li,{children:["\u63a7\u5236\u53f0 \u2192 ",(0,c.jsx)(n.strong,{children:"\u8eab\u4efd\u8ba4\u8bc1 \u2192 \u7528\u6237\u7ba1\u7406"}),",\u80fd\u770b\u5230\u8fd9\u6b21\u767b\u5f55\u7684\u7528\u6237\u8bb0\u5f55,\u7c7b\u578b\u662f\u624b\u673a\u53f7"]}),"\n",(0,c.jsxs)(n.li,{children:["\u6d4f\u89c8\u5668 DevTools \u2192 Application \u2192 Cookies,\u80fd\u770b\u5230 ",(0,c.jsx)(n.code,{children:"cloudbase_session"})," \u8fd9\u4e2a cookie,",(0,c.jsx)(n.code,{children:"HttpOnly"})," \u5217\u662f \u2713,JavaScript \u5728 Console \u91cc ",(0,c.jsx)(n.code,{children:"document.cookie"})," \u8bfb\u4e0d\u5230\u5b83"]}),"\n",(0,c.jsxs)(n.li,{children:["\u76f4\u63a5\u5237\u65b0\u9875\u9762(F5),Server Component \u4ecd\u7136\u8ba4\u5f97\u767b\u5f55\u6001,\u4e0d\u4f1a\u88ab\u8e22\u56de ",(0,c.jsx)(n.code,{children:"/login"}),"(SSR \u62ff\u5230\u4e86 cookie)"]}),"\n",(0,c.jsxs)(n.li,{children:["\u70b9\u9000\u51fa\u767b\u5f55,cookie \u88ab\u6e05,\u5237\u65b0\u540e\u91cd\u65b0\u88ab\u8e22\u5230 ",(0,c.jsx)(n.code,{children:"/login"})]}),"\n"]}),"\n",(0,c.jsx)(n.h2,{id:"\u5e38\u89c1\u9519\u8bef",children:"\u5e38\u89c1\u9519\u8bef"}),"\n",(0,c.jsxs)(n.table,{children:[(0,c.jsx)(n.thead,{children:(0,c.jsxs)(n.tr,{children:[(0,c.jsx)(n.th,{children:"\u9519\u8bef\u7801 / \u73b0\u8c61"}),(0,c.jsx)(n.th,{children:"\u539f\u56e0"}),(0,c.jsx)(n.th,{children:"\u4fee\u590d"})]})}),(0,c.jsxs)(n.tbody,{children:[(0,c.jsxs)(n.tr,{children:[(0,c.jsxs)(n.td,{children:[(0,c.jsx)(n.code,{children:"cookies().get is not a function"})," \u6216 ",(0,c.jsx)(n.code,{children:"Property 'get' does not exist"})]}),(0,c.jsxs)(n.td,{children:["Next.js 15 \u628a ",(0,c.jsx)(n.code,{children:"cookies()"})," \u6539\u6210 async,\u76f4\u63a5\u8c03\u7528\u62ff\u5230\u7684\u662f Promise"]}),(0,c.jsxs)(n.td,{children:["\u6539\u6210 ",(0,c.jsx)(n.code,{children:"const cookieStore = await cookies(); cookieStore.get(...)"})]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsxs)(n.td,{children:["middleware \u91cc ",(0,c.jsx)(n.code,{children:"import cloudbase from '@cloudbase/js-sdk'"})," \u62a5 ",(0,c.jsx)(n.code,{children:"crypto is not defined"})," \u6216 ",(0,c.jsx)(n.code,{children:"Module not found: Can't resolve 'fs'"})]}),(0,c.jsx)(n.td,{children:"middleware \u8dd1\u5728 Edge Runtime,SDK \u7528\u4e86 Node API"}),(0,c.jsxs)(n.td,{children:["middleware \u4e0d\u8981 import SDK,\u53ea\u8bfb cookie \u505a\u5b58\u5728\u6027\u5224\u65ad;\u771f\u6821\u9a8c\u653e ",(0,c.jsx)(n.code,{children:"runtime: 'nodejs'"})," \u7684 Route Handler"]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsxs)(n.td,{children:["Server Component \u91cc\u8c03 ",(0,c.jsx)(n.code,{children:"cookieStore.set(...)"})," \u62a5 ",(0,c.jsx)(n.code,{children:"Cookies can only be modified in a Server Action or Route Handler"})]}),(0,c.jsx)(n.td,{children:"RSC \u6d41\u5f0f\u6e32\u67d3\u65f6 response header \u5df2\u53d1,\u6539\u4e0d\u4e86 cookie"}),(0,c.jsxs)(n.td,{children:["\u628a ",(0,c.jsx)(n.code,{children:"set"})," / ",(0,c.jsx)(n.code,{children:"delete"})," \u64cd\u4f5c\u653e\u8fdb ",(0,c.jsx)(n.code,{children:"'use server'"})," \u7684 Server Action \u91cc"]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsxs)(n.td,{children:[(0,c.jsx)(n.code,{children:"cookieStore.set"})," \u52a0\u4e86 ",(0,c.jsx)(n.code,{children:"sameSite: 'strict'"})," \u540e,\u5fae\u4fe1\u626b\u7801\u56de\u8c03\u4e0d\u5e26 cookie"]}),(0,c.jsx)(n.td,{children:"strict \u6a21\u5f0f\u8de8\u7ad9\u8df3\u8f6c\u4e0d\u53d1 cookie"}),(0,c.jsxs)(n.td,{children:["\u6539\u6210 ",(0,c.jsx)(n.code,{children:"sameSite: 'lax'"}),"(\u9ed8\u8ba4\u63a8\u8350)"]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsxs)(n.td,{children:["middleware \u914d\u4e86 ",(0,c.jsx)(n.code,{children:"matcher: '/'"})," \u4e4b\u540e ",(0,c.jsx)(n.code,{children:"/about"})," \u6ca1\u62e6\u5230"]}),(0,c.jsxs)(n.td,{children:[(0,c.jsx)(n.code,{children:"matcher"})," \u5199\u6210\u5355\u5b57\u7b26\u4e32\u53ea\u7cbe\u786e\u5339\u914d ",(0,c.jsx)(n.code,{children:"/"}),",\u4e0d\u662f\u524d\u7f00"]}),(0,c.jsxs)(n.td,{children:["\u7528\u5426\u5b9a lookahead \u5199\u6cd5 ",(0,c.jsx)(n.code,{children:"['/((?!login|_next).*)' ]"}),",\u6216\u591a\u6761\u89c4\u5219"]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsx)(n.td,{children:"\u77ed\u4fe1\u53d1\u9001\u62a5\u300c\u8be5\u5730\u57df\u4e0d\u652f\u6301\u77ed\u4fe1\u300d"}),(0,c.jsx)(n.td,{children:"CloudBase \u73af\u5883\u4e0d\u5728\u4e0a\u6d77"}),(0,c.jsx)(n.td,{children:"\u77ed\u4fe1\u767b\u5f55\u4ec5\u652f\u6301\u4e0a\u6d77\u5730\u57df,\u6362\u4e0a\u6d77\u73af\u5883\u6216\u8005\u6539\u7528\u5176\u4ed6\u767b\u5f55\u65b9\u5f0f"})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsx)(n.td,{children:(0,c.jsx)(n.code,{children:"phone_number format invalid"})}),(0,c.jsxs)(n.td,{children:["\u6ca1\u5e26 ",(0,c.jsx)(n.code,{children:"+86"})," \u533a\u53f7"]}),(0,c.jsxs)(n.td,{children:["\u4e2d\u56fd\u5927\u9646\u53f7\u7edf\u4e00\u4f20 ",(0,c.jsx)(n.code,{children:"+86 13800000000"})]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsx)(n.td,{children:"\u767b\u5f55\u6210\u529f\u540e\u5237\u65b0\u9875\u9762\u53c8\u88ab\u8e22\u56de /login"}),(0,c.jsxs)(n.td,{children:["Server Action \u5199 cookie \u65f6\u6f0f\u4e86 ",(0,c.jsx)(n.code,{children:"path: '/'"}),",\u9ed8\u8ba4\u53ea\u5728\u5f53\u524d path \u4e0b\u751f\u6548"]}),(0,c.jsxs)(n.td,{children:[(0,c.jsx)(n.code,{children:"cookieStore.set"})," \u663e\u5f0f\u52a0 ",(0,c.jsx)(n.code,{children:"path: '/'"})]})]}),(0,c.jsxs)(n.tr,{children:[(0,c.jsx)(n.td,{children:"\u90e8\u7f72\u5230 Vercel / CloudBase \u6258\u7ba1\u540e cookie \u4e0d\u751f\u6548"}),(0,c.jsxs)(n.td,{children:["\u751f\u4ea7\u73af\u5883 ",(0,c.jsx)(n.code,{children:"secure: false"})," \u65f6\u6d4f\u89c8\u5668\u4e0d\u5b58,\u6216 ",(0,c.jsx)(n.code,{children:"secure: true"})," \u4f46\u7ad9\u70b9\u662f HTTP"]}),(0,c.jsxs)(n.td,{children:["\u751f\u4ea7\u5fc5\u987b HTTPS + ",(0,c.jsx)(n.code,{children:"secure: true"}),";\u672c\u5730 HTTP \u7528 ",(0,c.jsx)(n.code,{children:"secure: process.env.NODE_ENV === 'production'"})]})]})]})]}),"\n",(0,c.jsxs)(n.p,{children:["\u9519\u8bef\u7801\u5b9a\u4e49\u53c2\u8003 ",(0,c.jsx)(n.a,{href:"https://docs.cloudbase.net/error-code/",children:"error-code"}),"\u3002"]}),"\n",(0,c.jsx)(n.h2,{id:"\u76f8\u5173\u6587\u6863",children:"\u76f8\u5173\u6587\u6863"}),"\n",(0,c.jsxs)(n.ul,{children:["\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.a,{href:"./add-auth-web-with-cloudbase-sdk",children:"add-auth-web-with-cloudbase-sdk"}
1)," \u2014 Vite + React SPA \u7684\u8ba4\u8bc1\u7248\u672c,Pages Router / \u7eaf SPA \u8d70\u8fd9\u7bc7"]}),"\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.a,{href:"./add-auth-uniapp",children:"add-auth-uniapp"})," \u2014 \u591a\u7aef(H5 / \u5c0f\u7a0b\u5e8f / App)\u7edf\u4e00\u8ba4\u8bc1\u65b9\u6848"]}),"\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.a,{href:"../authentication-v2/method/sdk-init",children:"SDK \u521d\u59cb\u5316"})," \u2014 ",(0,c.jsx)(n.code,{children:"cloudbase.init"})," / ",(0,c.jsx)(n.code,{children:"auth()"})," \u53c2\u6570\u8bf4\u660e"]}),"\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.a,{href:"../authentication-v2/method/sms-login",children:"\u77ed\u4fe1\u9a8c\u8bc1\u7801\u767b\u5f55"})," \u2014 ",(0,c.jsx)(n.code,{children:"getVerification"})," / ",(0,c.jsx)(n.code,{children:"signInWithSms"})," \u63a5\u53e3\u6d41\u7a0b"]}),"\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.a,{href:"../authentication-v2/method/wechat-login",children:"\u5fae\u4fe1\u5f00\u653e\u5e73\u53f0\u767b\u5f55"})," \u2014 OAuth \u8df3\u8f6c + bind \u6d41\u7a0b"]}),"\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.a,{href:"../api-reference/webv3/authentication",children:"Web SDK auth \u5b8c\u6574 API"})," \u2014 \u6240\u6709 ",(0,c.jsx)(n.code,{children:"Auth.*"})," \u7b7e\u540d"]}),"\n",(0,c.jsxs)(n.li,{children:[(0,c.jsx)(n.a,{href:"https://docs.cloudbase.net/error-code/",children:"error-code"})," \u2014 \u9519\u8bef\u7801\u5b9a\u4e49"]}),"\n"]})]})}function h(e={}){const{wrapper:n}={...(0,i.R)(),...e.components};return n?(0,c.jsx)(n,{...e,children:(0,c.jsx)(a,{...e})}):a(e)}},28453(e,n,s){s.d(n,{R:()=>d,x:()=>r});var o=s(96540);const c={},i=o.createContext(c);function d(e){const n=o.useContext(i);return o.useMemo(function(){return"function"==typeof e?e(n):{...n,...e}},[n,e])}function r(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(c):e.components||c:d(e.components),o.createElement(i.Provider,{value:n},e.children)}}}]);
Line numbers count LF bytes from the start of the resource, as the search results do. Vendor segments are library code the classifier recognised; they are stored but not indexed. Bytes are shown as Latin1 characters, one per byte.