前端應(yīng)用在提供無縫用戶體驗(yàn)方面起著核心作用。在當(dāng)今互聯(lián)網(wǎng)的環(huán)境中，第三方集成和API的普及使得確保強(qiáng)大的安全性至關(guān)重要。安全漏洞可能導(dǎo)致數(shù)據(jù)盜竊、未經(jīng)授權(quán)訪問以及品牌聲譽(yù)受損。本文將向您展示如何使用CORS和CSP為您的網(wǎng)頁增加安全性。

嗨，大家好！?歡迎閱讀“使用CORS和CSP保護(hù)前端應(yīng)用程序”——這是今天不斷發(fā)展的網(wǎng)絡(luò)環(huán)境中必讀的文章。

想象一下，一個(gè)惡意腳本被注入到你的應(yīng)用程序中，竊取敏感用戶數(shù)據(jù)或?qū)⒂脩糁囟ㄏ虻狡墼p網(wǎng)站。可怕吧？但不用擔(dān)心！通過正確實(shí)施CORS和CSP，我們可以加固前端應(yīng)用程序，保持領(lǐng)先，抵御潛在威脅。

本文的目的和范圍

在本文中，我們深入探討了CORS和CSP，為您揭開了這些安全措施的神秘面紗。我們將學(xué)習(xí)如何在React、Angular和Vue.js等各種前端框架中有效地實(shí)施它們，提供實(shí)際示例和代碼片段。到最后，您將具備像專業(yè)人士一樣保護(hù)前端應(yīng)用程序的知識(shí)！

所以，如果你渴望保護(hù)你的用戶并加強(qiáng)你的應(yīng)用程序的安全性，讓我們卷起袖子，深入了解CORS和CSP的世界。你的應(yīng)用程序和用戶會(huì)感謝你的！讓我們開始吧！

CORS和CSP是什么？

讓我們從基礎(chǔ)知識(shí)開始。關(guān)鍵的安全功能被稱為CORS，即跨域資源共享，它使服務(wù)器能夠管理哪些外部資源可以訪問Web應(yīng)用程序。通過阻止每個(gè)惡意的跨域請(qǐng)求，這可以保護(hù)我們的應(yīng)用程序更安全。

一種有效的防御機(jī)制，用于抵御跨站腳本攻擊（XSS）和數(shù)據(jù)泄露等內(nèi)容注入攻擊，就是內(nèi)容安全策略（CSP）。通過允許開發(fā)人員指定前端應(yīng)用程序可以加載資源的來源，它降低了未經(jīng)授權(quán)的腳本執(zhí)行的可能性。

// Sample code block demonstrating a simple CORS configuration in Node.js
const express = require("express");
const app = express();

// Enable CORS for all routes
app.use((req, res, next) => {
res.setHeader("Access-Control-Allow-Origin", "*");
res.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE");
res.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization");
next();
});

// ... the rest of your routes and logic

注意：提供的代碼片段是使用Express在Node.js中進(jìn)行CORS配置的基本示例，允許來自任何來源的請(qǐng)求。在生產(chǎn)環(huán)境中，您應(yīng)該指定可信任的來源，而不是使用'*'。

了解CORS

好的，讓我們深入了解CORS的細(xì)節(jié)。?

同源策略及其局限性

每個(gè)網(wǎng)絡(luò)瀏覽器都會(huì)執(zhí)行同源策略，該策略阻止網(wǎng)頁向原始服務(wù)頁面之外的域名發(fā)出請(qǐng)求。通過這個(gè)策略的幫助，可以避免潛在的安全風(fēng)險(xiǎn)，比如未經(jīng)授權(quán)的數(shù)據(jù)訪問，確保在一個(gè)源中運(yùn)行的腳本無法在沒有明確許可的情況下訪問另一個(gè)源的資源。

然而， Same-Origin 政策也有一些限制。例如，它阻止了有效的跨域請(qǐng)求，而這對(duì)于依賴于來自不同服務(wù)器的API的Web應(yīng)用程序是必要的。如果沒有CORS，您的前端應(yīng)用程序?qū)o法從不同域上托管的API中檢索數(shù)據(jù)。這就是CORS發(fā)揮作用的地方，它能夠解決這個(gè)問題！

CORS作為一種安全機(jī)制

一個(gè)網(wǎng)絡(luò)服務(wù)器可以使用CORS機(jī)制明確地授予網(wǎng)絡(luò)客戶端訪問其他來源資源的權(quán)限。服務(wù)器可以通過使用特定的HTTP請(qǐng)求頭告訴瀏覽器哪些來源被允許訪問它們的資源。

CORS的工作原理及其在保護(hù)前端應(yīng)用程序中的作用

當(dāng)前端應(yīng)用程序發(fā)起跨域請(qǐng)求時(shí)，瀏覽器會(huì)檢查服務(wù)器的響應(yīng)是否包含必要的CORS頭部。如果頭部授予許可（例如，"
Access-Control-Allow-Origin "），瀏覽器允許前端應(yīng)用程序訪問所請(qǐng)求的資源。如果頭部缺失或不正確，瀏覽器會(huì)因安全問題而阻止該請(qǐng)求。

CORS在保護(hù)前端應(yīng)用程序方面起著關(guān)鍵作用，確保只有受信任的來源可以與您的應(yīng)用程序后端資源進(jìn)行交互。這可以防止未經(jīng)授權(quán)的訪問和潛在的數(shù)據(jù)泄露，同時(shí)仍然允許合法的跨域請(qǐng)求，促進(jìn)安全和功能完善的網(wǎng)絡(luò)生態(tài)系統(tǒng)。

實(shí)施CORS

既然我們已經(jīng)明白了CORS的重要性，那么讓我們動(dòng)起手來，在我們的前端應(yīng)用中實(shí)施它吧！

CORS的配置選項(xiàng)和頭文件

要在后端服務(wù)器中啟用CORS，您需要設(shè)置特定的響應(yīng)頭。最重要的頭部是“
Access-Control-Allow-Origin ”，它指定了允許訪問您資源的來源。您可以使用通配符(*)來允許任何來源的訪問，但更安全的做法是明確指定可信任的來源。

其他關(guān)鍵的頭部包括?
“Access-Control-Allow-Methods ”（定義允許的HTTP方法），“?Access-Control-Allow-Headers ”（列出允許的請(qǐng)求頭），以及可選的“?Access-Control-Allow-Credentials ”（如果您需要在跨域請(qǐng)求中包含憑據(jù)，如cookies）。

在不同的框架中啟用CORS的逐步指南

啟用CORS的方法因后端框架而異。讓我們來看一下流行的前端框架的逐步指南：

1. Express (Node.js):

const express = require("express");
const app = express();

// Enable CORS for all routes
app.use((req, res, next) => {
res.setHeader(
  "Access-Control-Allow-Origin",
  "https://www.trusted-origin.com",
);
res.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT, DELETE");
res.setHeader("Access-Control-Allow-Headers", "Content-Type, Authorization");
// Optionally, allow credentials (e.g., cookies) to be sent in cross origin requests
res.setHeader("Access-Control-Allow-Credentials", "true");
next();
});

2. Django (Python):

# In settings.py

CORS_ORIGIN_WHITELIST = [
  'https://www.trusted-origin.com',
]

CORS_ALLOW_METHODS = ['GET', 'POST', 'PUT', 'DELETE']

CORS_ALLOW_HEADERS = ['Content-Type', 'Authorization']

CORS_ALLOW_CREDENTIALS = True  # Optionally, allow credentials

CORS實(shí)施的常見陷阱和最佳實(shí)踐

在實(shí)施CORS時(shí)要注意潛在的陷阱，比如過于寬松的“
Access-Control-Allow-Origin ”設(shè)置可能會(huì)將您的資源暴露給未經(jīng)授權(quán)的來源。為了避免安全漏洞，始終驗(yàn)證和清理輸入數(shù)據(jù)。

為了降低風(fēng)險(xiǎn)，最佳實(shí)踐要求處理預(yù)檢請(qǐng)求，設(shè)置嚴(yán)格的“
Access-Control-Allow-Origin ”值，并指定適當(dāng)?shù)摹?Access-Control-Allow-Methods ”和“?Access-Control-Allow-Headers ”。

為了為您的前端應(yīng)用程序創(chuàng)建一個(gè)強(qiáng)大的防御，除了CORS之外，還應(yīng)該添加其他安全措施，如輸入驗(yàn)證和身份驗(yàn)證，這應(yīng)該被視為安全的基本層。要警惕并防范對(duì)您的應(yīng)用程序的威脅！

CSP簡(jiǎn)介

好了，朋友們，讓我們換個(gè)話題，探索一下 Content Security Policy （CSP）的領(lǐng)域——這是保護(hù)我們前端應(yīng)用程序的有力盟友！?

內(nèi)容安全策略概述及其目標(biāo)

您的前端應(yīng)用程序的內(nèi)容安全策略（CSP）就像一個(gè)保鏢，決定誰可以進(jìn)入，誰不可以。通過限制應(yīng)用程序可以加載外部?jī)?nèi)容的來源，如腳本、樣式表和圖像，它旨在減少內(nèi)容注入攻擊，如跨站腳本（XSS）。

即使惡意腳本通過用戶生成的內(nèi)容或外部資源進(jìn)入您的應(yīng)用程序，您可以通過定義嚴(yán)格的策略來阻止它們被執(zhí)行。通過精確控制您的應(yīng)用程序可以加載和不能加載的內(nèi)容，內(nèi)容安全策略（CSP）作為額外的安全層，最大限度地減少攻擊面。

理解限制外部?jī)?nèi)容的必要性

在當(dāng)今的網(wǎng)絡(luò)中，前端應(yīng)用程序通常依賴于外部資源，如庫、字體或分析腳本。然而，這些依賴關(guān)系可能被攻擊者利用，將有害代碼注入到您的應(yīng)用程序中，從而危及用戶數(shù)據(jù)并破壞信任。通過內(nèi)容安全策略（CSP）限制外部?jī)?nèi)容，可以確保只有可信的來源被允許，有效地遏制此類威脅。

CSP與其他安全機(jī)制的比較

CSP在安全機(jī)制中與XSS過濾器和跨站請(qǐng)求偽造（CSRF）令牌有所不同。雖然XSS過濾器試圖檢測(cè)和中和惡意腳本，但它們并不是百分之百可靠，并且可能存在兼容性問題。另一方面，CSRF令牌專注于防止未經(jīng)授權(quán)的操作，但無法解決內(nèi)容注入攻擊。

CSP通過完全阻止惡意內(nèi)容加載來解決根本原因，使其更加強(qiáng)大和可靠。將CSP與其他安全措施結(jié)合使用，可以構(gòu)建一個(gè)強(qiáng)大的防御系統(tǒng)，保護(hù)您的前端應(yīng)用免受各種威脅。

<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'trusted-scripts.com'; style-src 'self' 'trusted-styles.com'; img-src 'self' data:">

注意：在提供的 code snippet 中，CSP策略只允許從相同的源和'trusted-scripts.com'加載腳本，從相同的源和'trusted-styles.com'加載樣式表，以及從相同的源和數(shù)據(jù)URL加載圖像。您應(yīng)根據(jù)您的應(yīng)用程序要求自定義策略。

實(shí)施CSP

是時(shí)候在我們的前端應(yīng)用程序上加強(qiáng)安全措施了，使用內(nèi)容安全策略（CSP）！讓我們立即開始吧！?

通過頭部和元標(biāo)簽定義內(nèi)容安全策略

CSP可以通過HTTP響應(yīng)頭或元標(biāo)簽來定義。對(duì)于HTTP頭，服務(wù)器在其響應(yīng)中包含“Content-Security-Policy”頭，指定策略指令。另一方面，使用HTML中的元標(biāo)簽可以直接在文檔中定義策略。

通過HTTP頭設(shè)置CSP（在Node.js中使用Express）：

const express = require("express");
const app = express();

// Set the CSP header for all responses
app.use((req, res, next) => {
res.setHeader(
  "Content-Security-Policy",
  "default-src 'self'; script-src 'self' 'trusted-scripts.com'; style-src 'self' 'trusted-styles.com'; img-src 'self' data:",
);
next();
});

通過元標(biāo)簽設(shè)置CSP（在HTML中）：

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'trusted-scripts.com'; style-src 'self' 'trusted-styles.com'; img-src 'self' data:">
<!-- Rest of the head section -->
</head>
<body>
<!-- Your app’s content -->
</body>
</html>

探索每個(gè)CSP指令

CSP提供了多種指令來控制特定類型的資源和操作。例如：

• default-src ：如果其他指令沒有明確指定，該指令定義了它們的默認(rèn)行為。

• script-src ：指定 JavaScript 的允許來源。

• style-src ：設(shè)置樣式表的來源。

• img-src ：確定圖像的允許來源。

您還可以使用 nonce 和 hash 屬性來添加動(dòng)態(tài)腳本和內(nèi)聯(lián)樣式，同時(shí)仍遵守策略。

案例研究展示了CSP如何減輕常見的前端安全漏洞

CSP在阻止安全漏洞方面是一位超級(jí)英雄！它通過阻止未經(jīng)授權(quán)的腳本執(zhí)行來防止XSS攻擊，通過限制資源加載到可信源來阻止 data exfiltration ，并通過控制框架嵌入來減輕點(diǎn)擊劫持攻擊。通過實(shí)施CSP，許多知名網(wǎng)站成功地挫敗了攻擊并保護(hù)了他們的用戶安全。

通過根據(jù)您的應(yīng)用程序要求定制的正確CSP指令，您可以自信地抵御各種前端安全威脅，并確保用戶享受安全的瀏覽體驗(yàn)。所以，準(zhǔn)備好利用CSP的力量，像專業(yè)人士一樣加固您的前端應(yīng)用程序吧！

結(jié)合CORS和CSP

既然我們已經(jīng)裝備了CORS和CSP，現(xiàn)在是時(shí)候發(fā)揮它們的綜合力量，為我們的前端應(yīng)用程序創(chuàng)建一個(gè)堅(jiān)不可摧的堡壘了！

CORS和CSP在加強(qiáng)前端應(yīng)用安全方面的協(xié)同效應(yīng)

CORS和CSP就像一對(duì)默契的搭檔，共同努力保護(hù)您的應(yīng)用程序免受不同角度的攻擊。CORS專注于控制跨域請(qǐng)求，確保只有受信任的來源可以訪問您的后端資源。與此同時(shí)，CSP則解決內(nèi)容注入攻擊問題，防止未經(jīng)授權(quán)的腳本在您的前端執(zhí)行。

通過結(jié)合這兩種機(jī)制，我們不僅保護(hù)數(shù)據(jù)傳輸，還保護(hù)我們前端的完整性。惡意腳本試圖利用跨源弱點(diǎn)或繞過服務(wù)器端安全措施的企圖都會(huì)被內(nèi)容安全策略(CSP)的警惕性所阻止。

應(yīng)對(duì)挑戰(zhàn)和潛在沖突

同時(shí)實(shí)施CORS和CSP可能會(huì)帶來一些挑戰(zhàn)和沖突。例如，當(dāng)CORS允許來自特定域的跨域請(qǐng)求時(shí)，這些域名應(yīng)該包含在CSP策略中，以便從這些域加載資源。

此外，如果您正在使用內(nèi)聯(lián)腳本/樣式或動(dòng)態(tài)腳本加載，您需要設(shè)置適當(dāng)?shù)腃SP非ces或哈希來允許它們，同時(shí)仍然遵守策略。這兩種機(jī)制之間的協(xié)調(diào)需要仔細(xì)考慮和測(cè)試。

<!-- Sample CSP policy with CORS trusted origin included -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self' 'trusted-scripts.com'; style-src 'self' 'trusted-styles.com'; img-src 'self' data: 'trusted-origin.com'">

最終，結(jié)合CORS和CSP的好處超過了挑戰(zhàn)。您的前端應(yīng)用程序?qū)⒊蔀橐粋€(gè)安全的堡壘，通過多層保護(hù)加固。請(qǐng)記得定期審查和優(yōu)化您的策略，以確保對(duì)新興威脅有強(qiáng)大的防御能力。

所以，讓我們將CORS和CSP和諧地結(jié)合起來，為每個(gè)人創(chuàng)造一個(gè)安全可靠的用戶體驗(yàn)！?

測(cè)試和調(diào)試

作為前端應(yīng)用安全的守護(hù)者，我們必須徹底測(cè)試和調(diào)試我們的CORS和CSP配置，以確保其有效性。讓我們探索一些工具和技術(shù)來應(yīng)對(duì)這個(gè)關(guān)鍵任務(wù)！

測(cè)試CORS和CSP配置的工具和技術(shù)

• Browser Developer Tools：現(xiàn)代瀏覽器提供強(qiáng)大的開發(fā)者工具，可以在控制臺(tái)和網(wǎng)絡(luò)選項(xiàng)卡中顯示CSP違規(guī)情況。它們幫助您識(shí)別和糾正與策略相關(guān)的任何問題。

• Online CSP Analyzers：有幾個(gè)在線工具可以幫助您分析CSP頭部，并提供關(guān)于潛在漏洞和配置錯(cuò)誤的詳細(xì)報(bào)告。

• CORS Tester Extensions：瀏覽器擴(kuò)展程序如“CORS Everywhere”或“CORS Toggle”可讓您測(cè)試應(yīng)用程序的不同CORS配置，幫助您確保跨域請(qǐng)求按預(yù)期工作。

• Security Headers Checkers:在線安全頭檢查器可以評(píng)估您的CORS和CSP頭，更容易發(fā)現(xiàn)任何不一致或弱點(diǎn)。

識(shí)別和解決與跨域請(qǐng)求和內(nèi)容限制相關(guān)的問題

• Console Errors:檢查瀏覽器控制臺(tái)以查找與CORS相關(guān)的錯(cuò)誤和CSP違規(guī)報(bào)告。使用此信息來優(yōu)化您的配置。

• Testing with Different Origins:通過使用各種來源（可信和不可信的）來驗(yàn)證應(yīng)用程序的行為。這樣可以確保您的CORS和CSP策略能夠充分限制訪問。

• Testing Dynamic Content:如果您的應(yīng)用程序動(dòng)態(tài)生成腳本，請(qǐng)測(cè)試和調(diào)整CSP非ces或哈希以適應(yīng)它們。

• Opt-In Reporting:啟用CSP報(bào)告功能，從瀏覽器收集違規(guī)報(bào)告并獲取潛在問題的洞察。這些報(bào)告有助于完善您的策略。

• Iterative Testing（迭代測(cè)試）：隨著您的應(yīng)用程序的發(fā)展，定期進(jìn)行測(cè)試以確保您的政策與最新要求相一致。

<!-- Example of enabling CSP Reporting through the report-uri directive -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; report-uri /csp-violation-report-endpoint">

記住，測(cè)試和調(diào)試是持續(xù)進(jìn)行的過程。保持警惕，積極解決潛在問題，并利用測(cè)試中獲得的見解來優(yōu)化您的CORS和CSP配置。通過這樣做，您將為您的前端應(yīng)用程序?qū)崿F(xiàn)一個(gè)優(yōu)化的、堅(jiān)不可摧的安全姿態(tài)，保護(hù)您的用戶及其數(shù)據(jù)免受任何潛在威脅。祝您測(cè)試愉快！?

現(xiàn)實(shí)世界的例子

讓我們進(jìn)入現(xiàn)實(shí)世界的領(lǐng)域，在那里，CORS和CSP這對(duì)動(dòng)態(tài)二人組以勇氣守護(hù)著前端應(yīng)用程序的安全，展現(xiàn)出他們的實(shí)力！?

審視現(xiàn)實(shí)場(chǎng)景

• 防止跨站腳本攻擊（XSS）：想象一個(gè)允許用戶發(fā)表評(píng)論的博客網(wǎng)站。通過一個(gè)精心制作的內(nèi)容安全策略（CSP），內(nèi)聯(lián)腳本和未經(jīng)授權(quán)的外部腳本被阻止執(zhí)行。這樣可以阻止?jié)撛诘腦SS攻擊，保護(hù)網(wǎng)站的完整性和訪問者的安全。

• 保護(hù)單頁應(yīng)用程序（SPA）中的跨域請(qǐng)求：SPA經(jīng)常從不同域上托管的多個(gè)API獲取數(shù)據(jù)。通過實(shí)施CORS，這些SPA限制跨域請(qǐng)求僅限于授權(quán)服務(wù)器，防止攻擊者利用跨域弱點(diǎn)。

分析本可以避免的安全漏洞

由于CORS配置錯(cuò)誤導(dǎo)致的數(shù)據(jù)泄露：在配置錯(cuò)誤的后端系統(tǒng)中，敏感數(shù)據(jù)可能通過CORS暴露給未經(jīng)授權(quán)的域名。通過正確的CORS策略限制來源，可以避免此類數(shù)據(jù)泄露。

通過CSP繞過進(jìn)行注入攻擊：缺乏CSP策略或限制不嚴(yán)的網(wǎng)站可能會(huì)成為內(nèi)容注入攻擊的目標(biāo)。通過執(zhí)行強(qiáng)大的CSP策略，可以減輕此類安全漏洞。

<!-- Sample strict CSP policy to mitigate content injection -->
<meta http-equiv="Content-Security-Policy" content="default-src 'self'; script-src 'self'; style-src 'self'; object-src 'none'; base-uri 'self'; form-action 'self'; block-all-mixed-content;">

在這些現(xiàn)實(shí)世界的例子中，我們目睹了CORS和CSP的戰(zhàn)略應(yīng)用如何起到一種盔甲的作用，擊退潛在威脅，確保用戶的瀏覽體驗(yàn)更加安全。通過勤奮地應(yīng)用這些安全措施，開發(fā)人員加固了他們的前端應(yīng)用，贏得了受眾的信任，并保護(hù)敏感數(shù)據(jù)不落入錯(cuò)誤的手中。保持警惕，擁抱CORS和CSP的力量，為所有人創(chuàng)造一個(gè)更安全的數(shù)字世界！?

結(jié)束

恭喜，無畏的開發(fā)者們！ 你們已經(jīng)穿越了CORS和CSP的領(lǐng)域，學(xué)習(xí)了這些強(qiáng)大的守護(hù)者如何保護(hù)我們的前端應(yīng)用免受惡意威脅。讓我們回顧一下CORS和CSP的重要性，并激勵(lì)你們?cè)诒Ｗo(hù)Web應(yīng)用方面發(fā)揮帶頭作用！?

CORS和CSP的重要性回顧

CORS，我們?cè)诳缬虮Ｗo(hù)方面的可靠盟友，確保只有授權(quán)的域名可以訪問我們的后端資源。通過控制跨域請(qǐng)求，它阻止了未經(jīng)授權(quán)的訪問，并保護(hù)數(shù)據(jù)免受窺視。另一方面，CSP通過限制內(nèi)容來源，防止內(nèi)容注入攻擊和XSS漏洞，加強(qiáng)了前端的安全性。它們共同構(gòu)成了一道堅(jiān)不可摧的防線，為我們的用戶創(chuàng)造了一個(gè)安全可靠的環(huán)境。

采用最佳實(shí)踐

作為數(shù)字領(lǐng)域的守護(hù)者，我們有責(zé)任在實(shí)施CORS和CSP時(shí)采用最佳實(shí)踐。使用適合您應(yīng)用程序需求的嚴(yán)格策略，僅允許可信任的來源，并認(rèn)真測(cè)試和調(diào)試您的配置。隨著應(yīng)用程序的發(fā)展，定期更新您的策略，保持對(duì)新興威脅的防范。

雖然沒有絕對(duì)安全的措施，但通過將CORS和CSP與其他安全措施結(jié)合起來，您可以為前端應(yīng)用程序提供多重保護(hù)層。如果我們積極主動(dòng)并保持警惕，我們可以加強(qiáng)我們的數(shù)字作品，并為每個(gè)人建立一個(gè)更安全的網(wǎng)絡(luò)。

所以讓我們承諾成為我們應(yīng)用程序所需要的保護(hù)者！采用CORS和CSP，明智地利用它們的影響力，保護(hù)我們的用戶和他們的數(shù)據(jù)安全。讓我們共同創(chuàng)造一個(gè)更安全的數(shù)字未來！?

由于文章內(nèi)容篇幅有限，今天的內(nèi)容就分享到這里，文章結(jié)尾，我想提醒您，文章的創(chuàng)作不易，如果您喜歡我的分享，請(qǐng)別忘了點(diǎn)贊和轉(zhuǎn)發(fā)，讓更多有需要的人看到。同時(shí)，如果您想獲取更多前端技術(shù)的知識(shí)，歡迎關(guān)注我，您的支持將是我分享最大的動(dòng)力。我會(huì)持續(xù)輸出更多內(nèi)容，敬請(qǐng)期待。文章來源地址http://www.zghlxwxcb.cn/news/detail-771951.html