

本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。

# 使用 API Gateway 為 REST API 所產生的 JavaScript 軟體開發套件
<a name="how-to-generate-sdk-javascript"></a>

下列程序顯示如何使用 API Gateway 產生的 JavaScript SDK。

**注意**  
這些說明假設您已完成[在 API Gateway 中為 REST API 產生 SDK](how-to-generate-sdk.md)中的指示。

**重要**  
如果您的 API 只定義了 ANY 方法，則產生的軟體開發套件將不會包含 `apigClient.js` 檔案，而且您將需要自行定義 ANY 方法。

**安裝、啟動及呼叫 API Gateway 為 REST API 所產生的 JavaScript 軟體開發套件**

1. 將您稍早下載之 API Gateway 所產生的 .zip 檔案內容解壓縮。

1. 針對 API Gateway 所產生之軟體開發套件將會呼叫的所有方法，啟用跨來源資源分享 (CORS)。如需說明，請參閱[API Gateway 中 REST API 的 CORS](how-to-cors.md)。

1. 在您的網頁中，包含下列指令碼的參考。

   ```
   <script type="text/javascript" src="lib/axios/dist/axios.standalone.js"></script>
   <script type="text/javascript" src="lib/CryptoJS/rollups/hmac-sha256.js"></script>
   <script type="text/javascript" src="lib/CryptoJS/rollups/sha256.js"></script>
   <script type="text/javascript" src="lib/CryptoJS/components/hmac.js"></script>
   <script type="text/javascript" src="lib/CryptoJS/components/enc-base64.js"></script>
   <script type="text/javascript" src="lib/url-template/url-template.js"></script>
   <script type="text/javascript" src="lib/apiGatewayCore/sigV4Client.js"></script>
   <script type="text/javascript" src="lib/apiGatewayCore/apiGatewayClient.js"></script>
   <script type="text/javascript" src="lib/apiGatewayCore/simpleHttpClient.js"></script>
   <script type="text/javascript" src="lib/apiGatewayCore/utils.js"></script>
   <script type="text/javascript" src="apigClient.js"></script>
   ```

1. 在您的程式碼中，使用類似如下的程式碼來初始化 API Gateway 所產生的軟體開發套件。

   ```
   var apigClient = apigClientFactory.newClient();
   ```

   若要使用 AWS 登入資料初始化 API Gateway 產生的 SDK，請使用類似以下的程式碼。如果您使用 AWS 登入資料，對 API 的所有請求都會簽署。

   ```
   var apigClient = apigClientFactory.newClient({
     accessKey: 'ACCESS_KEY',
     secretKey: 'SECRET_KEY',
   });
   ```

   若要搭配 API Gateway 所產生的軟體開發套件使用 API 金鑰，請使用類似如下的程式碼，將 API 金鑰當做參數傳遞給 `Factory` 物件。如果您使用 API 金鑰，則會將它指定為 `x-api-key` 標頭的一部分，而且 API 的所有請求都會經過簽署。這表示您必須為每個請求設定適當的 CORS Accept 標頭。

   ```
   var apigClient = apigClientFactory.newClient({
     apiKey: 'API_KEY'
   });
   ```

   

1. 使用類似如下的程式碼，在 API Gateway 中呼叫 API 方法。每個呼叫會傳回成功與失敗回呼的結果。

   ```
   var params = {
     // This is where any modeled request parameters should be added.
     // The key is the parameter name, as it is defined in the API in API Gateway.
     param0: '',
     param1: ''
   };
   
   var body = {
     // This is where you define the body of the request,
   };
   
   var additionalParams = {
     // If there are any unmodeled query parameters or headers that must be
     //   sent with the request, add them here.
     headers: {
       param0: '',
       param1: ''
     },
     queryParams: {
       param0: '',
       param1: ''
     }
   };
   
   apigClient.methodName(params, body, additionalParams)
       .then(function(result){
         // Add success callback code here.
       }).catch( function(result){
         // Add error callback code here.
       });
   ```

   此處，*methodName* 是從方法請求的資源路徑與 HTTP 動詞建構而來。對於 SimpleCalc API，開發套件方法用於 API 方法 

   ```
   1. GET /?a=...&b=...&op=...
   2. POST /
   
      { "a": ..., "b": ..., "op": ...}
   3. GET /{a}/{b}/{op}
   ```

   對應的開發套件方法如下所示：

   ```
   1. rootGet(params);      // where params={"a": ..., "b": ..., "op": ...} is resolved to the query parameters
   2. rootPost(null, body); // where body={"a": ..., "b": ..., "op": ...}
   3. aBOpGet(params);      // where params={"a": ..., "b": ..., "op": ...} is resolved to the path parameters
   ```

   