在網路應用程式中使用 App Check 保護自訂後端資源
透過集合功能整理內容
你可以依據偏好儲存及分類內容。
您可以透過 App Check 保護應用程式的非 Google 自訂後端資源,例如自行管理的後端。如要這麼做,請完成下列兩項操作:
- 如本頁所述,修改應用程式用戶端,在每次傳送至後端的要求中加入 App Check 權杖。
- 修改後端,要求每個要求都附上有效的 App Check 權杖,詳情請參閱「從自訂後端驗證 App Check 權杖」。
事前準備
使用 reCAPTCHA Enterprise 提供者或自訂提供者,將 App Check 新增至應用程式。
在後端要求中傳送 App Check 權杖
在應用程式用戶端中,每次提出要求前,請先使用 appCheck().getToken()
取得有效且未過期的 App Check 權杖。App Check 程式庫會視需要重新整理權杖。
取得有效權杖後,請將權杖連同要求傳送至後端。具體做法由您決定,但請勿將 App Check 權杖做為網址的一部分傳送 (包括查詢參數),否則權杖可能會意外洩漏或遭到攔截。下列範例會在自訂 HTTP 標頭中傳送權杖,這是建議的做法。
Web
import { initializeAppCheck, getToken } from 'firebase/app-check';
const appCheck = initializeAppCheck(
app,
{ provider: provider } // ReCaptchaV3Provider or CustomProvider
);
const callApiWithAppCheckExample = async () => {
let appCheckTokenResponse;
try {
appCheckTokenResponse = await getToken(appCheck, /* forceRefresh= */ false);
} catch (err) {
// Handle any errors if the token was not retrieved.
return;
}
// Include the App Check token with requests to your server.
const apiResponse = await fetch('https://yourbackend.example.com/yourApiEndpoint', {
headers: {
'X-Firebase-AppCheck': appCheckTokenResponse.token,
}
});
// Handle response from your backend.
};
Web
const callApiWithAppCheckExample = async () => {
let appCheckTokenResponse;
try {
appCheckTokenResponse = await firebase.appCheck().getToken(/* forceRefresh= */ false);
} catch (err) {
// Handle any errors if the token was not retrieved.
return;
}
// Include the App Check token with requests to your server.
const apiResponse = await fetch('https://yourbackend.example.com/yourApiEndpoint', {
headers: {
'X-Firebase-AppCheck': appCheckTokenResponse.token,
}
});
// Handle response from your backend.
};
重送攻擊防護 (Beta 版)
向已啟用重播保護機制的端點提出要求時,請使用 getLimitedUseToken()
取得權杖,而非 getToken()
:
import { getLimitedUseToken } from "firebase/app-check";
// ...
appCheckTokenResponse = await getLimitedUseToken(appCheck);
除非另有註明,否則本頁面中的內容是採用創用 CC 姓名標示 4.0 授權,程式碼範例則為阿帕契 2.0 授權。詳情請參閱《Google Developers 網站政策》。Java 是 Oracle 和/或其關聯企業的註冊商標。
上次更新時間:2025-08-23 (世界標準時間)。
[null,null,["上次更新時間:2025-08-23 (世界標準時間)。"],[],[],null,["You can use App Check to protect non-Google custom backend resources for\nyour app, like your own self-hosted backend. To do so, you'll need to do both of\nthe following:\n\n- Modify your app client to send an App Check token along with each request to your backend, as described on this page.\n- Modify your backend to require a valid App Check token with every request, as described in [Verify App Check tokens from a custom backend](/docs/app-check/custom-resource-backend).\n\nBefore you begin\n\nAdd App Check to your app, using either the\n[reCAPTCHA Enterprise provider](/docs/app-check/web/recaptcha-enterprise-provider)\nor a [custom provider](/docs/app-check/web/custom-provider).\n\nSend App Check tokens with backend requests\n\nIn your app client, before each request, get a valid, unexpired, App Check\ntoken with `appCheck().getToken()`. The App Check library will refresh the\ntoken if necessary.\n\nOnce you have a valid token, send it along with the request to your backend. The\nspecifics of how you accomplish this are up to you, but *don't send\nApp Check tokens as part of URLs*, including in query parameters, as this\nmakes them vulnerable to accidental leakage and interception. The following\nexample sends the token in a custom HTTP header, which is the recommended\napproach. \n\nWeb \n\n```javascript\nimport { initializeAppCheck, getToken } from 'firebase/app-check';\n\nconst appCheck = initializeAppCheck(\n app,\n { provider: provider } // ReCaptchaV3Provider or CustomProvider\n);\n\nconst callApiWithAppCheckExample = async () =\u003e {\n let appCheckTokenResponse;\n try {\n appCheckTokenResponse = await getToken(appCheck, /* forceRefresh= */ false);\n } catch (err) {\n // Handle any errors if the token was not retrieved.\n return;\n }\n\n // Include the App Check token with requests to your server.\n const apiResponse = await fetch('https://yourbackend.example.com/yourApiEndpoint', {\n headers: {\n 'X-Firebase-AppCheck': appCheckTokenResponse.token,\n }\n });\n\n // Handle response from your backend.\n};https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/snippets/appcheck-next/index/appcheck_nonfirebase.js#L8-L32\n```\n\nWeb \n\n```javascript\nconst callApiWithAppCheckExample = async () =\u003e {\n let appCheckTokenResponse;\n try {\n appCheckTokenResponse = await firebase.appCheck().getToken(/* forceRefresh= */ false);\n } catch (err) {\n // Handle any errors if the token was not retrieved.\n return;\n }\n\n // Include the App Check token with requests to your server.\n const apiResponse = await fetch('https://yourbackend.example.com/yourApiEndpoint', {\n headers: {\n 'X-Firebase-AppCheck': appCheckTokenResponse.token,\n }\n });\n\n // Handle response from your backend.\n};https://github.com/firebase/snippets-web/blob/467eaa165dcbd9b3ab15711e76fa52237ba37f8b/appcheck/index.js#L68-L85\n```\n\nReplay protection (beta)\n\nWhen making a request to an endpoint for which you've enabled\n[replay protection](/docs/app-check/custom-resource-backend#replay-protection),\nacquire a token using `getLimitedUseToken()` instead of `getToken()`: \n\n import { getLimitedUseToken } from \"firebase/app-check\";\n\n // ...\n\n appCheckTokenResponse = await getLimitedUseToken(appCheck);"]]