JS實現預覽範本時進行密碼效驗

1.1 版本

1.2 預期效果

使用者希望對範本內容進行加密，確定擁有密碼的使用者方可查看範本內容。

1.3 實現思路

透過JS事件，實現預覽範本時，先彈出密碼輸入框。密碼驗證成功後方可查看範本主體內容。

2.1 新增事件

以 GettingStarted.cpt 為例，開啟%FR_HOME%\webapps\webroot\WEB-INF\reportlets\GettingStarted.cpt

點選菜單欄「範本>範本Web屬性」，點選「分頁預覽設定」，選擇「為該範本單獨設定」，新增一個「載入起始」事件。

輸入 JavaScript 代碼，如下圖所示：

JavaScript代碼如下：

const password = () => {
  var i = 1;
  var passwd = prompt("請輸入密碼:");
  while (i < 3) {
    //點選取消，prompt 傳回 null
    if (passwd === null) {
      alert("您已取消輸入，頁面將關閉");
      window.close(); // 或者跳轉
      // location.href = "https://www.hao123.com/";
      return;
    }
    //給員工3次輸入機會
    if (passwd == "123") {
      //假設密碼預先設定為123
      break;
    }
    i++;
    var passwd = prompt("密碼錯誤!請重新輸入:\n你還有" + (4 - i) + "次機會。");
  }
  if (passwd != "123" && i == 3) {
    //如果連續3次輸錯
    alert("連續密碼錯誤，本頁面關閉"); //彈出本資訊
    window.close(); //本頁面關閉
    //或者可以跳轉至其他頁面，程式碼如下
    //location.href="https://www.hao123.com/"     }
    return "";
  }
};
password();

注1：在「範本Web屬性」中，請根據範本預覽方式，選擇正確的預覽設定 Tab 。

注2：使用者請自行修改程式碼中的密碼，預設為 123 。

注3：若為 FVS 範本，請在頂部菜單欄「範本>頁面載入結束事件」中輸入相同 JavaScript 程式碼 。

注4：若為決策報表，請選中 body ，在「事件」中新增「初始化後」事件，JavaScript 程式碼相同。如下圖所示：

2.2 效果預覽

儲存範本，點選預覽。預覽範本主體時，預設彈出密碼輸入框。

• 若正確輸入密碼，則進入範本預覽頁面。

• 若三次輸錯密碼，則自動關閉該瀏覽器視窗。

注1：僅範本主體部分進行加密，參數面板部分不在加密範圍內。

注2：不支援行動端。

點選下載範本：JS實現預覽範本時進行密碼效驗.cpt