緩存api中檢索的JavaScript文件未執行

在不使用服務工作人員的Web純香草JavaScript應用程序中，我想顯式緩存位於AWS S3文件服務器上的JavaScript文件。下面的腳本會坐在index.html文件的應用程序（我已經修改了URL，因爲它是一個客戶端項目）：緩存api中檢索的JavaScript文件未執行

<script> 
    caches.match('https://s3.amazonaws.com/com.myproject/myjavascript.js') 
    .then(function(response) { 
     if (response) { 
      return response; 
     } else { 
      fetch('https://s3.amazonaws.com/com.myproject/myjavascript.js') 
      .then(function(res) { 
       return caches.open('mycache') 
       .then(function(cache) { 
cache.put('https://s3.amazonaws.com/com.myproject/myjavascript.js',res.clone()); 
        console.log(res.clone()); 
        return res; 
       }); 
      }); 
     } 
    }); 
</script>

我認爲此代碼應做到以下幾點：檢查myjavascript。 js文件在緩存中。如果是，則返回將由瀏覽器執行的JavaScript文件。如果在緩存中未找到myjavascriptfile.js，則會將其提取並放入子緩存'mycache'中，最後返回到將執行的瀏覽器。

運行此操作後，我在緩存中找到文件的URL，其響應爲「Ok」，但該代碼未被瀏覽器執行，並且我沒有在Chrome瀏覽器中看到源文件內容開發者工具。

爲什麼這不起作用？我在這方面的想法出了什麼問題。

非常感謝，弗雷德

來源

2017-10-15 Fred

你在控制檯日誌中得到什麼？ – Hunter

你確定這不能使用htaccess，http頭等聲明嗎？此外，這些javascript命令是否與所有當前瀏覽器兼容？另外，可能有一個js庫來處理這個問題。 –

感謝您的評論Eyal。 Fetch具有相當不錯的瀏覽器支持（全球目前爲79％：http：//www.caniuse.com/#search=fetch）。這是一個技術要求，我使用了Vanilla JavaScript，並且是JQuery可以處理的。 – Fred

fetch本身不會執行JavaScript。它只是請求指定的內容並使其可供代碼訪問。如果你真的想繼續這種方法，可以採取文字和評估它。

const url = 'https://unpkg.com/[email protected]/underscore-min.js'; 
caches.match(url) 
    .then(function(response) { 
    if (response) { 
     return response; 
    } else { 
     return fetch(url) 
     .then(function(res) { 
      return caches.open('mycache') 
      .then(function(cache) { 
       cache.put(url,res.clone()); 
       console.log(res.clone()); 
       return res; 
      }); 
     }); 
    } 
    }) 
    .then(function(response) { 
    console.log(response); 
    response.text().then(function(text) { 
     eval(text); 
     console.log(_); 
    }); 
    });

注：Why is using the JavaScript eval function a bad idea?

你的代碼示例是爲服務工作中常見的模式。它在這種情況下工作的原因是最初的請求是從<script>標記而不是方向調用fetch。由於<script>標籤，瀏覽器會自動執行返回的內容。

<script src="https://unpkg.com/[email protected]/underscore-min.js"></script>

來源

2017-10-16 15:17:50 abraham

感謝亞伯拉罕對你的出色和明確的解釋。但是，當它第一次執行並且它嘗試訪問final then子句中的response.text（）時，我會收到錯誤消息「Can not read property'text of undefined」。第二次運行它時，它會從緩存中提取腳本，並且可以通過控制檯日誌查看該代碼，但代碼沒有執行。當我簡單地將

相關問題

緩存api中檢索的JavaScript文件未執行

回答

相關問題