Как стать автором
Обновить
0
Рейтинг

Ajax

Asynchronous Javascript and XML

Сначала показывать
  • Новые
  • Лучшие
Порог рейтинга
  • Все
  • ≥0
  • ≥10
  • ≥25
  • ≥50
  • ≥100

Как работать с ошибками бизнес-логики через HTTP

AjaxРазработка веб-сайтовAPI

Почти все разработчики так или иначе постоянно работают с api по http, клиентские разработчики работают с api backend своего сайта или приложения, а бэкендеры "дергают" бэкенды других сервисов, как внутренних, так и внешних. И мне кажется, одна из самых главных вещей в хорошем API это формат передачи ошибок. Ведь если это сделано плохо/неудобно, то разработчик, использующий это API, скорее всего не обработает ошибки, а клиенты будут пользоваться молчаливо ломающимся продуктом.

За 7 лет я как поддерживал множество legacy API, так и разрабатывал c нуля. И я поработал, наверное, с большинством стратегий по возвращению ошибок, но каждая из них создавала дискомфорт в той или иной мере. В последнее время я нащупал оптимальный вариант, о котором и хочу рассказать, но с начала расскажу о двух наиболее популярных вариантах.

Читать далее
Всего голосов 14: ↑11 и ↓3+8
Просмотры6.2K
Комментарии 39

Новости

Показать еще

Ajax, REST API OpenCart

AjaxPHPJavaScriptПрограммирование

В статье рассмотрим как устроены ajax запросы в OpenCart, в том числе запросы через api OpenCart, познакомимся с новым понятием front controller и немного коснемся темы ajax REST API.

Читать далее
Всего голосов 3: ↑0 и ↓3-3
Просмотры2.8K
Комментарии 2

Расширенный HTML

AjaxРазработка веб-сайтовJavaScriptHTML
Из песочницы
Tutorial

В этой статье хотел бы рассказать немного про библиотеку, первую версию которой я создал еще в конце прошлого года. Суть очень простая — расширить возможности языка HTML, чтобы можно было без JavaScript'а писать простые и рутинные вещи: отправка формы в json формате, загрузка HTML тимплейтов на определенную страницу(по сути модульная система для HTML через http/s запросы), турболинки(привет пользователям RoR), простая шаблонизация на основе ответов ajax запросов и немного еще.


image


Библиотека называется EHTML или Extended HTML. Основана она на небезызвестной идее веб компонентов. Она доступна на гитхабе, там довольно таки структурированная документация с примерами. В этой статье я просто опишу основные идеи, возможно кому-то это зайдет.

Читать дальше →
Всего голосов 29: ↑26 и ↓3+23
Просмотры12K
Комментарии 21

Как Амплифер использует Logux — инструмент для связи клиента и сервера

AjaxРазработка веб-сайтовJavaScript
🔥 Технотекст 2020

Logux — инструмент для связи клиента и сервера


Меня зовут Виталий Ризо, я старший фронтенд-разработчик в «Амплифере». Поделюсь, как мы применяем Logux в веб-приложении: организуем обмен данными в реальном времени, уведомления об ошибках без перезагрузки страницы, общение между вкладками браузера и интеграцию с Redux.

Читать дальше →
Всего голосов 21: ↑20 и ↓1+19
Просмотры4.9K
Комментарии 5

Dap в действии. Пишем TodoMVC. Часть 1

AjaxРазработка веб-сайтовJavaScriptПрограммированиеHTML
Tutorial
Первая статья про dap, очевидно, не стала моим писательским успехом: подавляющее большинство коментов к ней свелись к «ниасилил» и «ниасилил, но осуждаю». А приз за самый единственный конструктивный комментарий верхнего уровня достается OldVitus, за совет продемонстрировать dap на примере TodoMVC, чтобы было с чем сравнить. Чем я в этой статье и займусь.

TodoMVC, если кто не знает, это такой стандартный UI-хелловорлд, позволяющий сравнить решения одной и той же задачи — условного «Списка дел» — средствами разных фреймворков. Задачка, при всей своей простоте (ее решение на dap влезает «в один экран»), весьма иллюстративна. Поэтому на ее примере я попробую показать, как типичные для веб-фронтенда задачи реализуются с помощью dap.

Искать и изучать формальное описание задачи я не стал, а решил просто среверсить один из примеров. Бэкенд в рамках этой статьи нам не интересен, поэтому сами мы его писать не будем, а воспользуемся одним из готовых с сайта www.todobackend.com, оттуда же возьмем и пример клиента и стандартный CSS-файл.

Для использования dap вам не нужно ничего скачивать и устанавливать. Никаких npm install и вот этого всего. Не требуется создавать никаких проектов с определенной структурой каталогов, манифестами и прочей атрибутикой IT-успеха. Достаточно текcтового редактора и браузера. Для отладки XHR-запросов может еще потребоваться веб-сервер — достаточно простейшего, типа вот этого расширения для Chrome. Весь наш фронтенд будет состоять из одного-единственного .html-файла (разумеется, ссылающегося на скрипт dap-движка и на стандартный CSS-файл TodoMVC)

Итак, с чистого листа.
Читать дальше →
Всего голосов 10: ↑6 и ↓4+2
Просмотры1.9K
Комментарии 89

Dap — еще один реактивный движок для веба. Совсем другой

AjaxВеб-дизайнJavaScriptПрограммированиеHTML
Из песочницы
Хочу рассказать про dap — интересный и необычный язык реактивных правил для написания, в частности, веб-фронтендов.

Для затравки простая задачка: взять список неких пользователей (воспользуемся тестовыми данными, любезно предоставляемыми сервисом jsonplaceholder.typicode.com) и вывести их имена обычным html-списком; при нажатии на имя пользователя — показать алерт с его id.

Это, конечно, легко делается и на React, и на Angular, и на Vue. Вопрос: насколько легко? В dap это делается так:

'UL.users'.d("* :query`https://jsonplaceholder.typicode.com/users"
 ,'LI'.d("! .name").ui("? .id:alert")
)

(*Этот и последующие dap-примеры можно интерактивно потестить в песочнице dap.js.org/test.html)

Это первая пришедшая в голову тривиальная задачка и тривиальный же способ ее решения. На dap удобно писать «в лоб», не городя огород из классов, компонентов и прочего ритуального реквизита. Что вижу, то пою. Но «пою» не на javascript или его производных, а на языке dap-правил, специально заточенном на простое и лаконичное описание реактивных зависимостей между элементами.
Читать дальше →
Всего голосов 20: ↑16 и ↓4+12
Просмотры4K
Комментарии 39

Обзор пяти HTTP-библиотек для веб-разработки

Блог компании RUVDS.comAjaxРазработка веб-сайтов
Перевод
Одна из важнейших задач, которую приходится решать программисту при разработке веб-проектов, заключается в организации обмена данными между клиентскими и серверными частями таких проектов. Это может выглядеть так: пользователь нажимает некую кнопку на странице, открытой в браузере, в ответ система выполняет запрос к серверу, после чего сервер отправляет странице запрошенные у него данные. Для того чтобы вывести такие данные, на странице, без её перезагрузки, производится их обработка, после чего страница обновляется и пользователь получает то, что ему нужно.



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

Материал, перевод которого мы сегодня публикуем, посвящён анализу пяти популярных инструментов для работы с HTTP: Axios, Request, Superagent, Fetch и Supertest.
Читать дальше →
Всего голосов 30: ↑25 и ↓5+20
Просмотры25K
Комментарии 20

Модальное окно, которое вы ждали. Или как вызвать «всплывашку» с разных кнопок на чистом JS

AjaxWordPressJavaScript
Из песочницы
Добрый день! Меня зовут Черепанов Борис, я занимаюсь разработкой сайтов на wordpress и bitrix. Я тут над проектом работал. Одно из ограничений было не использовать jquery, а мне нужно было вызвать одно и тоже модальное окно с разных кнопок. Собственно, это довольно простая задача, но я решил пойти дальше и сделать модальное окно, которое бы создавалось при первом клике, сохраняло своё состояние, имело конструктор для вызова и т.д. И в итоге я не пожалел. Объясню почему позже. Я «обернул» это модальное окно в готовое решение, которое можно использовать постоянно.
Читать дальше →
Всего голосов 32: ↑15 и ↓17-2
Просмотры18K
Комментарии 58

Модификация ajax js для ajax Asp .net mvc

AjaxJavaScript.NETASPC#
Из песочницы
Многие начинающие программисты C# ASP .NET MVC (далее mvc) сталкиваются с задачей отправки данных с помощью Ajax. Вот только на практике эта задача оказывается не такой легкой.

На своей работе я пытаюсь придерживаться определённых принципов разработки программного обеспечения. Одним из них является минимизация написания кода и создание универсальный классов и функций. Именно этот принцип предполагал использование jquery.unobtrusive-ajax.js и класс Ajax для mvc.
Читать дальше →
Всего голосов 23: ↑19 и ↓4+15
Просмотры5K
Комментарии 22

Практическое применение каррирования в js на примере модуля http запросов

AjaxJavaScriptФункциональное программирование
Из песочницы

Всем привет! Ни для кого не секрет, что в мире программирования есть много приемов, практик и шаблонов программирования (проектирования), но зачастую, узнав что-то новое, совершенно не понятно, куда и как это новое применить.


Сегодня на примере создания небольшого модуля-обертки для работы с http запросами разберем реальную пользу каррирования — приема функционального программирования.


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

Читать дальше →
Всего голосов 21: ↑16 и ↓5+11
Просмотры7.2K
Комментарии 11

Создание сайта на Delphi, или Как использовать uniGUI по-минимуму

AjaxРазработка веб-сайтовDelphiHTML
uniGUI – это библиотека, позволяющая создавать веб-приложения в классической Delphi-манере, посредством визуальных компонентов, причём, что является немаловажным, в большинстве случаев она полностью скрывает от разработчика всю клиентскую (браузерную) «кухню»: не требуется знать ни HTML, ни CSS, ни JavaScript, а вся разработка ведётся лишь на одном языке – Delphi.

Если смотреть на картину издалека, то вырисовываются 3 сценария использования библиотеки:

  1. Наиболее благоприятный, для которого она в целом и создавалась, когда описанная сильная, радужная сторона uniGUI проявляет себя в полной мере – перенос (полный или частичный – неважно) настольных приложений в веб, что возможно проделать быстро, привычным способом и с высоким качеством только в случаях, когда поставляемые с библиотекой компоненты сразу обеспечивают требуемый функционал – к примеру, фильтрацию и сортировку по столбцам таблицы.
  2. Очень похож на первый и в какой-то мере вытекает из него, с тем лишь отличием, что штатный набор компонентов не покрывает все необходимые по ТЗ возможности; если снова взять для примера таблицу, то таким требованием может стать многоуровневая группировка строк по произвольным столбцам. Если удастся найти сторонние решения с нужными возможностями, то сценарий сводится к первому, а если нет, то потребуется самостоятельная доработка, что уже весьма нетривиально, т. к. здесь не обойтись не просто без знаний JavaScript, а ещё и глубокого владения фреймворком Ext JS, на основе которого работает браузерная сторона uniGUI.
  3. Последний сценарий может показаться странным и даже чужеродным для тех, кто применял на практике в основном первый, – речь об отказе от всей богатой палитры визуальных компонентов и разработке клиентской части веб-приложения исключительно с использованием родной для неё триады – HTML, CSS и JavaScript. Данная статья покажет, в каких случаях подобное допустимо, а также продемонстрирует способ реализовать задуманное.
Читать дальше →
Всего голосов 23: ↑21 и ↓2+19
Просмотры30K
Комментарии 198

Надоевшая почта или как отправлять сообщения с сайта в Telegram через Node.js (Express)

AjaxJavaScriptПрограммированиеNode.JSAPI
Из песочницы
logicSchema

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

Так как мое приложение работает на ноде, подумал почему бы не прокачать форму. Общая логика до боли проста. При отправке формы делается запрос к api приложения, где хранится токен бота, обрабатываются данные и далее делается запрос к api телеграмма, который отправляет сообщение в чат.

Но давайте обо всем по порядку.
Читать дальше →
Всего голосов 28: ↑24 и ↓4+20
Просмотры26K
Комментарии 15

Инверсия зависимостей в мире фронтенда. Лекция Яндекса

Блог компании ЯндексAjaxOpen sourceJavaScriptИнтерфейсы
Паттерны инверсии контроля (dependency inversion, DI) известны уже давно, но пока не нашли широкого распространения в мире фронтенда. Этот доклад отвечает на вопрос о том, как за счет возможностей JS построить надежную архитектуру на основе DI-контейнера. Автор доклада — Евгений ftdebugger Шпилевский, руководитель группы разработки интерфейсов в Яндекс.Коллекциях.


— Насколько мне известно, инверсия зависимостей, DI-контейнеры и прочие паттерны, придуманные еще в 70-е годы, не очень плотно вошли в мир разработки фронтенда. На это наверняка есть причина. Отчасти дело в том, что многим людям непонятно, зачем они вообще нужны.
Читать дальше →
Всего голосов 47: ↑41 и ↓6+35
Просмотры41K
Комментарии 8

Работаем с долгими API в ASP.NET Core правильно или тонкости переезда на новую платформу

AjaxРазработка веб-сайтов.NETAPIC#
Microsoft очень постарался, создавая новую платформу для веб-разработки. Новый ASP.NET Core похож на старенький ASP.NET MVC только, быть может, самой MVC-архитектурой. Ушли сложности и привычные вещи из старой платформы, появился встроенный DI и легковесные view-компоненты, HTTP модули и хэндлеры уступили место middleware и т.д. Вкупе с кроссплатформенностью и хорошей производительностью всё это делает платформу очень привлекательной для выбора. В этой статье я расскажу, как мне удалось решить специфическую задачу логирования длительных запросов к сторонним API для повышения удобства анализа инцидентов.
Читать дальше →
Всего голосов 6: ↑5 и ↓1+4
Просмотры16K
Комментарии 48

Отслеживание отправки форм с помощью GTM

AjaxHTMLAction ScriptРазработка под e-commerceРазработка систем связи
Recovery mode
image

Всем привет!

Краткое вступление:

Если у вас есть грамотные разработчики и формы на вашем сайте можно отследить с помощью стандартного триггера “Отправка формы” в Google Tag Manager или встроить событие в обработчик — я вам искренне завидую. Сегодня мы рассматриваем другой случай.

ПРОБЛЕМА:

Последнее время всё реже можно встретить ситуацию, когда после отправки формы пользователь перенаправляется на новую страницу. Все манипуляции обычно происходят по тому же адресу. То есть для отправки данных используется технология AJAX.

Неточные и малоэффективные способы отслеживания статистики будут существовать всегда.
Читать дальше →
Всего голосов 5: ↑3 и ↓2+1
Просмотры26K
Комментарии 4

Корпоративный телефонный справочник с картой

AjaxPHPMySQLJavaScriptHTML
Из песочницы

Всем привет! Хочу поделиться корпоративным телефонным справочником с картой офиса. Удобен для ориентирования в большой организации. Особенно будет полезен новым сотрудникам, которые еще не запомнили кто из коллег где сидит.


screenshot

Читать дальше →
Всего голосов 36: ↑32 и ↓4+28
Просмотры29K
Комментарии 31

Кроссбраузерная отправка формы с файлом или как переписать весь отправщик несколько раз после тестирования в IE

AjaxJavaScriptInternet Explorer
Tutorial
Задача: отправка и обработка файлов с помощью FormData и FileReader в форме со всеми возможными полями и пересылкой дополнительных параметров для каждого поля c объединением всех данных формы (кроме файлов и системных полей) в общий массив.

Поддержка: все современные браузеры, IE 10+.

Плагины: jquery-2.1.4

image
Читать дальше →
Всего голосов 17: ↑13 и ↓4+9
Просмотры12K
Комментарии 11

Встраиваемый компактный веб-сервер Mongoose

AjaxПрограммированиеAPIC
В процессе разработки различных проектов на C/C++ часто возникает необходимость общаться с внешними системами или отдавать данные клиентам по HTTP. Примером может служить любой веб-сервис, а также любое устройство с веб-интерфейсом типа роутера, системы видеонаблюдения, и т.д.

Что в таком случае обычно делают? Правильно, идут протоптанной дорожкой — Apache/nginx + PHP. А дальше начинается ад, потому что:

1. Все это нужно устанавливать и настраивать.
2. Все это жрет приличное количество ресурсов.
3. Из PHP как-то надо получать данные от разрабатываемой системы. Повезет если для этого достаточно просто залезть в СУБД.

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

1. Меньше внешних зависимостей, а значит проще установка и настройка.
2. Теоретически меньшее потребление ресурсов.
3. Можно отдавать данные прямо из вашего продукта, без посредников.
Но при этом мы не желаем заморачиваться всякими тонкостями обработки HTTP-соединений, парсинга и т.п.

Такие решения есть. И в этой статье я хотел бы поверхностно познакомить вас с одним из них – встраиваемый сервер Mongoose (не путать с MongoDB).
Читать дальше →
Всего голосов 16: ↑14 и ↓2+12
Просмотры19K
Комментарии 25

Удаленные AJAX компоненты для ReactJS

AjaxJavaScriptReactJS

Здесь будет идти речь о том, как отдельно от всего реакт-приложения подгрузить удаленный реакт компонент и отрендерить его! Я покажу как решил эту проблему, т.к. год спустя я так и не могу найти аналогичные решения кроме как react-remote-component-demo.


Читать дальше →
Всего голосов 20: ↑18 и ↓2+16
Просмотры7.3K
Комментарии 17

Путеводитель по JavaScript Promise для новичков

Блог компании ZeroTechAjaxРазработка веб-сайтовJavaScript
Tutorial
image

Этот материал мы подготовили для JavaScript-программистов, которые только начинают разбираться с «Promise». Обещания (promises) в JavaScript – это новый инструмент для работы с отложенными или асинхронными вычислениями, добавленный в ECMAScript 2015 (6-я версия ECMA-262).
Читать дальше →
Всего голосов 14: ↑14 и ↓0+14
Просмотры124K
Комментарии 61

Вклад авторов