
# JavaScript SDK使用说明
#### 操作场景
使用JavaScript语言调用APP认证的API时，您需要先获取SDK，然后新建工程，最后参考API调用示例调用API。
JavaScript SDK支持Node.js和浏览器两种运行环境，本章节以Node.js开发环境为例介绍。
#### 前提条件
- 已获取API的调用信息，具体请参见[开发准备](https://support.huaweicloud.com/devg-roma/apic-dev-190216004.html)。
- 已安装开发工具和JavaScript开发语言环境，具体请参见[开发准备](https://support.huaweicloud.com/devg-roma/apic-dev-190216004.html)。
  - Node.js安装后，在命令行中，用npm安装"moment"和"moment-timezone"模块。
    ```
    npm install moment --save
    npm install moment-timezone --save
    ```
    
  
  - 已在IntelliJ IDEA中安装Node.js插件，如果未安装，请按照[图1]所示安装。
    图1安装Node.js插件   
    ![](https://support.huaweicloud.com/devg-roma/zh-cn_image_0219606335.png "点击放大") 
   
- 浏览器版本为Chrome 89.0或以上版本。
 
#### 获取SDK
**旧版界面**：登录ROMA Connect实例控制台，在"服务集成 APIC \> API调用"的"SDK"页签中下载SDK。
**新版界面**：登录ROMA Connect实例控制台，在"服务集成 APIC \> 凭据管理"的"SDKs"页签中下载SDK。
解压后目录结构如下：
| 名称                          | 说明                   |
|:---|:---|
| signer.js                   | SDK代码                |
| node_demo.js                | Node.js示例代码          |
| demo.html                   | 浏览器示例代码              |
| demo_require.html           | 浏览器示例代码（使用require加载） |
| test.js                     | 测试用例                 |
| js\\hmac-sha256.js          | 依赖库                  |
| licenses\\license-crypto-js | 第三方库license文件        |
| licenses\\license-node      | 第三方库license文件        |
   
#### 创建工程
1. 打开IntelliJ IDEA，选择菜单"File \> New \> Project"。 弹出"New Project"对话框。选择"Static Web"，单击"Next"。
   图2New Project   
   ![](https://support.huaweicloud.com/devg-roma/zh-cn_image_0219606336.png "点击放大") 
2. 单击"..."，在弹出的对话框中选择解压后的SDK路径，单击"Finish"。
   图3选择解压后的SDK路径   
   ![](https://support.huaweicloud.com/devg-roma/zh-cn_image_0219606337.png "点击放大") 
3. 完成工程创建后，目录结构如下。
   图4新建工程的目录结构   
   ![](https://support.huaweicloud.com/devg-roma/zh-cn_image_0219606338.png)
   - node_demo.js：Node.js示例代码，请根据实际情况修改参数后使用。具体代码说明请参考[调用API（Node.js）示例]。
   
   - demo.html：浏览器示例代码，请根据实际情况修改参数后使用。具体代码说明请参考[调用API（浏览器）示例]。
    
4. 单击"Edit Configurations"，弹出"Run/Debug Configurations"对话框。
   图5Edit Configurations   
   ![](https://support.huaweicloud.com/devg-roma/zh-cn_image_0219606339.png) 
5. 单击"+"，选择"Node.js"。
   图6选择Node.js   
   ![](https://support.huaweicloud.com/devg-roma/zh-cn_image_0219606340.png) 
6. "JavaScript file"选择"node_demo.js"，单击"OK"，完成配置。
   图7选择node_demo.js   
   ![](https://support.huaweicloud.com/devg-roma/zh-cn_image_0219606341.png "点击放大") 
 
 #### 调用API（Node.js）示例
1. 在工程中引入signer.js。
   ```
   var signer = require('./signer')
   var http = require('http')
   ```
   
2. 生成一个新的Signer，输入API所授权凭据的Key和Secret，可参考[获取API的调用信息](https://support.huaweicloud.com/devg-roma/apic-dev-190216004.html#apic-dev-190216004__section17143919101020)获取。
   ```
   var sig = new signer.Signer()
   // Directly writing AK/SK in code is risky. For security, encrypt your AK/SK and store them in the configuration file or environment variables. 
   // In this example, the AK/SK are stored in environment variables for identity authentication. Before running this example, set environment variables HUAWEICLOUD_SDK_AK and HUAWEICLOUD_SDK_SK. 
   sig.Key = process.env.HUAWEICLOUD_SDK_AK
   sig.Secret = process.env.HUAWEICLOUD_SDK_SK
   ```
   
3. 生成一个Request对象，指定方法名、请求url和body，可参考[获取API的调用信息](https://support.huaweicloud.com/devg-roma/apic-dev-190216004.html#apic-dev-190216004__section17143919101020)获取。
   ```
   var r = new signer.HttpRequest("POST", "c967a237-cd6c-470e-906f-a8655461897e.apigw.exampleRegion.com/app1?a=1");
   r.body = '{"a":1}'
   ```
   
4. 给请求添加x-stage头，内容为环境名。如有需要，添加需要签名的其他头域。
   ```
   r.headers = { "x-stage":"RELEASE" }
   ```
   
5. 进行签名，执行此函数会生成请求参数，用于创建http(s)请求，请求参数中添加了用于签名的X-Sdk-Date头和Authorization头。
   ```
   var opts = sig.Sign(r)
   ```
   
6. 访问API，查看访问结果。如果使用https访问，则将"http.request"改为"https.request"。
   ```
   var req=http.request(opts, function(res){
           console.log(res.statusCode)  
           res.on("data",function(chunk){
   console.log(chunk.toString())
   })
   })
   req.on("error",function(err){
   console.log(err.message)
   })
   req.write(r.body)
   req.end()
   ```
   
 
 #### 调用API（浏览器）示例
使用浏览器访问API，需要注册支持OPTIONS方法的API，具体步骤请参见创建OPTIONS方式的API，且返回头中带有"Access-Control-Allow-\*"相关访问控制头域，可在创建API时通过开启CORS来添加这些头域。
1. 在html中引入signer.js及依赖。
   ```
   <script src="js/hmac-sha256.js"></script>
   <script src="js/moment.min.js"></script>
   <script src="js/moment-timezone-with-data.min.js"></script>
   <script src='signer.js'></script>
   ```
   
2. 进行签名和访问。
   ```
   var sig = new signer.Signer()
   sig.Key = process.env.HUAWEICLOUD_SDK_AK
   sig.Secret = process.env.HUAWEICLOUD_SDK_SK
   var r= new signer.HttpRequest()
   r.host = "c967a237-cd6c-470e-906f-a8655461897e.apigw.exampleRegion.com"
   r.method = "POST"
   r.uri = "/app1"
   r.body = '{"a":1}'
   r.query = { "a":"1","b":"2" }
   r.headers = { "Content-Type":"application/json" }
   var opts = sig.Sign(r)
   var scheme = "https"
   $.ajax({
   type: opts.method,
   data: req.body,
   processData: false,
   url: scheme + "://" + opts.hostname + opts.path,
   headers: opts.headers,
   success: function (data) {
   $('#status').html('200')
   $('#recv').html(data)
   },
   error: function (resp) {
   if (resp.readyState === 4) {
   $('#status').html(resp.status)
   $('#recv').html(resp.responseText)
   } else {
   $('#status').html(resp.state())
   }
   },
   timeout: 1000
   });
   ```
   
 
