book-now-sdk

## 1. 引入 SDK 腳本

latest

npm

Version: 1.0.14

Version published: 11 months ago

Weekly downloads: 1

Maintainers: 1

Weekly downloads

Created: last year

Source

TripGuru Book Now SDK 使用說明

1. 引入 SDK 腳本

請在你的 HTML 頁面的 <head> 區塊加入以下 script 標籤：

<script src="https://cdn.jsdelivr.net/npm/book-now-sdk@1.0.14/dist/tripguru-sdk.js"></script>

2. 初始化 SDK

在你的應用程式初始化或掛載時呼叫 TripGuruSDK.init 來設定必要參數：

TripGuruSDK.init({
  apiKey: "你的 apiKey",
  onError: (err) => {
    // api key 錯誤時報錯
    console.log("on error", err.code, err.message);
  },
});

apiKey：由 TripGuru 提供的 API 金鑰，用於驗證和授權。
onSuccess：購買成功後的回調函數。
onError：錯誤回調，包含錯誤碼與訊息。

3. 建立購買按鈕

在你的 HTML 中，將想要觸發購買流程的按鈕，加上以下自訂屬性：

<button data-tripguru-btn data-product-id="2" data-product-type="tour">
  Buy Product 002
</button>
<button data-tripguru-btn data-product-id="3" data-product-type="activity">
  Buy Product 003
</button>

可依據框架在 button 添加自定義的 class name
data-tripguru-btn：標示此按鈕為 SDK 綁定目標。
data-product-id：要購買的商品 ID，請替換成實際的產品編號。

當使用者點擊按鈕時，SDK 會自動開啟一個 iframe modal，進行結帳流程。

範例整合

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <title>TripGuru SDK Demo</title>
    <script src="https://cdn.jsdelivr.net/npm/book-now-sdk@1.0.14/dist/tripguru-sdk.js"></script>
  </head>
  <body>
    <button
      className="bg-primary rounded-lg text-white p-2"
      data-tripguru-btn1.0.1
      data-product-id="2"
    >
      Buy Product 002
    </button>
    <button
      className="bg-primary rounded-lg text-white p-2 ml-2"
      data-tripguru-btn
      data-product-id="3"
    >
      Buy Product 003
    </button>

    <script>
      TripGuruSDK.init({
        apiKey: "your_api_key_here",
        onSuccess: () => {
          console.log("Purchase succeeded!");
        },
        onError: (err) => {
          console.error("Purchase failed:", err.code, err.message);
        },
      });
    </script>
  </body>
</html>

Keywords

sdk

tripguru

FAQs

What is book-now-sdk?

Is book-now-sdk popular?

Is book-now-sdk well maintained?

Package last updated on 22 Jul 2025

Did you know?

Socket for GitHub automatically highlights issues in each pull request and monitors the health of all your open source dependencies. Discover the contents of your packages and block harmful activity before you install or update your dependencies.

Install