React Native无后端场景下如何拉取远程静态JSON与图片资源

你需要的「无需搭建后端、仅通过简单网络请求即可公网拉取静态资源、支持存JSON和图片、可在线编辑文件更新内容」的服务完全存在，完全不需要学习复杂的数据库方案、不需要写服务端代码，改动成本极低，和你现有本地读JSON渲染的逻辑几乎可以无缝衔接。

两类服务完全匹配你的需求，都不需要写后端代码：

• 对象存储服务
  这是最适配你场景的选项，原生支持任意类型静态文件的公网HTTP/HTTPS访问，自带CDN加速，移动端拉取速度稳定，大部分服务商的免费额度足够支撑个人小型新闻类应用的流量。你只需要创建存储实例后开启公网只读权限（一定要关闭公网写入权限，避免内容被篡改），上传JSON、图片后每个文件都会生成固定的公网访问地址，直接用fetch请求就能拿到内容。你后续要更新新闻，只需要在服务控制台编辑替换JSON文件、增删配图即可，不需要发布新版本App。
• 静态站点托管服务
  如果你觉得对象存储的权限配置麻烦，可以选这类服务，本身是用来托管静态网页的，天生支持静态文件公网访问，操作更简单，上传文件后就能拿到固定访问地址，同样支持在线替换文件更新内容，完全满足你的使用需求。

你不需要改动现有新闻渲染的核心逻辑，只需要替换数据读取部分的代码即可：

1. 先整理好本地的news.json结构，保持和你当前App解析的字段完全一致，把JSON里的本地图片路径替换成后续上传后生成的公网图片地址。
2. 选择上述任意一类服务，创建存储实例，配置公网只读权限，关闭所有公网写入、修改权限。
3. 上传整理好的news.json和所有新闻配图到存储位置，复制JSON文件的公网访问地址。
4. 把App里原来读取本地JSON的逻辑替换为网络请求逻辑，参考代码如下：

const loadNewsList = async () => {
  try {
    // 替换为你的JSON文件公网地址
    const response = await fetch('https://your-storage-domain/news.json');
    const data = await response.json();
    // 下方渲染逻辑和你之前读取本地JSON的代码完全一致
    return data.news;
  } catch (error) {
    // 可搭配本地缓存逻辑，请求失败时展示上次成功拉取的内容，提升体验
    console.error('新闻数据拉取失败', error);
  }
}

你之前尝试的几类方案之所以觉得逻辑复杂，是因为它们本身就不适配你的纯静态读场景：

• SQLite、Realm属于移动端本地数据库，仅用来存储App本地的私有数据，不支持公网跨端共享数据，完全不符合你线上更新内容的需求。
• MongoDB、Firebase属于带动态读写能力的后端服务，包含账号体系、数据写入、权限校验等大量你用不到的重功能，学习成本高，对于你这种纯静态内容拉取的场景属于过度选型。

小优化建议：可以给App加一层简单的本地缓存，首次成功拉取新闻数据后存在本地，用户打开App时先展示缓存内容，再在后台静默拉取最新的JSON数据做更新，既可以提升App打开速度，也能避免弱网环境下内容加载失败的问题。

内容的提问来源于stack exchange，提问作者reidemption