首页 文章

如果dev工具未打开,则Chrome请求会在Chrome中延迟

提问于
浏览
0

我正在使用一些JavaScript从API endpoint获取数据的应用程序中使用webpage .

在Safari和FireFox中,我可以连续多次请求页面,并且可以快速获取和显示数据 . 相比之下,在Chrome中,仅当开发工具处于打开状态或我的缓存已清除时才会提取并显示数据(尽管我没有在开发工具中禁用缓存) .

如果开发工具未打开或Chrome已缓存页面,则重新加载页面大约需要10秒钟才能生成请求并显示数据 .

有谁知道可能导致这种行为的原因是什么? Full app source .

1 回答

  • 0

    有问题的API请求使用isomorphic-fetch来发出请求 . 我用旧的学校AJAX请求替换了isomorphic-fetch代码,现在请求按预期立即触发 .

    Before

    import fetch from 'isomorphic-fetch';
    
    export const fetchTreeData = () => {
      return function(dispatch) {
        return fetch(config.endpoint + 'tree')
          .then(response => response.json()
            .then(json => ({
              status: response.status,
              json
            })))
          .then(({ status, json }) => {
            if (status >= 400) dispatch(treeRequestFailed())
            else dispatch(receiveTreeData(json))
          }, err => { dispatch(treeRequestFailed(err)) })
      }
    }
    

    After

    export const fetchTreeData = () => {
      return function(dispatch) {
        get(config.endpoint + 'tree',
          (data) => dispatch(receiveTreeData(JSON.parse(data))),
          (e) => console.log(e))
      }
    }
    
    const get = (url, success, err, progress) => {
      const xmlhttp = new XMLHttpRequest();
      xmlhttp.onreadystatechange = () => {
        if (xmlhttp.readyState == XMLHttpRequest.DONE) {
          if (xmlhttp.status === 200) {
            if (success) success(xmlhttp.responseText);
          } else {
            if (err) err(xmlhttp);
          }
        };
      };
      xmlhttp.onprogress = (e) => {if (progress) progress(e)};
      xmlhttp.open('GET', url, true);
      xmlhttp.send();
    };
    

相关问题