透過Discord運行Discord活動時，您可能會遇到內容安全策略（CSP）問題。您可以透過確保網路請求遵循 Discord 代理 規則來修復這些問題。

這可以手動完成...或者你可以讓@robojs/patch處理它。

什麼是CSP？

內容安全策略 (CSP) 是一種安全標準，有助於防止 跨站腳本 (XSS) 攻擊。它控制頁面可以載入哪些資源以及可以向何處發送資料。

當您在Discord 中運行Discord 活動 時，您實際上是在使用Discord 代理 作為中間人，這意味著它設定了自己的 CSP 規則。如果您的網路請求不遵守這些規則，它們將被阻止。

• 除非以 /.proxy 為前綴，否則像 /api/token 這樣的相對請求將被阻止。
• 像 https://example.com/api/token 這樣的外部請求將被阻止，除非它們被映射或代理。

解決 CSP 違規問題

如上所述，您所要做的就是確保您的網路請求遵循 Discord 代理 規則。在某些情況下，這包括將 /.proxy 新增至請求路徑的開頭。

// Before
fetch('/api/token')

// After
fetch('/.proxy/api/token')

然而，WebSockets 可能有點棘手。特別是當依賴熱模組替換（HMR）時，它會在您自己的活動之前加載，例如Vite。因此，我們創建了 @robojs/patch 來為您處理一切。

修補你的活動

@robojs/patch 是一個輕量級軟體包，可以修補您的網路請求以遵循 Discord 代理 規則。它透過更新 fetch 和 WebSocket 全域變數來運作。

npm install @robojs/patch

根據您的專案設置，我們有不同的方法來應用此補丁。

方式一：Vite插件（建議）

如果您使用Vite，您可以將補丁作為插件應用到您的Vite配置檔案中。

import { DiscordProxy } from '@robojs/patch'
import { defineConfig } from 'vite'

export default defineConfig({
    plugins: [DiscordProxy.Vite()]
})

我們推薦此方法，因為它允許補丁在Vite的HMR客戶端之前運行，確保其正常工作。

方法二：函數調用

如果您沒有使用Vite，您可以直接呼叫函數來套用補丁。

import { DiscordProxy } from '@robojs/patch'

DiscordProxy.patch()

請務必在專案開始時、載入其他腳本之前呼叫此函數。 （例如，index.js 檔案的頂部）

➞？ 文件： @robojs/patch

外部請求

這不會影響對外部 URL 發出的請求。如果您遇到CSP問題，您可以透過建立您自己的代理或在Discord開發者入口網站中映射它們來解決這些問題。

➞？ 教學： 使用代理解決 CSP 問題

使用 Node.js 代理程式解決 Discord 活動中的內容安全策略 (CSP) 問題

WavePlay 的 WavePlay 工作人員 ・ 6 月 17 日

#不和諧 #程式設計 ＃節點 #javascript

對 Discord 活動有興趣？

Robo.js 是一個強大的框架，用於輕鬆建立 Discord 活動。它提供了廣泛的功能和工具來幫助您創建史詩般的 Discord 體驗！

加入我們的Discord Server與其他開發人員聊天、提出問題並分享您的專案。我們是一群友善的人，總是很樂意提供協助！另外，我們自己的人工智慧機器人，Sage，可以幫助您解決任何問題。

➞？ 社群：加入我們的 Discord 伺服器

➞？ 教學： 使用 Robo.js 在幾秒鐘內創建一個 Discord 活動

機器人 - 想像魔法

透過輕鬆的活動、機器人、伺服器等來增強 Discord！ ⚡ | 83 會員

不和諧網站

使用 Robo.js 在幾秒鐘內創建一個 Discord 活動

WavePlay 的 WavePlay 工作人員 ・ 4 月 9 日

#不和諧 #sdk #javascript #機器人