如何使用剪貼簿 API 在頁面載入時讀取剪貼簿內容？

如何在頁面載入時擷取剪貼簿內容

Web 瀏覽器提供用於存取剪貼簿的API，讓您能夠在頁面上檢索其內容無需使用者互動即可載入。此功能對於預先填入文字欄​​位或顯示剪貼簿資料等任務特別有用。

使用剪貼簿 API

剪貼簿 API (navigator.clipboard) 提供了方法稱為 readText()。顧名思義，它允許您從剪貼簿讀取當前文字內容。

您可以透過兩種方式使用此 API：非同步/等待語法或 Promise 語法。

使用Async/Await 語法：

<code class="javascript">const text = await navigator.clipboard.readText();</code>

使用Promise 語法：

<code class="javascript">navigator.clipboard.readText()
  .then(text => {
    console.log('Pasted content: ', text);
  })
  .catch(err => {
    console.error('Failed to read clipboard contents: ', err);
  });</code>

使用Promise 語法：

要注意的是，這個API會提示使用者一個權限請求對話框。這可確保惡意腳本在未經使用者同意的情況下無法存取剪貼簿資料。

限制與解決方法

從版本 109 開始，剪貼簿 API 無法在 Firefox 中運作。如果您需要支援 Firefox 用戶，可以考慮使用第三方剪貼簿庫。

要從控制台執行 API 程式碼，可以使用逾時並快速點選網站視窗。

<code class="javascript">setTimeout(async () => {
  const text = await navigator.clipboard.readText();
  console.log(text);
}, 2000);</code>

其他資源

有關更多資訊和使用指南，請參閱以下Google 開發者文件：

• [剪貼板API](https:// /developer.mozilla.org/en-US/docs/Web/API/Clipboard_API)
• [規格](https://w3c.github.io/clipboard-apis /)

以上是如何使用剪貼簿 API 在頁面載入時讀取剪貼簿內容？的詳細內容。更多資訊請關注PHP中文網其他相關文章！