> ## Documentation Index
> Fetch the complete documentation index at: https://docs.elata.bio/llms.txt
> Use this file to discover all available pages before exploring further.

# 上传与托管

> 上传限制、自托管地址、应用运行的沙箱，以及添加到主屏幕。

## 两种托管方式

| 方式 | 运作方式 | 适用场景 |
| - | - | - |
| **Elata 托管**（默认） | 上传 `.zip` 或单个 `.html` 文件，由 Elata 提供服务。 | 绝大多数情况 |
| **自托管** | 向 Elata 提供一个公开的 `https://` 地址，由 Elata 嵌入。 | 需要自有服务器的应用。需经 Elata 批准。 |

上传的代码被视为静态 Web 内容（HTML、CSS、JS 和资源）。它在用户的浏览器中运行，绝不会在 Elata 的服务器上执行。

***

## 限制

| 限制项 | 数值 |
| - | - |
| 上传大小 | 200 MB |
| 解压后大小 | 500 MB |
| zip 中的文件数 | 2,000 |
| 单个文件大小 | 100 MB |

zip 中必须包含 `index.html`。文件路径必须是普通的相对路径：不能是绝对路径，不能包含 `..` 段，也不能包含控制字符。

***

## 为 Elata 构建

* **使用相对 URL。** 应用在子路径而不是域名根路径下提供服务。请使用相对路径加载资源和数据（`./data.json`，而不是 `/data.json`）。
* **包含 WASM 文件。** 在构建输出中保留 SDK 打包的 `.wasm` 文件。
* **重要数据使用 Elata 桥接，而不是浏览器存储。** 每个应用运行在自己的源上，`localStorage` 可以用，但只保存在一台设备上。需要跟随用户的数据请使用 [`app-state`](/cn/apps/platform/app-state)。
* **只在需要时请求摄像头权限。** rPPG 应用运行在 Elata 框架内，浏览器会弹出摄像头权限请求。

***

## 沙箱

当有人使用你的应用时，Elata 会在一个沙箱 iframe 中加载它，并为你的应用分配独立的源。在该沙箱中，你的应用：

* **可以**运行脚本、使用摄像头（需授权）、在受支持的浏览器中使用 Web Bluetooth、使用指针锁定，以及使用自己的存储
* **不能**读取 Elata 的 Cookie 或存储、看到用户的钱包或会话，或导航应用页面

要与 Elata 通信，请使用[宿主桥接](/cn/apps/platform/host-bridge)。

***

## 自托管应用

要使用你自己的地址，请在应用的**编辑**页面申请外部托管。Elata 批准后，你就可以发布指向 `https://` 地址的版本。

自托管地址必须：

* 使用 `https://` 并可公开访问
* 允许被嵌入框架（不要发送 `X-Frame-Options: DENY`，或排除 `app.elata.bio` 的 CSP `frame-ancestors`）

自托管地址还会经过 URL 信誉服务检查。

***

## 添加到主屏幕（PWA）

当有人从应用的试玩页面安装你的应用（**添加到主屏幕**）时，如果你的包中带有 Web 清单，Elata 会让安装使用**你的**应用名称和图标：

1. 在 `index.html` 旁边添加 `manifest.webmanifest`（或 `manifest.json`）。
2. 在 HTML 中引用它：`<link rel="manifest" href="manifest.webmanifest">`。请使用相对路径。
3. 至少包含一个图标。512×512 的 maskable PNG 效果最佳。
4. 设置 `name`、`short_name`、`theme_color` 和 `background_color`。

Elata 会管理 `start_url`、`scope` 和 `display`，以确保安装后的应用能正确重新打开。如果没有清单，安装将使用你应用页面的名称和图片。

***

## 下一步

<CardGroup cols={2}>
  <Card title="宿主桥接" icon="plug" href="/cn/apps/platform/host-bridge">
    应用如何与 Elata 通信
  </Card>

  <Card title="应用页面" icon="image" href="/cn/apps/build/app-metadata">
    图标、头图、截图
  </Card>
</CardGroup>


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.