数据预取

收藏

我的收藏

{
  "prefetchRules": {
    // 需要配置预取请求的页面
    "pages/index/index": {
      // 请求的url
      "https://developer.bytedance.com/${pageid}": {
        // 请求的方法
        "method": "POST",
        // 请求的header
        "header": {
          "token": "${token}"
        },
        // POST请求的body数据
        "data": {
          "pageSize": "${pageSize}",
          "pageNum": 1
        },
        // 返回结果的类型
        "responseType": "text",
        // 模糊匹配规则，只要包含以下key，并且key对应的值相等就算命中
        "hitPrefetchExtraRules": {
          // 只要请求query中以下key的value相等，则匹配成功
          "requiredQueryKeys": ["a", "b", "c"],
          // 只要请求header中以下key的value相等，则匹配成功
          "requiredHeaderKeys": ["a", "token"],
          // 只要请求data中以下key的value相等，则匹配成功
          "requiredDataKeys": ["a.b", "c"]
        }
      }
    }
  }
}

{
  "prefetchRules": {
    "pages/index/index": {
      "https://developer.bytedance.com/${pageid}?pagesize=${pageSize}&pagenum=1": {}
    }
  }
}

{
  "https://developer.bytedance.com/${pageid}": {
    "method": "POST",
    "header": {
      "token": "${token}"
    },
    "data": {
      "pageSize": "${pageSize}",
      "pageNum": 1
    }
  }
}

{
  "https://developer.bytedance.com/1000": {
    "method": "POST",
    "header": {
      "token": "test_token"
    },
    "data": {
      "pageSize": "10",
      "pageNum": 1
    }
  }
}

{
  "https://developer.bytedance.com/${pageid}?pagesize=${pageSize}&pagenum=1": {
    "header": {
      "token": "${token}"
    },
    "hitPrefetchExtraRules": {
      "requiredQueryKeys": ["pagesize", "pagenum"],
      "requiredHeaderKeys": ["token"],
      "requiredDataKeys": ["common.id", "common.info.pid"]
    }
  }
}

// 预取请求
"https://developer.bytedance.com/1000?pagesize=10&pagenum=1"

// 命中规则
{
    "hitPrefetchExtraRules" :{"requiredQueryKeys": ["pagesize", "pagenum"]}
}

// tt.request 请求

// 命中
"https://developer.bytedance.com/1000?pagesize=10&pagenum=1&other=1&other2=2"

 // 不命中，pagenum值不相等
"https://developer.bytedance.com/1000?pagesize=10&pagenum=2&other=1&other2=2"

// 不命中，缺少pagesize
"https://developer.bytedance.com/1000?pagenum=1&other=1&other2=2"

// 预取请求
"https://developer.bytedance.com/1000?pagesize=10&pagenum=1":{
    header:{
        token: "test_token",
        other: 1
    }
}

// 命中规则
{
    "requiredHeaderKeys": ["token"]
}

// tt.request 请求

// 不命中，query 严格匹配，多了 other
"https://developer.bytedance.com/1000?pagesize=10&pagenum=1&other=1"

// 命中，other 为不影响判断的 key
"https://developer.bytedance.com/1000?pagesize=10&pagenum=1":{
    header:{
        token: "test_token",
        other: 5
    }
}

// 不命中，token的值不一致
"https://developer.bytedance.com/1000?pagesize=10&pagenum=1":{
    header:{
        token: "test",
        other: 1
    }
}

// app.json 中配置的预取规则
{
  "https://developer.bytedance.com/${pageid}?pagesize=${pageSize}&pagenum=1": {
    "header": {
      "token": "${token}"
    },
    "data": {
      "common": {
          "id":"${id}",
          "info":{
              "pid":"${pid}",
              "purl":"${purl}"
          }
      }
    },
    "hitPrefetchExtraRules": {
      "requiredQueryKeys": ["pagesize", "pagenum"],
      "requiredHeaderKeys": ["token"],
      "requiredDataKeys": ["common.id", "common.info.pid"]
    }
  }
}

// 端上解析出的预取请求
{
    ...
    "data": {
      "common": {
          "id":"aj123hgh32",
          "info":{
              "pid":"k3k4h473ga",
              "purl":"https://www.aaa.com/a.png"
          }
      }
    }
    ...
}

// 如果 tt.request 为以下信息，则命中，purl 等其他 KV 不影响判断
{
    ...
    "data": {
      "common": {
          "id":"aj123hgh32",
          "info":{
              "pid":"k3k4h473ga",
              "purl":"https://www.aaa.com/b.png",
              "kkk":"ppp"
          },
          "aaa":"bbb"
      }
    }
    ...
}

// 如果 tt.request 为以下信息，则未命中，id不匹配
{
    ...
    "data": {
      "common": {
          "id":"123",
          "info":{
              "pid":"k3k4h473ga"
          }
      }
    }
    ...
}

// 如果 tt.request 为以下信息，则未命中，pid不匹配
{
    ...
    "data": {
      "common": {
          "id":"aj123hgh32",
          "info":{
              "pid":"123"
          }
      }
    }
    ...
}



//未命中，不支持数组形式
{
    ...
    "data":{
        "common":[
            {
                "id":"aj123hgh32",
                "info":{
                    "pid":"123"
                }
            }
        ]
    }
    ...
}


//未命中，根据"common"，要匹配common对象所有字段，purl 不同
{
    ...
    "data":{
        "common": {
          "id":"aj123hgh32",
          "info":{
              "pid":"k3k4h473ga",
              "purl":"https://www.aaa.com/2/a.png"
          }
      }
    }
    ...
}

// app.json中配置的预取规则
{
  "prefetchRules": {
    "pages/index/index": {
      "https://developer1.bytedance.com?testid=${id}&testdata=${sData}": {},
      "https://developer1.bytedance.com/${sid}?testid=${id}&testdata=${sData}": {
        "method": "POST",
        "header": {
          "testCookie": "${sCookie}",
          "token": "xxxs1823730"
        },
        "data": {
          "mData": "${mData}"
        },
        "responseType": "",
        "hitPrefetchExtraRules": {
          "requiredQueryKeys": ["testid", "testdata"],
          "requiredHeaderKeys": ["testCookie", "token"]
        }
      }
    }
  }
}

//storage
const testCookie = tt.getStorageSync("sCookie");
const mData = tt.getStorageSync("mData");

//request
const token = "xxxs1823730";
const { sid, testid } = option.query;
const url = `https://developer1.bytedance.com/${sid}?testid=${testid}&testdata=${sData}`;
const header = { testCookie, token };
const data = { mData };

tt.request({
  url,
  header,
  data,
  method: "POST",
  dataType: "json",
  responseType: "text",
  // 如果需要使用预取结果缓存，必须添加 usePrefetchCache: true
  usePrefetchCache: true,
  success: (res) => {
    console.log("返回数据是否来自预取:", res.isPrefetch);
    console.log("请求数据:", res.data);
  },
});