# 安裝用戶端

> 從 Entase CDN 載入 client.js，然後建立執行個體。無需安裝套件，也沒有建置步驟。

用戶端以單一檔案形式透過 Entase CDN 提供。沒有 npm 套件、沒有需要建置的 bundle，也沒有需要保持最新的相依項目 – 您總會取得目前版本。

```html
<script src="https://js.entase.com/client.js"></script>
```

載入指令碼後會定義一個全域 `Entase` 類別。它不會自行執行其他操作：不會發出網絡請求、不會變更 DOM，也不會渲染任何內容。建立執行個體後，一切才會開始。

## 建立執行個體

```js
const entase = new Entase({ pk: 'YOUR_PUBLISHABLE_KEY' });
```

每個頁面只建立 **一個執行個體**，並將其重用於每個活動。建構函式會在 window 上註冊 `message` 監聽器，並開始偵測您的網域獲准使用哪種結帳模式，因此建立多個執行個體只會重複註冊監聽器及重複進行偵測呼叫，沒有任何好處。

每個選項都有預設值，因此不帶引數的 `new Entase()` 亦有效 – 但沒有 `pk`，用戶端無法驗證您的網域是否可使用內嵌結帳，並會一律回退至彈出式視窗。請參閱[結帳模式](/developers/js-client/checkout-modes.md)。

## 非同步載入指令碼

如果您使用 `async` 或 `defer` 載入 `client.js`，內嵌指令碼執行時，該類別尚未存在。程式庫載入完成後會在 `window` 上派發 `entase:ready` 事件，因此請等待該事件：

```html
<script src="https://js.entase.com/client.js" async></script>
<script>
  let entase = null;

  const init = () => { entase = new Entase({ pk: 'YOUR_PUBLISHABLE_KEY' }); };

  if (typeof Entase !== 'undefined') init();
  else window.addEventListener('entase:ready', init);
</script>
```

先進行 `typeof` 檢查很重要：如果指令碼已完成載入，`entase:ready` 已經觸發，監聽它將會永遠等待。

## 清理

在單頁應用程式中，當擁有該執行個體的檢視卸載時，請呼叫 `destroy()`：

```js
entase.destroy();
```

這會移除用戶端註冊的 window 監聽器。已銷毀的執行個體無法重用 – 對它呼叫 `book()` 只會記錄錯誤，不會執行任何操作。請改為建立新的執行個體。

## 內容安全政策

如果您的網站傳送 `Content-Security-Policy` 標頭，結帳功能需要：

- `script-src https://js.entase.com` – 用於載入程式庫。
- `frame-src https://www.entase.com` – 在窗格模式中，結帳會於 iframe 內渲染。
- `connect-src https://www.entase.com` – 用戶端會呼叫 Entase API，以判定獲准使用的結帳模式。

沒有 `frame-src`，窗格模式會顯示空白面板。沒有 `connect-src`，模式偵測會失敗，而每次結帳都會以彈出式視窗開啟。