Что такое web клиент

Веб-клиент

Веб-клиент — это одно из клиентских приложений системы «1С:Предприятие 8». В отличие от «привычных» клиентских приложений (толстого клиента и тонкого клиента), его не нужно предварительно устанавливать на компьютер пользователя. У веб-клиента нет исполняемого файла. Веб-клиента вы не найдете ни в меню, ни среди исполняемых файлов. Потому он и веб-клиент, что ему для начала работы не нужно иметь никаких файлов на компьютере пользователя.

Веб-клиент, в отличие от толстого и тонкого клиентов, исполняется не в среде операционной системы компьютера, а в среде интернет-браузера (Windows Internet Explorer, Mozilla Firefox, Google Chrome или Safari). Поэтому любому пользователю достаточно всего лишь запустить свой браузер, ввести адрес веб-сервера, на котором опубликована информационная база, — и веб-клиент сам «приедет» к нему на компьютер и начнет исполняться.

Веб-клиент использует технологии DHTML и HTTPRequest. При работе веб-клиента клиентские модули, разработанные в конфигурации, компилируются автоматически из встроенного языка «1С:Предприятия 8» и непосредственно исполняются на стороне веб-клиента.

Таким образом, независимо от клиентского приложения (толстый, тонкий, веб-клиент), вся разработка прикладного решения ведется полностью в конфигураторе 1С:Предприятия, серверный и клиентский код пишется на встроенном языке «1С:Предприятия 8».

Работа в интернет-браузере без установки системы на компьютер пользователя

Для работы в режиме веб-клиента требуется веб-сервер, настроенный на работу с «1С:Предприятием 8». Браузер клиента взаимодействует с веб-сервером по протоколу HTTP или HTTPS. Веб-сервер, в свою очередь, взаимодействует с «1С:Предприятием 8» в файловом или клиент-серверном варианте работы.

В качестве веб-сервера используется Apache или IIS.

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

Progressive Web Apps

В веб-клиенте реализована поддержка технологии PWA (Progressive Web Apps). Эта технология поддерживается браузерами (как настольными, так и мобильными). Она позволяет создавать веб-приложения, которые выглядят как нативные приложения и работают почти так же быстро, как нативные приложения.

В веб-клиенте есть команда, которая устанавливает его как отдельное PWA-приложение. В результате на рабочем столе появляется иконка для запуска приложения. Веб-клиент, запущенный из этой иконки, будет похож на нативное приложение — в нем не будет адресной строки браузера, кнопок Домой, Вперед, Назад и др.

Во встроенном языке реализована объектная модель, которая позволяет устанавливать PWA-приложения и обрабатывать события начала и окончания установки.

Аутентификация OpenID Connect

В веб-клиенте реализована поддержка провайдеров OpenID Connect. Для аутентификации в «1С:Предприятии 8», дополнительно к имеющимся способам, пользователи могут использовать свои учётные данные на других сайтах, поддерживающих OpenID Connect аутентификацию.

Веб-клиент на мобильных устройствах

Реализована ограниченная поддержка работы веб-клиента на мобильных устройствах — в браузере Google Chrome под ОС Android и в браузере Safari на iPhone/iPad. Доступны только основные функции веб-клиента.

Источник

Про веб-клиент 1С

Одной из приятных особенностей технологии 1С:Предприятие является то, что прикладное решение, разработанное по технологии управляемых форм, может запускаться как в тонком (исполняемом) клиенте под Windows, Linux, MacOS X, так и как веб-клиент под 5 браузеров – Chrome, Internet Explorer, Firefox, Safari, Edge, и все это – без изменения исходного кода приложения. Более того – внешне приложение в тонком клиенте и в браузере функционирует и выглядит практически идентично.
Найдите 10 отличий (под катом 2 картинки):

Окно тонкого клиента на Linux:

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

То же окно в веб клиенте (в браузере Chrome):

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

Зачем мы сделали веб-клиент? Говоря несколько пафосно, такую задачу перед нами поставило время. Уже давно работа через Интернет стала необходимым условием для бизнес-приложений. Вначале мы добавили возможность работы через Интернет для нашего тонкого клиента (некоторые наши конкуренты, кстати, на этом и остановились; другие, напротив, отказались от тонкого клиента и ограничились реализацией веб-клиента). Мы же решили дать нашим пользователям возможность выбрать тот вариант клиента, который им подходит больше.

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

Добавление возможности работы через Интернет для тонкого клиента было большим проектом с полной сменой архитектуры клиент-серверного взаимодействия. Создание же веб-клиента — и вовсе новый проект, начинавшийся с нуля.

Постановка задачи

Итак, требования к проекту: веб-клиент должен делать то же самое, что и тонкий клиент, а именно:

Клиентский код на языке 1С может содержать в себе серверные вызовы, работу с локальными ресурсами (файлами и т.п.), печать и многое другое.

И тонкий клиент (при работе через веб), и веб-клиент пользуются одним и тем же набором веб-сервисов для общения с сервером приложений 1С. Реализация у клиентов, конечно, разная – тонкий клиент написан на С++, веб-клиент – на JavaScript.

Немного истории

Проект создания веб-клиента стартовал в 2006 году, в нем (в среднем) участвовала команда из 5 человек. На отдельных этапах проекта привлекались разработчики для реализации специфической функциональности (табличного документа, диаграмм и т.д.); как правило, это были те же разработчики, что делали эту функциональность в тонком клиенте. Т.е. разработчики заново писали на JavaScript компоненты, ранее созданные ими на C++.

С самого начала мы отвергли идею какой-либо автоматической (хотя бы частичной) конверсии C++ кода тонкого клиента в JavaScript веб-клиента ввиду сильных концептуальных различий этих двух языков; веб-клиент писался на JavaScript с чистого листа.

В первых итерациях проекта веб-клиент конвертировал клиентский код на встроенном языке 1С непосредственно в JavaScript. Тонкий клиент поступает иначе — код на встроенном языке 1С компилируется в байт-код, и затем этот байт-код интерпретируется на клиенте. Впоследствии так же стал делать и веб-клиент – во-первых, это дало выигрыш в производительности, во-вторых – позволило унифицировать архитектуру тонкого и веб-клиентов.

Первая версия платформы 1С:Предприятие с поддержкой веб-клиента вышла в 2009 году. Веб-клиент на тот момент поддерживал 2 браузера – Internet Explorer и Firefox. В первоначальных планах была поддержка Opera, но из-за непреодолимых на тот момент проблем с обработчиками закрытия приложения в Opera (не удавалось со 100%-ной уверенностью отследить, что приложение закрывается, и в этот момент произвести процедуру отключения от сервера приложений 1С) от этих планов пришлось отказаться.

Структура проекта

Всего в платформе 1С:Предприятие есть 4 проекта, написанных на JavaScript:

Структурно веб-клиент по-крупному разделяется на следующие подсистемы:

Особенности разработки

Реализация всего вышеописанного на JavaScript – дело непростое. Возможно, веб-клиент 1С – одно из самых больших client-side приложений, написанных на JavaScript – около 450.000 строк. Мы активно используем в коде веб-клиента объектно-ориентированный подход, упрощающий работу с таким большим проектом.

Для минимизации размера клиентского кода мы вначале использовали свой собственный обфускатор, а начиная с версии платформы 8.3.6 (октябрь 2014) стали использовать Google Closure Compiler. Эффект использования в цифрах – размер фреймворка веб-клиента после обфускации:

Google Closure Compiler очень хорошо работает с объектно-ориентированным кодом, поэтому его эффективность именно для веб-клиента максимально высокая. Closure Compiler делает для нас несколько хороших вещей:

Для анализа кода мы используем SonarQube, куда интегрируем статические анализаторы кода. С помощью анализаторов мы отслеживаем деградацию качества исходного кода на JavaScript и стараемся ее не допускать.

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

Какие задачи решали/решаем

В ходе реализации проекта мы столкнулись с рядом интересных задач, которые нам пришлось решать.

Обмен данными с сервером и между окнами

Существуют ситуации, когда обфускирование исходного кода может помешать работе системы. Код, внешний по отношению к исполняемому коду веб-клиента, вследствие обфускации может иметь имена функций и параметров, отличающиеся от тех, которые наш исполняемый код ожидает. Внешним кодом для нас является:

А чтобы избежать обфускации при взаимодействии с другими окнами мы используем так называемые экспортируемые интерфейсы (интерфейсы, у которых все методы являются экспортируемыми).

We used Virtual DOM before it became mainstream)

Как и все разработчики, имеющие дело со сложным Веб UI, мы быстро поняли, что DOM плохо подходит для работы с динамическим пользовательским интерфейсом. Практически сразу был реализован аналог Virtual DOM для оптимизации работы с UI. В процессе обработки события все изменения DOM запоминаются в памяти и, только при завершении всех операций, накопленные изменения применяются к DOM-дереву.

Оптимизация работы веб-клиента

Чтобы наш веб-клиент работал быстрее, мы по максимуму стараемся задействовать штатные возможности браузера (CSS и т.п.). Так, командная панель формы (расположенная практически на каждой форме приложения) отрисовывается исключительно средствами браузера, динамической версткой на базе CSS.

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

Тестирование

Для функционального тестирования и тестирования производительности мы используем инструмент собственного производства (написанный на Java и C++), а также набор тестов, построенных на базе Selenium.

Наш инструмент универсален – он позволяет тестировать практически любые оконные программы, а потому подходит для тестирования как тонкого клиента, так и веб-клиента. Инструмент записывает действия пользователя, запустившего прикладное решение «1С», в файл-сценарий. В это же время происходит запись изображений рабочей области экрана — эталонов. При контроле новых версий веб-клиента сценарии проигрываются без пользовательского участия. В случаях несовпадения скриншота с эталонным на каком-либо шаге тест считается провалившимся, после чего специалист по качеству проводит расследование – ошибка это или запланированное изменение поведения системы. В случае запланированного поведения эталоны автоматически подменяются на новые.

Инструмент также проводит замеры производительности приложений с точностью до 25 миллисекунд. В ряде случаев мы закольцовываем части сценария (например, несколько раз повторяем ввод заказа) для анализа деградации времени выполнения со временем. Результаты всех замеров записываются в лог для анализа.

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент
Наш инструмент тестирования и тестируемое приложение

Наш инструмент и Selenium дополняют друг друга; например, если какая-то кнопка на одном из экранов поменяла свое местоположение – Selenium это может не отследить, но наш инструмент заметит, т.к. делает попиксельное сравнение скриншота с эталоном. Также инструмент в состоянии отследить проблемы с обработкой ввода с клавиатуры или мыши, так как именно их он и воспроизводит.

Тесты на обоих инструментах (нашем и Selenium) запускают типовые сценарии работы из наших прикладных решений. Тесты автоматически запускаются после ежедневной сборки платформы «1С:Предприятие». В случае замедления работы сценариев (по сравнению с предыдущей сборкой) мы проводим расследование и устраняем причину замедления. Критерий у нас простой – новая сборка должна работать не медленнее предыдущей.

Для расследования инцидентов замедления работы разработчики используют разные инструменты; в основном используется Dynatrace AJAX Edition производства компании DynaTrace. Проводится запись логов выполнения проблемной операции на предыдущей и на новой сборке, затем логи анализируются. При этом время выполнения единичных операций (в миллисекундах) может не быть решающим фактором – в браузере периодически запускаются служебные процессы типа уборки мусора, они могут наложиться на время выполнения функций и исказить картину. Более релевантными параметрами в этом случае будет количество выполненных инструкций JavaScript, количество атомарных операций над DOM и т.п. Если количество инструкций/операций в одном и том же сценарии в новой версии увеличилось – это почти всегда означает падение быстродействия, которое нужно исправлять.

Также одной из причин падения производительности может быть то, что Google Closure Compiler по какой-то причине не смог сделать inline-подстановку функции (например, потому что функция рекурсивная или виртуальная). В этом случае мы стараемся исправить ситуацию, переписав исходный код.

Расширения браузеров

В случае, когда прикладному решению нужна функциональность, которой нет в JavaScript, мы используем расширения браузеров:

При работе в Safari наши расширения используют NPAPI, при работе в Internet Explorer — технологию ActiveX. Microsoft Edge пока не поддерживает расширения, поэтому веб-клиент в нем работает с ограничениями.

Дальнейшее развитие

Одна из групп задач для команды разработки веб-клиента – это дальнейшее развитие функциональности. Функциональность веб-клиента должна быть идентична функциональности тонкого клиента, вся новая функциональность реализуется одновременно и в тонком, и в веб-клиенте.

Другие задачи — развитие архитектуры, рефакторинг, повышение производительности и надежности. Например, одно из направлений – дальнейшее движение в сторону асинхронной модели работы. Часть функциональности веб-клиента на настоящий момент построена на синхронной модели взаимодействия с сервером. Асинхронная модель сейчас становится в браузерах (и не только в браузерах) более актуальной, и это заставляет нас модифицировать веб-клиент путем замены синхронных вызовов на асинхронные (и соответствующего рефакторинга кода). Постепенный переход к асинхронной модели объясняется необходимостью поддержки выпущенных решений и постепенной их адаптации.

Источник

Веб-клиент

Тонкий клиент (англ. thin client ) в компьютерных технологиях — компьютер или программа-клиент в сетях с клиент-серверной или терминальной архитектурой, который переносит все или большую часть задач по обработке информации на сервер. Примером тонкого клиента может служить компьютер с браузером, использующийся для работы с веб-приложениями. Данным термином может также называться P2P-клиент, использующий в качестве сервера другие узлы сети.

Содержание

Web-клиенты

Web-клиент (англ. Web client ) как программа — браузер. Web-клиент как устройство — устройство, основным приложением которого (с точки зрения разработчика устройства или маркетолога) является браузер.

Тонкие клиенты, работающие в терминальном режиме

Под термином «тонкий клиент» подразумевается достаточно широкий с точки зрения системной архитектуры ряд устройств и программ, которые объединяются общим свойством: возможностью работы в терминальном режиме. Таким образом, для работы тонкого клиента необходим терминальный сервер. Этим тонкий клиент отличается от толстого клиента, который, напротив, производит обработку информации независимо от сервера, используя последний в основном лишь для хранения данных.

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

Для расширения функциональности тонкого клиента прибегают к его «утолщению», например, добавляют возможности автономной работы, сохраняя главное отличие — работу в сессии с терминальным сервером. Когда в клиенте появляются подвижные детали (жёсткие диски), появляются возможности автономной работы, он перестаёт быть тонким клиентом в чистом виде, а становится универсальным клиентом.

Тонкий клиент в большинстве случаев обладает минимальной аппаратной конфигурацией, вместо жёсткого диска для загрузки локальной специализированной ОС используется DOM (DiskOnModule) [модуль с разъёмом IDE, флэш-памятью и микросхемой, реализующей логику обычного жёсткого диска — в BIOS определяется как обычный жёсткий диск, только размер его обычно в 2-3 раза меньше]. В некоторых конфигурациях системы тонкий клиент загружает операционную систему по сети с сервера, используя протоколы PXE, BOOTP, DHCP, TFTP и Remote Installation Services (RIS).

Источник

Приступая к работе с веб-клиентом

Веб-клиент удаленного рабочего стола позволяет использовать совместимый веб-браузер для удаленного доступа к ресурсам вашей организации (приложениям и рабочим столам), опубликованным администратором. Вы сможете взаимодействовать с удаленными приложениями и рабочими столами как на локальном компьютере, где бы вы ни находились, без необходимости переключаться на другие ПК. Как только ваш администратор настроит удаленные ресурсы, достаточно будет вашего домена, имени пользователя, пароля и URL-адреса, отправленного вам администратором, а также поддерживаемого веб-браузера, чтобы приступить к работе.

Хотите узнать о новых выпусках веб-клиента? Ознакомьтесь с разделом Что нового в возможностях веб-клиента удаленного рабочего стола?

Что потребуется для использования веб-клиента

Версия веб-клиента для Internet Explorer на данный момент не поддерживает звук. В Safari может отображаться серый экран, если несколько раз изменить размер окна браузера или переключить полноэкранный режим.

Начало работы с клиентом удаленного рабочего стола

Входя в веб-клиент, вы подтверждаете, что компьютер соответствует политике безопасности вашей организации.

После входа в клиент вы перейдете на вкладку Все ресурсы, которая содержит все опубликованные для вас элементы, упорядоченные в свертываемых группах, например «Рабочие ресурсы». Вы увидите несколько значков, представляющих приложения, рабочие столы или папки, содержащие несколько приложений или рабочих столов, к которым администратор предоставил доступ рабочей группе. Вы сможете вернуться на эту вкладку в любое время, чтобы запустить дополнительные ресурсы.

Чтобы начать использовать приложение или рабочий стол, выберите элемент, который вы хотите использовать, введите имя пользователя и пароль, используемые для входа в веб-клиент, при появлении соответствующего запроса, а затем выберите Отправить. Возможно, появится диалоговое окно согласия на доступ к локальным ресурсам, таким как буфер обмена и принтер. Вы можете не перенаправлять их или выбрать вариант Разрешить, чтобы использовать параметры по умолчанию. Дождитесь, когда веб-клиент установит соединение, и затем используйте ресурс обычным образом.

Когда вы закончите, можно завершить сеанс, выбрав кнопку Выход на панели инструментов в верхней части экрана или закрыв окно браузера.

Сочетания клавиш для веб-клиента

В следующей таблице описаны альтернативные сочетания клавиш для использования стандартных сочетаний клавиш Windows в удаленном сеансе.

Сочетание клавишОписание
(Windows) CTRL+ALT+END (MacOS) FN+CTRL+OPTION+DELETEВнедряет CTRL+ALT+DEL в удаленном сеансе.
ALT+F3Внедряет клавишу Windows в удаленном сеансе.

Печать из веб-клиента удаленного рабочего стола

Выполните следующие действия, чтобы распечатать что-либо из веб-клиента.

Передача файлов с помощью веб-клиента

Чтобы узнать, как включить передачу файлов через веб-клиент, см. статью Настройка перенаправлений устройств.

Чтобы переместить файлы с локального компьютера в удаленный сеанс:

Чтобы скачать файлы из удаленного сеанса на локальный компьютер:

Копирование и вставка из веб-клиента удаленного рабочего стола

Веб-клиент в настоящее время поддерживает копирование и вставку только для текста. Файлы невозможно копировать или вставлять через веб-клиент. Кроме того, можно использовать только CTRL+C и CTRL+V для копирования и вставки текста.

Использование редактора методов ввода (IME) в удаленном сеансе

Веб-клиент поддерживает использование редактора метода ввода (IME) в удаленном сеансе версии 1.0.21.16 и выше. Прежде чем использовать IME, нужно установить языковой пакет для клавиатуры, которую вы хотите использовать в удаленном сеансе на виртуальной машине узла. Дополнительные сведения о настройке языковых пакетов в удаленном сеансе см. в статье Добавление языковых пакетов в образ Windows 10 с несколькими сеансами.

Чтобы включить ввод IME с помощью веб-клиента:

Веб-клиент будет скрывать окно локального редактора метода ввода, когда вы находитесь в удаленном сеансе. Если изменить параметры IME после подключения к удаленному сеансу, такие изменения не будут действовать. Веб-клиент не поддерживает ввод IME при использовании окна в режиме инкогнито.

Если языковой пакет не установлен на виртуальной машине узла, удаленный сеанс будет по умолчанию использовать английскую клавиатуру (США).

Помощь в работе с веб-клиентом

Если у вас возникла проблема, которую не удается устранить, используя сведения из этой статьи, вы можете получить помощь по работе с веб-клиентом, написав на адрес, указанный на странице отзывов веб-клиента.

Источник

Как работают веб-приложения

1. Чем веб-приложения отличаются от сайтов

Для меня сайт это в первую очередь что-то информационное и статичное: визитка компании, сайт рецептов, городской портал или вики. Набор подготовленных заранее HTML-файлов, которые лежат на удаленном сервере и отдаются браузеру по запросу.

Сайты содержат различную статику, которая как и HTML-файл не генерируется на лету. Чаще всего это картинки, CSS-файлы, JS-скрипты, но могут быть и любые другие файлы: mp3, mov, csv, pdf.

Блоги, визитки с формой для контакта, лендинги с кучей эффектов я тоже отношу для простоты к сайтам. Хотя в отличие от совсем статических сайтов, они уже включают в себя какую-то бизнес-логику.

А веб-приложение — это что-то технически более сложное. Тут HTML-страницы генерируются на лету в зависимости от запроса пользователя. Почтовые клиенты, соцсети, поисковики, интернет-магазины, онлайн-программы для бизнеса, это все веб-приложения.

2. Какие бывают веб-приложения

Веб-приложения можно разделить на несколько типов, в зависимости от разных сочетаний его основных составляющих:

3. Pyhon-фреймворк Django aka бэкенд

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

В разработке фреймворк — это набор готовых библиотек и инструментов, которые помогают создавать веб-приложения. Для примера опишу принцип работы фреймворка Django, написанного на языке программирования Python.

Первым этапом запрос от пользователя попадает в роутер (URL dispatcher), который решает какую функцию для обработки запроса надо вызвать. Решение принимается на основе списка правил, состоящих из регулярного выражения и названия функции: если такой-то урл, то вот такая функция.

Функция, которая вызывается роутером, называется вью (view). Внутри может содержаться любая бизнес-логика, но чаще всего это одно из двух: либо из базы берутся данные, подготавливаются и возвращаются на фронт; либо пришел запрос с данными из какой-то формы, эти данные проверяются и сохраняются в базу.

Данные приложения хранятся в базе данных (БД). Чаще всего используются реляционные БД. Это когда есть таблицы с заранее заданными колонками и эти таблицы связаны между собой через одну из колонок.

Данные в БД можно создавать, читать, изменять и удалять. Иногда для обозначения этих действий можно встретить аббревиатуру CRUD (Create Read Update Delete). Для запроса к данным в БД используется специальный язык SQL (structured query language).

В Джанго для работы с БД используются модели (model). Они позволяют описывать таблицы и делать запросы на привычном разработчику питоне, что гораздо удобнее. За это удобство приходится платить: такие запросы медленнее и ограничены в возможностях по сравнению с использованием чистого SQL.

Полученные из БД данные подготавливаются во вью к отправке на фронт. Они могут быть подставлены в шаблон (template) и отправлены в виде HTML-файла. Но в случае одностраничного приложения это происходит всего один раз, когда генерируется HTML-страница, на который подключаются все JS-скрипты. В остальных случаях данные сериализуются и отправляются в JSON-формате.

4. Javascript-фреймворки aka фронтенд

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

Клиентская часть приложения — это скрипты, написанные на языке программирования Javascript (JS) и исполняемые в браузере пользователя. Раньше вся клиентская логика основывалась на использовании библиотеки JQuery, которая позволяет работать с DOM, анимацией на странице и делать AJAX запросы.

DOM (document object model) — это структура HTML-страницы. Работа с DOM — это поиск, добавление, изменение, перемещеие и удаление HTML-тегов.

AJAX (asynchronous javascript and XML) — это общее название для технологий, которые позволяют делать асинхронные (без перезагрузки страницы) запросы к серверу и обмениваться данными. Так как клиентская и серверная части веб-приложения написаны на разных языках программирования, то для обмена информацией необходимо преобразовывать структуры данных (например, списки и словари), в которых она хранится, в JSON-формат.

JSON (JavaScript Object Notation) — это универсальный формат для обмена данными между клиентом и сервером. Он представляет собой простую строку, которая может быть использована в любом языке программирования.

Сериализация — это преобразование списка или словаря в JSON-строку. Для примера:

Десериализация — это обратное преобразование строки в список или словарь.

С помощью манипуляций с DOM можно полностью управлять содержимым страниц. С помощью AJAX можно обмениваться данными между клиентом и сервером. С этими технологиями уже можно создать SPA. Но при создании сложного приложения код фронтенда, основанного на JQuery, быстро становится запутанным и трудно поддерживаемым.

К счастью, на смену JQuery пришли Javascript-фреймворки: Backbone Marionette, Angular, React, Vue и другие. У них разная философия и синтаксис, но все они позволяют с гораздо большим удобством управлять данными на фронтенде, имеют шаблонизаторы и инструменты для создания навигации между страницами.

HTML-шаблон — это «умная» HTML-страница, в которой вместо конкретных значений используются переменные и доступны различные операторы: if, цикл for и другие. Процесс получения HTML-страницы из шаблона, когда подставляются переменные и применяются операторы, называется рендерингом шаблона.

Полученная в результате рендеринга страница показывается пользователю. Переход в другой раздел в SPA это применение другого шаблона. Если необходимо использовать в шаблоне другие данные, то они запрашиваются у сервера. Все отправки форм с данными это AJAX запросы на сервер.

5. Как клиент и сервер общаются между собой

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

Общение клиента с сервером происходит по протоколу HTTP. Основа этого протокола — это запрос от клиента к серверу и ответ сервера клиенту.

Для запросов обычно используют методы GET, если мы хотим получить данные, и POST, если мы хотим изменить данные. Еще в запросе указывается Host (домен сайта), тело запроса (если это POST-запрос) и много дополнительной технической информации.

Современные веб-приложения используют протокол HTTPS, расширенную версию HTTP с поддержкой шифрования SSL/TLS. Использование шифрованного канала передачи данных, независимо от важности этих данных, стало хорошим тоном в интернете.

Есть еще один запрос, который делается перед HTTP. Это DNS (domain name system) запроc. Он нужен для получения ip-адреса, к которому привязан запрашиваемый домен. Эта информация сохраняется в браузере и мы больше не тратим на это время.

Когда запрос от браузера доходит до сервера, он не сразу попадает в Джанго. Сначала его обрабатывает веб-сервер Nginx. Если запрашивается статический файл (например, картинка), то сам Nginx его отправляет в ответ клиенту. Если запрос не к статике, то Nginx должен проксировать (передать) его в Джанго.

К сожалению, он этого не умеет. Поэтому используется еще одна программа-прослойка — сервер приложений. Например для приложений на питоне, это могут быть uWSGI или Gunicorn. И вот уже они передают запрос в Джанго.

После того как Джанго обработал запрос, он возвращает ответ c HTML-страницей или данными, и код ответа. Если все хорошо, то код ответа — 200; если страница не найдена, то — 404; если произошла ошибка и сервер не смог обработать запрос, то — 500. Это самые часто встречающиеся коды.

6. Кэширование в веб-приложениях

Что такое web клиент. Смотреть фото Что такое web клиент. Смотреть картинку Что такое web клиент. Картинка про Что такое web клиент. Фото Что такое web клиент

Еще одна технология, с которой мы постоянно сталкиваемся, которая присутствует как веб-приложениях и программном обеспечении, так и на уровне процессора в наших компьютерах и смартфонах.

Cache — это концепция в разработке, когда часто используемые данные, вместо того чтобы их каждый раз доставать из БД, вычислять или подготавливать иным способом, сохраняются в быстро доступном месте. Несколько примеров использования кэша:

Источник

Добавить комментарий

Ваш адрес email не будет опубликован. Обязательные поля помечены *