DataV：建立、預覽與發布可視化應用

密碼訪問

1. 在發布對話方塊中，開啟訪問密碼。

2. 在訪問密碼輸入框中，輸入您的驗證密碼。

   密碼長度為6位及以上，且必須具備以下三個條件：

   • 至少包含一個英文大寫字母A～Z。

   • 至少包含一個英文小寫字母a～z。

   • 至少包含一個數字0～9。

   密碼設定成功後，系統會提示已設定訪問限制。

3. 可選：配置驗證有效期間。

   重要

   只有密碼設定成功或開啟Token驗證後，才可配置驗證有效期間。

   • 選中驗證有效期間，可以設定密碼的有效期間，最長為32小時。訪問者首次輸入密碼且成功訪問可視化應用後，在設定的有效期間時間內，可任意訪問該可視化應用而無需輸入密碼。

   • 取消勾選驗證有效期間，每次訪問都需要輸入密碼。

   密碼設定成功後，訪問分享連結時需輸入密碼才能進入。

通過Token驗證

您可以通過Token驗證的方式，將可視化應用的存取權限與您的許可權體系進行整合。

在發布對話方塊中，開啟通過Token驗證開關，即可開啟Token驗證。Token驗證開啟後，您可進行如下操作：

• 擷取Token驗證碼。

  開啟通過Token驗證開關後，DataV會產生一個Token，您需要記錄這個Token，以備後用。

• （可選）配置驗證有效期間。

  • 選中驗證有效期間，可自訂調整Token驗證的有效期間，最長設定為32小時。訪問者首次進行Token驗證並成功訪問可視化應用後，在設定的有效期間時間內，可任意訪問該可視化應用而無需再次進行驗證。

  • 去選中驗證有效期間，每次訪問都需要通過驗證。

Token驗證開啟後，再次開啟可視化應用的分享頁面，會收到一個Access Denied訊息，表示您的訪問被拒絕了。如果想要開啟您的頁面，需要完成以下步驟。

1. 發布可視化應用，記錄可視化應用編碼（URL的最後一段）。

2. 將編碼與目前時間（毫秒）連起來，並用 |（豎線）分隔開。

3. 使用Token通過HMAC-SHA256 base64，對上一步得到的Token驗證碼進行加密。

4. 將時間和加密後的簽名分別命名為_datav_time、_datav_signature。

5. 將它們依次放入URL的querystring中。

   重要

   如果您的可視化應用URL中需要使用GET的方式傳遞參數，為了安全性，建議您使用DataV提供的Token參數簽名校正，詳情請參見DataV分享頁Token參數簽名校正。

   範例程式碼如下：

   • PHP：

     <?php
       $token = "kBwoX9rFX9v4zbOT0Gjd_wr65DZ****";
       $screenID = "03d1b68faeb09671046d1ef43f58****";
       $time = time()*1000;
       $stringToSign = $screenID.'|'.$time;
       $signature = urlencode(base64_encode(hash_hmac('sha256', $stringToSign, $token, true)));
       $url = "http://datav.aliyuncs.com/share/".$screenID."?_datav_time=".$time."&_datav_signature=".$signature;
     ?>
     <iframe width=100% height=100% src="<?=$url?>"/>

   • Node.js：

     const crypto = require('crypto');
     var token = "Ev97wOUSAtJusc3Vsd9O2ngr_vfV****";
     var screenID ="14c5448c00ecde02b065c231d165****";
     var time = Date.now();
     var stringToSign = screenID +'|'+ time;
     var signature = crypto.createHmac('sha256', token).update(stringToSign).digest().toString('base64');
     var url="http://datav.aliyuncs.com/share/"+ screenID +"?_datav_time="+time+"&_datav_signature="+ encodeURIComponent(signature);

   • Java：

     package com.company;
     import java.security.*;
     import java.util.Date;
     import javax.crypto.*;
     import javax.crypto.spec.SecretKeySpec;
     import org.apache.commons.codec.binary.Base64;
     import java.net.URLEncoder;
     public class TokenTest {
         public static String getSignedUrl(String screenID, String token){
             Date date = new Date();
             Long time = date.getTime();
             String stringToSign = screenID + "|" + time;
             String signature = HMACSHA256(stringToSign.getBytes(), token.getBytes());
             String url = "http://datav.aliyuncs.com/share/"+ screenID +"?_datav_time="+time+"&_datav_signature="+ signature;
             return url;
         }
         /**
          *  使用java原生的摘要實現SHA256加密。
          * @param str加密後的報文。
          * @return
          */
         public static String HMACSHA256(byte[] data, byte[] key)
         {
             try  {
                 SecretKeySpec signingKey = new SecretKeySpec(key, "HmacSHA256");
                 Mac mac = Mac.getInstance("HmacSHA256");
                 mac.init(signingKey);
                 return URLEncoder.encode(byte2Base64(mac.doFinal(data)));
             } catch (NoSuchAlgorithmException e) {
                 e.printStackTrace();
             } catch (InvalidKeyException e) {
                 e.printStackTrace();
             }
             return null;
         }
         private static String byte2Base64(byte[] bytes){
             return Base64.encodeBase64String(bytes);
         }
         public static void main(String[] args) throws Exception {
             System.out.println(getSignedUrl("screenId", "token"));
         }
     }

   • C#：

     using System;
     using System.Security.Cryptography;
     using System.Text.RegularExpressions;
     using System.Collections.Generic;
     using System.Linq;
     using System.Web;
     using System.Text;
     
     namespace datavToken
     {
         class Program
         {
             static void Main(string[] args)
             {
                 var dic = new Dictionary<string, string>();  // 自訂參數。
                 dic.Add("datav_sign_no", "123998");         // datav_sign_開頭，需要簽名。
                 dic.Add("datav_sign_lo", "kk");
                 dic.Add("datav_sign_ao", "xx");
     
                 dic.Add("name", "123");   // 不需要簽名。
                 // 分享頁首碼，螢幕分享id、token，自訂參數字典。
                 Console.WriteLine(GenerateUrl("https://datav.aliyun.com/share/", "ca74bea5e45503070d607795e0****", "66DsL2qjrXRHluSJScv_flOUhn****", dic));
             }
             private static string GenerateUrl(string datavBase, string screenId, string token, Dictionary<string, string> customeParams)
             {
                 string pattern = @"^datav_sign_.*";
                 string timestamp = GetTimeStamp();
     
                 // 參數排序。
                 Dictionary<string, string>.KeyCollection keyCol = customeParams.Keys;
                 List<string> signKeys = new List<string>();
     
                 foreach (var item in keyCol.ToList())
                 {
                     if (Regex.IsMatch(item, pattern))
                     {
                         signKeys.Add(item);
                     }
                 }
     
                 // 按照key排序。
                 signKeys = signKeys.OrderBy(k => k).ToList();
     
                 string paramsSignStr = signKeys.Aggregate("", (total, key) =>
                 {
                     if (total != "")
                     {
                         total += "&";
                     }
                     total += key + "=" + customeParams[key];
                     return total;
                 });
                 //不存在參數認證
                 string signStr = screenId + "|" + timestamp;
                 //存在參數認證
                 //string signStr = screenId + "|" + timestamp + "|" + paramsSignStr;
                 
     
                 var encoding = new System.Text.ASCIIEncoding();
                 byte[] keyByte = encoding.GetBytes(token);
                 byte[] messageBytes = encoding.GetBytes(signStr);
                 string signature;
                 using (var hmacsha256 = new HMACSHA256(keyByte))
                 {
                     byte[] hashmessage = hmacsha256.ComputeHash(messageBytes);
                     signature = Convert.ToBase64String(hashmessage);
                 }
     
     
                 var paramDic = new Dictionary<string, string>();
                 paramDic.Add("_datav_time", timestamp);
                 paramDic.Add("_datav_signature", signature);
     
                 foreach (var item in customeParams)
                 {
                     paramDic.Add(item.Key, item.Value);
                 }
                 return datavBase + screenId + "?" + ParseToString(paramDic);
             }
             public static string GetTimeStamp()
             {
                 TimeSpan ts = DateTime.UtcNow - new DateTime(1970, 1, 1, 0, 0, 0, 0);
                 return Convert.ToInt64(ts.TotalMilliseconds).ToString();
             }
             static public string ParseToString(IDictionary<string, string> parameters)
             {
                 IDictionary<string, string> sortedParams = new SortedDictionary<string, string>(parameters);
                 IEnumerator<KeyValuePair<string, string>> dem = sortedParams.GetEnumerator();
     
                 StringBuilder query = new StringBuilder("");
                 while (dem.MoveNext())
                 {
                     string key = dem.Current.Key;
                     string value = dem.Current.Value;
                     if (!string.IsNullOrEmpty(key) && !string.IsNullOrEmpty(value))
                     {
                         query.Append(key).Append("=").Append(HttpUtility.UrlEncode(value)).Append("&");
                     }
                 }
                 string content = query.ToString().Substring(0, query.Length - 1);
     
                 return content;
             }
         }
     }

IP白名單訪問

設定啟用IP白名單後，發布後的可視化應用僅允許在設定範圍內的白名單IP下訪問。

1. 在發布對話方塊中，開啟IP白名單。

2. 在下方IP白名單輸入框中，輸入您的IP，並用“,”號分隔不同的白名單。

   IP白名單設定成功後，當您再次訪問可視化應用的分享連結時，如果您使用了非白名單IP訪問當前可視化應用，可視化應用頁面訪問將被拒絕。