Прежде чем начать установку скрипта на хостинг, немного разберемся, что такое веб-скрипт и зачем он нужен. Веб-скрипты обычно используют для расширения функционала сайта — это может быть статистика, полезные функции, движок, на котором работает сайт, и многое другое.
Опасайтесь скриптов от непроверенных разработчиков, они могут содержать вредоносный код. Поэтому, прежде чем устанавливать сторонний скрипт, лучше проверить, кто является его автором.
В панели управления хостингом ISP manager уже предусмотрены популярные скрипты или CMS. Для установки потребуется авторизоваться в панели управления хостингом, подробнее будет тут позднее.
При необходимости установки стороннего скрипта, можно прибегнуть к ручной установке. Прежде всего важно создать базу данных (если вы этого ещё не сделали). О том, как создать базу данных на хостинге, подробнее будет тут позднее. Далее вам необходимо закачать файлы скрипта на сервер. Это можно сделать через панель управления или через специальный FTP-менеджер. Рассмотрим вариант загрузки через панель хостинга:
Если у вас остались какие-либо вопросы по установке скриптов, то задайте их в техподдержку. Мы обрабатываем все заявки, постараемся отреагировать на ваш вопрос и помочь решить проблему как можно скорее.
С уважением,
Команда Former!
Написание кода для загрузки изображений на сервер с нуля кажется очень сложной задачей. Я собираюсь создать очень простую форму загрузки, чтобы продемонстрировать, как данные файла работают и могут быть переданы.
В этом руководстве мы собираемся создать форму загрузки с HTML , отправить файлы с помощью JavaScript , обработать и загрузить их с помощью PHP .
Обратите внимание, что это не означает, что это полностью функциональный, безопасный, проверенный производственный код.Он просто предназначен для простой и понятной демонстрации того, как создать вашу первую форму загрузки.
Как указано в предварительных требованиях, у вас должны быть базовые знания PHP и локальных серверных сред.
Если вы уже знаете, как использовать PHP и локальные среды, переходите к следующему разделу.
Если вы используете Mac, вы можете создать сервер с помощью одной команды.Чтобы проверить это, создайте файл с именем test.php в выбранном вами каталоге. Я собираюсь создать каталог под названием local
. Полный путь будет: Users / tania / local
.
test.php
В приложении "Терминал", которое я открою, нажав ПРОБЕЛ
+ КОМАНДА
и набрав "Терминал", перейдите в каталог, в котором вы создали файл.
Теперь вы можете перейти по адресу http: // localhost: 8888 / test.php и посмотрите результат кода.
Если вы работаете в Windows или не хотите использовать командную строку, настройте MAMP.
В корне вашего локального сервера создайте файл index.html . Мы просто создадим быстрый скелет.
Загрузить файлы
Давайте добавим веб-форму HTML в тело
.
В этой форме мы используем метод POST HTTP, который используется для отправки данных.Значение multipart / form-data
требуется для загрузки файлов в формы.
Отсюда мы создаем тип ввода файла, который принимает массив файлов ( files []
), и мы указываем , несколько
, чтобы можно было выбрать более одного файла. файлов []
могут иметь любое имя - вы можете использовать загрузок []
или изображений []
, но я назвал это файлов []
для простоты.
Наконец, у нас есть кнопка отправки. Поскольку следующим шагом будет добавление скрипта, давайте просто добавим ссылку на файл JavaScript, который мы создадим.
И это все, что нам нужно для просмотра.
index.html
Загрузить файлы
Прямо сейчас нажатие кнопки «Отправить» в форме никуда не денется. Поскольку у нас нет действия
, которое ведет к URL-адресу, форма по умолчанию просто отправит себе сообщение. Поскольку index.html - это html-файл, а не PHP-файл, обработка формы на этой странице невозможна. Вместо этого мы отправим форму в PHP через JavaScript.
Создайте файл с именем upload.js .
Сначала давайте определим две переменные - URL-адрес, по которому мы хотим отправить данные, и элемент DOM для формы.
upload.js
const url = 'process.php' const form = document.querySelector ('форма')
Мы собираемся добавить прослушиватель событий, чтобы следить за отправкой формы, но мы предотвратим запуск действия по умолчанию.
form.addEventListener ('submit', (e) => { e.preventDefault () })
Соберем файлы с .files
и начать новый интерфейс FormData ()
.
const files = document.querySelector ('[type = file]'). files; const formData = новые FormData (); });
Для каждого отправленного файла добавьте его в массив files []
.
for (let i = 0; i
Наконец, используйте встроенный Fetch API для POST данных по указанному URL.Вывести ответ в консоль (в целях тестирования).
fetch (url, { метод: 'POST', тело: formData, }). then ((response) => { console.log (ответ) })
Вот завершенный upload.js .
upload.js
const url = 'process.php' const form = document.querySelector ('форма') form.addEventListener ('submit', (e) => { e.preventDefault () const files = document.querySelector ('[type = file]'). files const formData = новые FormData () for (пусть i = 0; i { console.log (ответ) }) })
Теперь - как мы можем проверить, правильно ли проходят все эти данные? Распечатываем данные файла.
Создайте новый файл с именем process.php и распечатайте содержимое суперглобального массива $ _FILES
, который будет содержать данные для всех наших файлов.
process.php
Получив этот файл, попробуйте загрузить несколько файлов через форму. Я сделал phplogo.png и testfile1.txt для тестирования и загрузил файл.
В инструментах разработчика под консолью вы должны увидеть такой ответ:
Инструменты разработчика -> Консоль
Ответ { тип: "базовый", url: "http: // localhost: 8888 / process.php", перенаправлено: ложь, статус: 200, ок: правда,… }
Если вы видите статус : 200
, это означает, что файл попал по правильному URL-адресу, и этот URL-адрес существует.
Теперь в инструментах разработчика щелкните вкладку Network . Вы должны увидеть имя файла process.php . Щелкните файл, затем нажмите Response . Там вы должны увидеть вывод print_r ($ FILES)
. Это будет выглядеть примерно так:
Инструменты разработчика -> Сеть -> Ответ
[файлы] => Массив ( [name] => Массив ( [0] => phplogo.png [1] => testfile1.txt ) [type] => Массив ( [0] => изображение / png [1] => текст / обычный ) [tmp_name] => Массив ( [0] => / частный / var / xxx [1] => / private / var / yyy ) [error] => Массив ( [0] => 0 [1] => 0 ) [size] => Массив ( [0] => 16610 [1] => 12 ) )
Теперь мы знаем, что нужные файлы вместе со всеми связанными с ними данными прошли.Успех!
Теперь, когда мы собираем все файлы из формы и отправляем их на process.php с помощью JavaScript, мы должны переместить данные файла с помощью PHP.
Во-первых, мы хотим убедиться, что код запускается только тогда, когда запрос POST попадает в файл.
process.php
Мы также хотим убедиться, что файлы прошли.
if (isset ($ _ FILES ['files'])) { }
Создайте каталог в корне вашего проекта с именем uploads . Этот каталог должен иметь права доступа 755
для приема входящих файлов.
На этом этапе мы создадим массив ошибок, зададим путь к каталогу, куда должны идти загрузки, и установим утвержденные расширения.
$ errors = []; $ path = 'загрузки /'; $ extension = ['jpg', 'jpeg', 'png', 'gif'];
Поскольку пользователь может загружать несколько файлов, мы создадим переменную $ all_files
, получим количество загружаемых файлов и сделаем цикл для
.
$ all_files = count ($ _ FILES ['файлы'] ['tmp_name']); for ($ i = 0; $ i <$ all_files; $ i ++) { }
Теперь для каждого файла мы получим имя файла, временные данные файла, тип, размер и расширение.
$ имя_файла = $ _FILES ['файлы'] ['имя'] [$ i]; $ file_tmp = $ _FILES ['файлы'] ['tmp_name'] [$ i]; $ file_type = $ _FILES ['файлы'] ['тип'] [$ i]; $ file_size = $ _FILES ['файлы'] ['размер'] [$ i]; $ file_ext = strtolower (end (explode ('.', $ _FILES ['файлы'] ['имя'] [$ i]))); $ file = $ путь.$ file_name;
Теперь мы можем установить несколько правил для файлов. Если тип файла отсутствует в утвержденном списке расширений или файл слишком велик, мы добавим его в массив ошибок. Я установил размер файла 2 мегабайта.
if (! In_array ($ file_ext, $ extensions)) { $ errors [] = 'Расширение запрещено:'. $ имя_файла. ''. $ file_type; } if ($ file_size> 2097152) { $ errors [] = 'Размер файла превышает предел:'. $ имя_файла. ''. $ file_type; }
Если ошибок не было, мы можем переместить файл в папку uploads с помощью команды move_uploaded_file
.
if (пусто ($ errors)) { move_uploaded_file ($ file_tmp, $ file); }
Теперь мы можем закрыть цикл для
и распечатать ошибки. Это отобразится для нас на вкладке сети, которую мы использовали ранее, чтобы увидеть вывод $ _FILES
.
if ($ errors) print_r ($ errors);
Сложите все вместе, и вот process.php .
process.php
2097152) { $ errors [] = 'Размер файла превышает предел:'. $ имя_файла. ''. $ file_type; } if (пусто ($ errors)) { move_uploaded_file ($ file_tmp, $ file); } } if ($ errors) print_r ($ errors); } }
Теперь проверьте это.Если вы используете форму для загрузки файлов, вы увидите их в папке uploads . Если вы попытаетесь загрузить слишком большой файл или файл неправильного типа, вы увидите ошибки в ответе Network .
Поздравляем, вы успешно создали работающую форму загрузки. Это захватывающий небольшой процесс, если вы никогда раньше не загружали файл или не использовали суперглобальный сервер $ _FILES
.
Полный исходный код находится на GitHub.
Обратите внимание, что это не полный, безопасный производственный процесс. Вот несколько вещей, которые следует учитывать:
Спасибо за чтение. Я также могу написать о загрузке в Amazon S3 и / или DigitalOcean Spaces, если есть интерес.
.В этой статье показано, как опубликовать свой сайт в Интернете с помощью инструментов передачи файлов.
Если вы создали простую веб-страницу (см. Пример в разделе «Основы HTML»), вы, вероятно, захотите разместить ее в Интернете на веб-сервере. В этой статье мы обсудим, как это сделать, используя различные доступные параметры, такие как клиенты SFTP, RSync и GitHub.
Существует несколько клиентов SFTP.Наша демонстрация охватывает FileZilla, поскольку она бесплатна и доступна для Windows, macOS и Linux. Чтобы установить FileZilla, перейдите на страницу загрузок FileZilla, нажмите большую кнопку «Загрузить», затем выполните установку из установочного файла обычным способом.
Примечание : Конечно, есть много других вариантов. См. Дополнительные сведения в разделе «Инструменты публикации».
Откройте приложение FileZilla; вы должны увидеть что-то вроде этого:
В этом примере мы предположим, что наш хостинг-провайдер (сервис, который будет размещать наш HTTP-сервер) - это фиктивная компания «Example Hosting Provider», чьи URL-адреса выглядят следующим образом: mypersonalwebsite.examplehostingprovider.net
.
Мы только что открыли счет и получили от них следующую информацию:
Поздравляем с открытием учетной записи на Example Hosting Provider.
Ваш аккаунт:
demozilla
Ваш сайт будет виден по адресу
demozilla.examplehostingprovider.net
Для публикации в этой учетной записи подключитесь через SFTP со следующими учетными данными:
- SFTP-сервер:
sftp: // demozilla.examplehostingprovider.net
- Имя пользователя:
demozilla
- Пароль:
quickbrownfox
- Порт:
5548
- Для публикации в Интернете поместите свои файлы в каталог
Public / htdocs
.
Давайте сначала посмотрим на http://demozilla.examplehostingprovider.net/
- как видите, пока там ничего нет:
Примечание : В зависимости от вашего хостинг-провайдера большую часть времени вы увидите страницу, на которой написано что-то вроде «Этот веб-сайт размещен на [Hosting Service]».»При первом переходе на свой веб-адрес.
Чтобы подключить SFTP-клиент к удаленному серверу, выполните следующие действия:
Ваше окно должно выглядеть примерно так:
Теперь нажмите Connect , чтобы подключиться к серверу SFTP.
Примечание. Убедитесь, что ваш хостинг-провайдер предлагает SFTP (безопасный FTP) подключение к вашему хостинговому пространству. FTP по своей сути небезопасен, и вам не следует его использовать.
После подключения ваш экран должен выглядеть примерно так (мы подключились к нашему собственному примеру, чтобы дать вам представление):
Давайте посмотрим, что вы видите:
mdn
). пользователя / demozilla
) В наших примерах инструкций хоста говорилось: «Чтобы опубликовать в Интернете, поместите свои файлы в каталог Public / htdocs
."Вам нужно перейти в указанный каталог на правой панели. Этот каталог фактически является корнем вашего веб-сайта, где будет находиться ваш файл index.html
и другие ресурсы.
После того, как вы нашли правильный удаленный каталог для размещения файлов, чтобы загрузить файлы на сервер, вам нужно перетащить их с левой панели на правую.
Пока все хорошо, но действительно ли файлы в сети? Вы можете перепроверить, вернувшись на свой сайт (например,грамм. http://demozilla.examplehostingprovider.net/
) в вашем браузере:
И - вуаля ! Наш сайт работает!
Rsync - это инструмент для синхронизации файлов между локальными и удаленными файлами, который обычно доступен в большинстве систем на базе Unix (таких как macOS и Linux), но существуют и версии для Windows.
Он считается более продвинутым инструментом, чем SFTP, потому что по умолчанию он используется в командной строке. Базовая команда выглядит так:
rsync [-options] SOURCE user @ x.x.x.x: DESTINATION
-options
- это дефис, за которым следует одна или несколько букв, например -v
для подробных сообщений об ошибках и -b
для создания резервных копий. Вы можете увидеть полный список на странице руководства rsync (ищите «Сводка параметров»). ИСТОЧНИК
- это путь к локальному файлу или каталогу, из которого вы хотите скопировать файлы. user @
- это учетные данные пользователя на удаленном сервере, на который вы хотите скопировать файлы. x.x.x.x
- IP-адрес удаленного сервера. НАЗНАЧЕНИЕ
- это путь к месту, куда вы хотите скопировать свой каталог или файлы на удаленном сервере. Вам необходимо получить такие данные у вашего хостинг-провайдера.
Для получения дополнительной информации и дополнительных примеров см. Как использовать Rsync для копирования / синхронизации файлов между серверами.
Конечно, рекомендуется использовать безопасное соединение, например FTP. В случае Rsync вы указываете детали SSH, чтобы установить соединение через SSH, используя опцию -e
.Например:
rsync [-options] -e "ssh [ПОДРОБНОСТИ SSH ЗДЕСЬ]" ИСТОЧНИК [email protected]: DESTINATION
Вы можете найти более подробную информацию о том, что необходимо, в Как копировать файлы с помощью Rsync через SSH.
Как и другие инструменты командной строки, инструменты с графическим интерфейсом также существуют для Rsync, для тех, кому не очень удобно пользоваться командной строкой. Acrosync - один из таких инструментов, доступный для Windows и macOS.
Опять же, вам нужно будет получить учетные данные для подключения от вашего хостинг-провайдера, но таким образом у вас будет графический интерфейс для их ввода.
GitHub позволяет публиковать веб-сайты через страницы GitHub (gh-страницы).
Мы рассмотрели основы использования этого в статье «Публикация вашего веб-сайта» из нашего руководства «Начало работы с Интернетом», поэтому мы не собираемся повторять все это здесь.
Однако стоит знать, что вы также можете разместить веб-сайт на GitHub, но использовать с ним собственный домен. См. Подробное руководство в разделе Использование личного домена со страницами GitHub Pages.
Протокол FTP - один из хорошо известных методов публикации веб-сайтов, но не единственный.Вот еще несколько возможностей:
Есть важное различие относительно хостинга. Есть два типа «WordPress». Эти форумы предназначены для типа .org . Есть еще .com вида. Тип WP .com предоставляет хостинг для подписчиков. Их сайты основаны на том же базовом программном обеспечении WordPress, но их версия в некоторых фундаментальных отношениях отличается от типа .org.
Версия WP .org предназначена для «самостоятельных» веб-сайтов. Не обязательно размещаться на вашем собственном компьютере.Большинство пользователей WP .org используют какой-либо коммерческий хостинг. Выбор хоста зависит от вас. Большинство коммерческих хостов предлагают пакеты для конкретных учетных записей WP для тех, кто менее технически подкован, хотя установка на неспецифическую учетную запись требует очень мало технических навыков.
Пользователи WP .com имеют ограниченные возможности в отношении того, что они могут делать со своим сайтом в плане настройки его внешнего вида и функциональности. Пользователи WP .org могут делать со своим сайтом все, что им нравится. Возможности огромны для тех, у кого есть адекватные навыки программирования.
Если вы хотите, чтобы вас размещали на wordpress.com, это отличный вариант для многих, но тогда вы оказались не в том месте. Идите туда, чтобы начать.
Если вам нужен полный контроль над своим сайтом, вы находитесь в нужном месте. Вам понадобится какой-нибудь веб-сервер. Это можно сделать и на вашем собственном компьютере, но администрирование общедоступного сайта на сервере не рекомендуется для неопытных. Подойдет любой коммерческий хостинг, если вы не пользуетесь услугами бесплатного хостинга.Здесь можно найти небольшую выборку возможных хостов.
Вам также понадобится доменное имя, которое обычно не является частью пакета хостинга, хотя большинство основных хостов также могут выступать в качестве регистратора вашего домена. Это избавит вас от некоторых проблем с привязкой домена к хосту. Сделать это, когда у вас другой регистратор, - довольно простая задача.
У вас может быть выбор между хостингом Windows или Linux. Любой из них будет работать, но пользовательская база Linux намного шире, поэтому лучше поддерживается сообществом.. Распакуйте его на свой локальный компьютер, а затем загрузите извлеченные файлы через FTP на сервер вашего хоста. Более подробно на
Как установить WordPress
«Тема» WP определяет внешний вид вашего сайта. Есть тысячи на выбор. Новый сайт WP не имеет содержимого, кроме исходного сообщения Hello World, образца страницы и страницы конфиденциальности схемы. Создавать контент зависит только от вас. Когда вы создаете контент, тема определяет, как он будет отображаться на вашем сайте.
Хотя у меня много терпения, чтобы помогать людям, у меня мало возможностей для просмотра видео.Я не могу поручиться за актуальность видео, которое вы разместили. У вас есть два варианта: оставить .html как есть или скопировать основное содержание каждой страницы в WP. Если оставить все как есть, вам, вероятно, придется немного настроить, чтобы содержимое .html и WP отображалось как единый сайт. Если вы копируете только контент, тема будет контролировать его внешний вид.
.