钉钉微应用 - - - - - 钉钉内打开新页签

1. 引入安装dingapi

// 方案1 html引入
<script src="https://g.alicdn.com/dingding/open-develop/1.9.0/dingtalk.js"></script>

// 方案2 npm安装
npm install dingtalk-jsapi

2. 页面内定义方法

    /**
     * 钉钉内部 打开新的页签
     * @param {*} url
     */
    const openNewTabs = (url) => {
    
    
      dd.biz.util.invokeWorkbench({
    
    
        app_url: url,
        app_info: {
    
    
          app_tab_key: "123",
          app_refresh_if_exist: true,
          app_active_if_exist: true,
        },
        onSuccess: function (result) {
    
    
          console.log("result: ", result);
        },
        onFail: function (err) {
    
    
          console.log("err: ", err);
        },
      });
    };

3. 使用

在需要的逻辑处直接调用上述方法即可，如

const queryString = new URLSearchParams(query).toString();
let url = `${
      
      BASE_URL}?${
      
      queryString}`;
openNewTabs(url);

4. 遇到的问题

1. jsapi ticket 签名失败
   errorMessage: "签名校验失败,nonce:[K3GweCfFRNGqpFQk],timestamp:[1718851632],url:[*****],ticketList:[*******]"

注意：
后端生成签名时使用的的url不要包含#

因为如果使用包含#号url进行签名生成，钉钉生成的签名会忽略#及其后面的内容。
所以签名校验会失败！！！！