如何将文件上传到 Web 服务器？

总结

如果您已经构建了一个简单的网页（请参阅 HTML 基础 示例），您可能希望将其发布到 Web 服务器上。在本文中，我们将讨论如何使用 SFTP 客户端、Rsync 和 GitHub 等各种可用选项来实现这一点。

SFTP

市面上有许多 SFTP 客户端。我们的演示将介绍 FileZilla，因为它免费且适用于 Windows、macOS 和 Linux。要安装 FileZilla，请访问 FileZilla 下载页面，点击大的“下载”按钮，然后按照通常的方式从安装程序文件中进行安装。

注意： 当然还有很多其他选项。有关更多信息，请参阅 发布工具。

打开 FileZilla 应用程序；您应该会看到类似以下内容

登录

在此示例中，我们假设我们的托管提供商（托管我们的 HTTP Web 服务器的服务）是一家虚构的公司“Example Hosting Provider”，其 URL 如下所示：mypersonalwebsite.examplehostingprovider.net。

我们刚刚开通了一个账户，并收到了他们提供的以下信息

恭喜您在 Example Hosting Provider 开通了账户。

您的账户是：demozilla

您的网站将在 demozilla.examplehostingprovider.net 上可见

要发布到此账户，请使用以下凭据通过 SFTP 连接

SFTP 服务器：sftp://demozilla.examplehostingprovider.net

用户名：demozilla

密码：quickbrownfox

端口：5548

要发布到 Web，请将您的文件放入 Public/htdocs 目录。

让我们先看看 http://demozilla.examplehostingprovider.net/ — 如您所见，目前这里什么都没有

注意： 根据您的托管提供商，大多数情况下，当您首次访问您的网址时，会看到一条消息，例如“此网站由 [托管服务] 托管”。

要将您的 SFTP 客户端连接到远程服务器，请按照以下步骤操作

在主菜单中选择“文件”>“站点管理器…” (File > Site Manager…)。

在“站点管理器”窗口中，按“新建站点” (New Site) 按钮，然后在提供的空间中将站点名称填写为demozilla。

在“主机:” (Host:) 字段中填写您的主机提供的 SFTP 服务器。

在“登录类型:” (Logon Type:) 下拉列表中，选择“正常” (Normal)，然后填写您提供的用户名和密码。

填写正确的端口和其他信息。

您的窗口应该看起来像这样

现在按“连接” (Connect) 按钮连接到 SFTP 服务器。

注意：确保您的托管提供商为您的托管空间提供了 SFTP（安全 FTP）连接。FTP 本质上是不安全的，您不应该使用它。

本地和远程视图

连接后，您的屏幕应该看起来像这样（我们连接到我们自己的示例来给您一个概念）

让我们看一下您看到的内容

在左侧中间窗格中，您可以看到您的本地文件。导航到存储网站的目录（例如，mdn）。

在右侧中间窗格中，您可以看到远程文件。我们登录到我们的远程 FTP 根目录（在本例中是 users/demozilla）。

您可以暂时忽略底部和顶部的窗格。它们分别是显示您的计算机与 SFTP 服务器之间连接状态的消息日志，以及 SFTP 客户端与服务器之间每次交互的实时日志。

上传到服务器

我们的示例主机说明告诉我们“要发布到 Web，请将您的文件放入 Public/htdocs 目录。”您需要导航到右侧窗格中指定的目录。该目录实际上是您网站的根目录 — 您的 index.html 文件和其他资源将放置在此处。

找到要放置文件的正确远程目录后，要将文件上传到服务器，您需要将它们从左侧窗格拖放到右侧窗格。

它们真的在线了吗？

到目前为止一切顺利，但文件真的在线了吗？您可以通过在浏览器中返回您的网站（例如，http://demozilla.examplehostingprovider.net/）来双重检查。

我们的网站上线了！

Rsync

Rsync 是一个本地到远程的文件同步工具，通常在大多数类 Unix 系统（如 macOS 和 Linux）上可用，但也存在 Windows 版本。

它被认为是一个比 SFTP 更高级的工具，因为它默认在命令行中使用。基本命令如下所示

bashrsync [-options] SOURCE user@x.x.x.x:DESTINATION

-options 是一个连字符后跟一个或多个字母，例如 -v 表示详细的错误消息，-b 表示创建备份。您可以在 rsync 手册页 中查看完整列表（搜索“Options summary”）。

SOURCE 是您要从中复制文件的本地文件或目录的路径。

user@ 是您要在其中复制文件的远程服务器上用户的凭据。

x.x.x.x 是远程服务器的 IP 地址。

DESTINATION 是您要在远程服务器上复制目录或文件的位置的路径。

您需要从您的托管提供商那里获取这些详细信息。

有关更多信息和进一步的示例，请参阅 如何使用 Rsync 在服务器之间复制/同步文件。

当然，使用安全连接是一个好主意，就像 FTP 一样。对于 Rsync，您需要指定 SSH 详细信息，以便通过 SSH 进行连接，使用 -e 选项。例如

bashrsync [-options] -e "ssh [SSH DETAILS GO HERE]" SOURCE user@x.x.x.x:DESTINATION

有关所需内容的更多详细信息，请参阅 如何通过 SSH 使用 Rsync 复制文件。

Rsync GUI 工具

Rsync 提供了 GUI 工具（对于那些不熟悉命令行操作的人）。Acrosync 就是其中一个工具，它适用于 Windows 和 macOS。

同样，您需要从托管提供商那里获取连接凭据，但这样您就可以有一个 GUI 来输入它们。

GitHub

GitHub 允许您通过 GitHub pages（gh-pages）发布网站。

我们已经在我们 Web 入门 指南的 发布您的网站 文章中介绍了使用此方法的基础知识，因此我们不再在此重复。

但是，值得了解的是，您也可以在 GitHub 上托管网站，并为其使用自定义域名。有关详细指南，请参阅 使用自定义域名与 GitHub Pages。

其他上传文件的方法

FTP 协议是发布网站的一个众所周知的常用方法，但不是唯一的方法。以下是一些其他可能性

Web 界面。一个 HTML 界面，作为远程文件上传服务的*.前端。由您的托管服务提供。

WebDAV。HTTP 协议的扩展，用于允许更高级的文件管理。

帮助改进 MDN

此页面对您有帮助吗？

是

否

了解如何贡献 此页面最后修改于 2025 年 4 月 29 日，由 MDN 贡献者。

在 GitHub 上查看此页面 • 报告此内容的潜在问题