javascript - 对引用图像/字体/文件/等的 Web 应用程序的建议

标签 javascript html css github-pages google-sites

我在工作中一直致力于一个交互式静态 Web 应用程序元素,并且我已经完成了我想要的一切,还有一些小的最后障碍。我在没有框架的情况下用 HTML、CSS 和 JS 编写了所有内容。一切都在客户端顺利运行,我什至把它放在 Github Pages 上,它在那里也运行良好。问题是这样的:目前,我有一些数据硬编码到 JS 文件中的字符串中,我宁愿 JS 引用某种 excel 表(.csv、.xlxs 或 Google 表)或包含数据的文本文件.

我知道当用户不直接选择文件(通过 input)时这会违反安全策略,所以我正在考虑使用 Google 协作平台(如果我没记错的话,它可以引用嵌入式 Google 表格?)。但是,我相当确定这并不能让我自由使用我想要的一切(即图像、自定义字体以及 css 和 js)。

所有代码都在 this repo 中,但我认为显示代码对我提出的问题没有帮助。

我想真正的问题是,我们希望该程序在未来可以继续使用,并且我以外的人(不一定知道代码如何工作)可以更新数据。最重要的是,我们不希望对数据进行硬编码,我们需要一个包含目录中所有内容的解决方案。

旁注,我想尽量远离服务器和数据库,但如果那可能是我唯一的解决方案,那么我想我别无选择。

最佳答案

只有当您的 Web 应用程序通过 file://协议(protocol)运行时,安全策略才是一个问题 - 只要您有任何类型的最小 Web 服务器(应用程序是静态的使这更容易)来运行它或托管应用程序在 GitHub 页面上,您将能够通过 Ajax 从相对路径中提取数据文件。

在这里使用 CSV 可能是最直接的选择 - 实际上每个与工作表相关的应用程序都可以导入/导出格式,并且在 JS 端解析它的开销很小。

关于javascript - 对引用图像/字体/文件/等的 Web 应用程序的建议,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57558255/

相关文章:

javascript - 这在我的函数 *t 中没有定义

javascript - 如何取消绑定(bind)到元素的点击事件?

html - 编码新手,需要帮助修复 html/css 线框

css - 只有一个元素时 Flexbox 元素不会收缩

html - 在 CSS 中应用过滤器/掩码?

html - 如何纠正意外的 "table overflow"?

javascript - 如何在 spring boot 应用程序中处理长轮询,由 nginx 进行负载平衡?

javascript - 添加javascript函数影响flask应用程序

html - 如何在CSS中使用高度和宽度百分比的图像

javascript - 在 Canvas 上绘制多边形时出现间隙