Bảo vệ tài nguyên phụ trợ tuỳ chỉnh bằng tính năng Kiểm tra ứng dụng trong ứng dụng web
Sử dụng bộ sưu tập để sắp xếp ngăn nắp các trang
Lưu và phân loại nội dung dựa trên lựa chọn ưu tiên của bạn.
Bạn có thể dùng App Check để bảo vệ các tài nguyên phụ trợ tuỳ chỉnh không phải của Google cho ứng dụng của mình, chẳng hạn như phụ trợ tự lưu trữ của riêng bạn. Để làm như vậy, bạn cần thực hiện cả hai việc sau:
Trước khi bắt đầu
Thêm App Check vào ứng dụng của bạn bằng cách sử dụng trình cung cấp reCAPTCHA Enterprise hoặc trình cung cấp tuỳ chỉnh.
Gửi mã thông báo App Check bằng các yêu cầu phụ trợ
Trong ứng dụng, trước mỗi yêu cầu, hãy lấy một mã thông báo App Check hợp lệ, chưa hết hạn bằng appCheck().getToken()
. Thư viện App Check sẽ làm mới mã thông báo nếu cần.
Sau khi bạn có mã thông báo hợp lệ, hãy gửi mã thông báo đó cùng với yêu cầu đến phần phụ trợ của bạn. Bạn có thể tự quyết định cách thực hiện việc này, nhưng đừng gửi mã thông báo App Check trong URL, kể cả trong các tham số truy vấn, vì điều này khiến các mã thông báo dễ bị rò rỉ và bị chặn một cách vô tình. Ví dụ sau đây sẽ gửi mã thông báo trong một tiêu đề HTTP tuỳ chỉnh. Đây là phương pháp được đề xuất.
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.
};
Bảo vệ khỏi các cuộc tấn công phát lại (thử nghiệm)
Khi đưa ra yêu cầu đến một điểm cuối mà bạn đã bật tính năng chống phát lại, hãy lấy mã thông báo bằng cách sử dụng getLimitedUseToken()
thay vì getToken()
:
import { getLimitedUseToken } from "firebase/app-check";
// ...
appCheckTokenResponse = await getLimitedUseToken(appCheck);
Trừ phi có lưu ý khác, nội dung của trang này được cấp phép theo Giấy phép ghi nhận tác giả 4.0 của Creative Commons và các mẫu mã lập trình được cấp phép theo Giấy phép Apache 2.0. Để biết thông tin chi tiết, vui lòng tham khảo Chính sách trang web của Google Developers. Java là nhãn hiệu đã đăng ký của Oracle và/hoặc các đơn vị liên kết với Oracle.
Cập nhật lần gần đây nhất: 2025-08-23 UTC.
[null,null,["Cập nhật lần gần đây nhất: 2025-08-23 UTC."],[],[],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);"]]