Как загрузить файлы на веб-сервер
Данная статья покажет, как можно опубликовать сайт в Интернет с помощью инструментов передачи файлов(file transfer tools).
| Необходимые знания: | Вы должны знать что такое веб-сервер и как работают доменные имена. Также вы должны знать, как установить базовую среду и как написать простую веб-страницу. |
|---|---|
| Цель: | Научиться передавать файлы на сервер используя различные доступные инструменты передачи файлов(file transfer tools). |
Сводка
Если вы создали простую веб-страницу (для примера смотрите Основы HTML), вы, вероятно, захотите отобразить её онлайн, на веб-сервере. В данной статье мы обсудим как сделать это, используя различные доступные настройки, такие как SFTP клиенты, RSync и GitHub.
SFTP (Безопасный Протокол Передачи Файлов)
Существуют различные варианты SFTP клиентов. В нашем примере мы будем использовать FileZilla, тк он бесплатен и подходит для Windows, macOS и Linux. Чтобы установить менеджер перейдите на страницу загрузки FileZilla downloads page, нажмите на кнопку загрузки, затем установите пакет из установочного файла обычным способом.
Примечание: Конечно, есть много других вариантов. Смотрите Publishing tools для других способов.
Откройте приложение FileZilla; вы должны увидеть что-то вроде этого:

Вход в систему
В этом примере мы предположим, что наш хостинг-провайдер (сервис, на котором находится наш HTTP веб сервер) является фиктивной компанией «Example Hosting Provider», чьи URL адреса выглядят следующим образом: mypersonalwebsite.examplehostingprovider.net .
Сейчас мы создали аккаунт и получили от хостинг-провайдера следующую информацию:
- SFTP сервер: sftp://demozilla.examplehostingprovider.net
- Имя пользователя: demozilla
- Пароль: quickbrownfox
- Порт: 5548
- Для публикации в интернет, поместите ваши файлы в папку Public/htdocs .
Давайте сначала посмотрим на http://demozilla.examplehostingprovider.net/ — как вы можете видеть, то здесь пока ничего нет:

Примечание: В зависимости от вашего хостинг-провайдера, когда вы впервые заходите на свой веб-адрес, большую часть времени вы будете видеть страницу, на которой написано что-то вроде этого: «This website is hosted by [Hosting Service].»
Чтобы подключить SFTP клиент к удалённому серверу, выполните следующие действия:
- Выберите File > Site Manager. в главном меню.
- В окне Site Manager, нажмите кнопку New Site, затем введите название сайта как demozilla в предоставленном месте.
- Укажите SFTP-сервер вашего хоста в предоставленном поле: Host.
- В раскрывающемся списке Logon Type: выберите Normal, затем введите предоставленные имя пользователя и пароль в соответствующие поля.
- Введите правильный порт и другую информацию.
Ваше окно должно выглядеть как показано ниже:

Теперь нажмите Connect для подключения к SFTP-серверу.
Примечание: Убедитесь, что ваш хостинг-провайдер предлагает SFTP (безопасный FTP) подключение к вашему хостинговому пространству. FTP по своей сути небезопасен, и вам не следует его использовать.
Здесь и там: локальный и удалённый просмотр

После подключения ваш экран должен выглядеть примерно так (мы подключились к нашему собственному примеру, чтобы дать вам представление):
Давайте посмотрим, что вы видите:
- По центру левой панели вы можете видеть локальные файлы. Перейдите в каталог, в котором вы храните свой веб-сайт (например, mdn ).
- По центру правой панели вы увидеть удалённые файлы. Мы вошли в наш удалённый корень FTP (в данном случае: users/demozilla )
- Вы можете пока игнорировать нижнюю и верхнюю панели. Соответственно, это журнал сообщений, показывающий состояние соединения между вашим компьютером и SFTP-сервером, и журнал в реальном времени каждого взаимодействия между вашим SFTP-клиентом и сервером.
Загрузка на сервер
Наш пример инструкций для хостинга указывает нам следующее: «Чтобы опубликовать в Интернете, поместите свои файлы в каталог: Public/htdocs .» Вам нужно перейти в указанный каталог на правой панели. Этот каталог фактически является корнем вашего веб-сайта, где находятся ваши index.html , откуда ваши файл и другие активы будут отправлены.
После того, как вы нашли правильный удалённый каталог для размещения файлов, чтобы загрузить файлы на сервер, вам необходимо переместить их с левой панели на правую.
Как узнать, что они online?
Пока все хорошо, но действительно ли файлы в сети? Вы можете перепроверить, перейдя на ваш сайт (например, http://demozilla.examplehostingprovider.net/ ) в вашем браузере:

И вуаля! Наш сайт работает!
Rsync
Rsync (en-US) is a local-to-remote file synchronizing tool, which is generally available on most Unix-based systems (like macOS and Linux), but Windows versions exist too.
It is seen as a more advanced tool than SFTP, beause by default it is used on the command line. A basic command looks like so:
rsync [-options] SOURCE user@x.x.x.x:DESTINATION
- -options is a dash followed by a one or more letters, for example -v for verbose error messages, and -b to make backups. You can see the full list at the rsync man page (search for «Options summary»).
- SOURCE is the path to the local file or directory that you want to copy files over from.
- user@ is the credentials of the user on the remote server you want to copy files over to.
- x.x.x.x is the IP address of the remote server.
- DESTINATION is the path to the location you want to copy your directory or files to on the remote server.
You’d need to get such details from your hosting provider.
Of course, it is a good idea to use a secure connection, like with FTP. In the case of Rsync, you specify SSH details to make the connection over SSH, using the -e option. For example:
rsync [-options] -e "ssh [SSH DETAILS GO HERE]" SOURCE user@x.x.x.x:DESTINATION
You can find more details of what is needed at How To Copy Files With Rsync Over SSH.
Rsync GUI tools
As with other command line tools, GUI tools also exist for Rsync, for those who are not as comfortable with using the command line. Acrosync is one such tool, and it is available for Windows and macOS.
Again, you would have to get the connection credentials from your hosting provider, but this way you’d have a GUI to enter them in.
GitHub
GitHub allows you to publish websites via GitHub pages (gh-pages).
We’ve covered the basics of using this in the Publishing your website article from our Getting started with the Web guide, so we aren’t going to repeat it all here.
However, it is worth knowing that you can also host a website on GitHub, but use a custom domain with it. See Using a custom domain with GitHub Pages for a detailed guide.
Other methods to upload files
The FTP protocol is one well-known method for publishing a website, but not the only one. Here are a few other possibilities:
- Web interfaces. An HTML interface acting as front-end for a remote file upload service. Provided by your hosting service.
- WebDAV (en-US). An extension of the HTTP protocol to allow more advanced file management.
Found a content problem with this page?
- Edit the page on GitHub.
- Report the content issue.
- View the source on GitHub.
This page was last modified on 3 авг. 2023 г. by MDN contributors.
Your blueprint for a better internet.
Как загрузить файл на сервер
Чтобы загрузить файл на сервер, нам надо использовать форму с параметром enctype=»multipart/form-data» и массив $_FILES . Итак, создадим файл upload.php со следующим содержимым:
METANIT.COM ?>Загрузка файла
Здесь определена форм с атрибутом enctype=»multipart/form-data» . Форма содержит специальное поле для выбора файла.
Все загружаемые файлы попадают в ассоциативный массив $_FILES . Чтобы определить, а есть ли вообще загруженные файлы, можно использовать конструкцию if: if ($_FILES)
Массив $_FILES является двухмерным. Мы можем загрузить набор файлов, и каждый загруженный файл можно получить по ключу, который совпадает со значением атрибута name .
Так как элемент для загрузки файла на форме имеет name=»filename» , то данный файл мы можем получить с помощью выражения $_FILES[«filename»] .
У каждого объекта файла есть свои параметры, которые мы можем получить:
- $_FILES[«file»][«name»] : имя файла
- $_FILES[«file»][«type»] : тип содержимого файла, например, image/jpeg
- $_FILES[«file»][«size»] : размер файла в байтах
- $_FILES[«file»][«tmp_name»] : имя временного файла, сохраненного на сервере
- $_FILES[«file»][«error»] : код ошибки при загрузке
Также мы можем проверить наличие ошибок при загрузке. Если у нас нет ошибки, то поле $_FILES[«filename»][«error»] содержит значение UPLOAD_ERR_OK .
При отправке файла на сервер он сначала загружается во временное место, из которого затем с помощью функции move_uploaded_file() он перемещается в каталог сервера, где расположен скрипт «upload.php».

Также мы можем указать другой путь, например, допустим, на сервере есть папка «upload», тогда, чтобы загружать в нее файлы, необходимо указать соответствующий путь:
if ($_FILES && $_FILES["filename"]["error"]== UPLOAD_ERR_OK) < $name = "upload/" . $_FILES["filename"]["name"]; move_uploaded_file($_FILES["filename"]["tmp_name"], $name); echo "Файл загружен"; >
Функция move_uploaded_file() принимает два параметра путь к загруженному временному файлу и путь, куда надо поместить загруженный файл.
Ограничения и настройка загрузки
По умолчанию размер загружаемых файлов ограничен 2 мб. Однако можно настроить данный показатель в файле конфигурации. Изменим этот показатель, например, до 10 мб. Для этого найдем в файле php.ini следующую строку:
upload_max_filesize = 2M
upload_max_filesize = 10M
Также мы можем настроить папку для временных загружаемых файлов. Для этого в файле php.ini найдем следующую строку:
;upload_tmp_dir =
upload_tmp_dir = "C:/php/upload"
Также в каталоге php нам надо создать папку upload .
Мультизагрузка
Изменим скрипт upload.php так, чтобы он поддерживал множественную загрузку:
METANIT.COM $error) < if ($error == UPLOAD_ERR_OK) < $tmp_name = $_FILES["uploads"]["tmp_name"][$key]; $name = $_FILES["uploads"]["name"][$key]; move_uploaded_file($tmp_name, "$name"); >> echo "Файлы загружены"; > ?>Загрузка файла
Каждое поле выбора файла имеет атрибут name=»uploads[]» , поэтому сервер будет рассматривать набор отправленных файлов как единый массив.
Затем используя цикл foreach , проходим по все файлам и сохраняем их в каталог веб-сайта.
Как загрузить файлы на сервер
Добрый день, друзья! Сегодня разговор пойдет о том, как загрузить файлы на выделенный сервер, хостинг или vps самым простым методом.
Использовать будем специальный софт. FileZilla самая известная , удобная и бесплатная программа из FTP клиентов. Закачивание файлов и папок происходит быстро и удобно. Первым делом нужно найти и скачать ее. Сделать это легко через поисковую систему Google или Yandex.
Закачка файлов на сервер — пошагово
После установки FileZilla, мы запускаем её .
Открываем «Менеджер Сайтов» (на рисунке ниже показано).
Открывается менеджер web-сайтов. Далее следует нажать кнопку «Новый сайт» и затем даете название, например letter. В строке «Хост» пишем IP-адрес вашего сервера для вашего FTP-соединения.
Узнать этот IP можно в email письме, его высылает вам хостер, после того как вы заказали и оплатили сервер. Также можно зайти в личный кабинет сайта, где арендуете сервер. Там также будет ваш IP. Копируете и вставляете его в поле «Хост».
В строках «Protocol», «Encryption» и «Тип входа», должно быть написано, как на следующем рисунке.

Теперь введите имя пользователя и пароль, которыми вы используетесь, они также были отправлены Вам на почту. В конце жмете по кнопке «Соединиться». Вам предоставится ftp доступ.
Первым делом , в поле справа нужно найти папку, куда вы хотите загрузить файлы. Если нужно, то правой кнопкой мыши выбирайте «создать каталог» и даете ему название.
В полях слева выбираете файлы который нужно перетащить в поле справа или просто нажать по кнопке «Закачать на сервер». Также можно выкачать файлы обратно — с сервера к себе на домашний компьютер.
В поле в самом низу будут находиться имена файлов, с которыми вы работали последними. Используя кнопки, расположенные ниже данного поля, вы сможете узнать:
- какие файлы в задании — файлы, которые ждут закачки;
- передачи, которые не удались — те файлы, которые по каким то причинам закачать не удалось;
- успешные передачи — файлы, которые успешно закачались на ваш сервер.
Вот и все, что нужно знать мы разобрали. C помощью этой программы закачка происходит быстро и удобно.
Решения по аренде выделенных серверов
На нашем сайте можно приобрести современные серверы в Нидерландах, Германии, Великобритании, Франции, Канаде и США.
Загрузка файлов
Для загрузки на сервер одного или нескольких файлов вроде фотографий, документов и видео применяется специальное поле формы. В браузере IE такой элемент отображается как текстовое поле, рядом с которым располагается кнопка с надписью «Обзор. » (рис. 1). В Safari, Opera и Chrome доступна только кнопка «Выбрать файлы» (рис. 2), в Firefox это только кнопка «Обзор» (рис. 3).
![]()
Рис. 1. Вид поля для загрузки файла в IE
![]()
Рис. 2. Загрузка файлов в Opera и Chrome

Рис. 3. Загрузка файлов в Firefox
При нажатии на кнопку открывается окно для выбора файла, где можно указать, какой файл пользователь желает использовать.
Синтаксис поля для отправки файла следующий.
Атрибуты перечислены в табл. 1.
| Атрибут | Описание |
|---|---|
| name | Имя поля; используется для его идентификации обработчиком формы. |
| disabled | Блокирует поле для отправки файлов. |
| form | Идентификатор формы для связывания поля с элементом . |
| type | Для загрузки файлов значение должно быть file . |
| accept | Устанавливает фильтр на типы файлов, которые вы можете открыть через поле загрузки файлов. |
| autofocus | Поле получает фокус после загрузки документа. |
| required | Указывает, что поле является обязательным для заполнения. |
| multiple | Позволяет выбирать и загружать сразу несколько файлов. |
Для отправки файлов в форме необходимо сделать следующее:
- задать метод отправки данных POST ( method=»post» );
- установить у атрибута enctype значение multipart/form-data .
Кроме того, данное поле нельзя вставлять внутрь ссылки и кнопки.
Форма для загрузки файла продемонстрирована в примере 1.
Пример 1. Создание поля для отправки файла
Атрибут multiple важен, он позволяет не ограничиваться одним файлом для выбора, а указать сразу несколько файлов для одновременной загрузки (пример 2). Выбор нескольких файлов происходит с помощью мыши или клавиатуры через клавиши Ctrl и Shift .
Пример 2. Загрузка нескольких файлов
Если атрибут accept не указывать, тогда добавляются и загружаются файлы любого типа. Наличие accept позволяет ограничить выбор файла, что особенно важно, когда требуется загрузить только изображение или видео. В качестве значения выступает MIME-тип, несколько значений разделяются между собой запятой. Также можно использовать следующие ключевые слова:
- audio/* — выбор музыкальных файлов любого типа;
- image/* — графические файлы;
- video/* — видеофайлы.
В табл. 2 показаны некоторые допустимые значения атрибута accept .
| Значение | Описание |
|---|---|
| image/jpeg | Только файлы в формате JPEG. |
| image/jpeg,image/png | Только файлы в формате JPEG и PNG. |
| image/* | Любые графические файлы. |
| image/*,video/* | Любые графические и видеофайлы. |
Использование дополнительных атрибутов показано в примере 3.
Пример 3. Загрузка фотографий