将JavaScript文件作为文件的脱机版本存储在localStorage中是否存在安全风险？

我有一个应用程序，它使用对

example.php

的AJAX调用读取

example.js

的内容，然后每次用户在手机上打开应用程序时，将

example.js

保存到变量

localStorage.exampleJS

。 AJAX调用使用以下jQuery：

$.ajax({
    type: "POST",
    url: "https://example.com/example.php",
    success: function(response){
        localStorage.exampleJS = response;
    },
});

if(navigator.onLine){
    $("head").append("<script src='https://example.com/example.js'></script>");
}
else{
    $("head").append("<script>" + localStorage.exampleJS + "</script>");    
}

example.php

包含以下内容：

<?php
    echo file_get_contents('example.js');
?>

如果用户没有internet连接，我将使用以下jQuery运行脱机版本：

$.ajax({
    type: "POST",
    url: "https://example.com/example.php",
    success: function(response){
        localStorage.exampleJS = response;
    },
});

if(navigator.onLine){
    $("head").append("<script src='https://example.com/example.js'></script>");
}
else{
    $("head").append("<script>" + localStorage.exampleJS + "</script>");    
}

if（navigator.onLine）{
$（“标题”）。附加（“”）；
}
否则{
$（“head”）.append（“+localStorage.exampleJS+”）；
}

---

我知道这可能会有安全风险。这种做法不好吗？以这种方式保存脱机版本是否存在安全风险？有更好的方法吗？谢谢

我认为在本地存储中存储文件没有什么害处，但必须记住以下几点

• 文件大小不应大于本地存储大小。在任何时候，如果您可以使用完整的本地存储，那么您将无法存储更多的文件
• 确保您的所有文件都是丑陋和缩小的，因为这将有助于您的安全和空间优化。由于uglfy不是人类可读的，所以任何试图阅读它的人都无法阅读，因为文件的形式很难看，而minify有助于减小文件大小

---

你已经发明了离线功能如何与渐进式web应用程序协同工作。基本思想是一样的——当应用程序在线运行时，它会缓存来自服务器的数据（可能是一些变化不大但总是获取最新信息很有用的东西）。然后，如果应用程序脱机运行，它将使用缓存的数据，而不是联系服务器。我建议研究PWA，因为它们有一个更强大的机制，使用服务人员在后台处理缓存/检索，并将应用程序逻辑与在线/离线逻辑以及其他改进隔离开来。