Пользователь
0,0
рейтинг
25 июня 2013 в 09:42

Разработка → Yaxy — proxy-сервер для веб-разработчика

Yaxy — proxy-сервер, подменяющий различные части HTTP-запросов и ответов на указанные в config-файле значения. Я не буду здесь описывать, как поставить, настроить и запустить сервер, это всё описано в readme репозитория. Здесь я опишу различные случаи, в которых Yaxy очень помогает, а то и вовсе незаменим.



Замена файлу hosts



В простейшем случае у нас будут правила

    site.my => 127.0.0.1


В результате получим функциональность файла hosts с дополнительными плюшками:

  • Файл hosts кэшируется, иногда приходится несколько раз нажимать Ctrl+F5, чтобы увидеть изменения. Правила из конфига Yaxy применяются сразу после сохранения.
  • Локальность. Файл hosts влияет на всю систему, через проксю же ходят только нужные вам браузеры. Хотя в некоторых случаях это может быть недостатком.
  • А у вас есть виртуальные машины с различными браузерами в них? В каждой виртуальной машине приходится поддерживать файл hosts. А можно просто прописать всем браузерам один прокси-сервер.
  • Вы проверяете свои сайты в iPhone/iPad? Хорошо, если есть девелоперский сервер, а если нет — приходится олаживаться в продакшне. С Yaxy мы указываем в настройках прокси-сервер на нашем локальном компьютере и смотрим с телефона все локальные сайты.


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

    site.my => localhost:9898


Серверные ребята так долго всё делают



А мне позарез нужна поддержка HTTP-заголовока Origin на сайте, чтобы отладить свои скрипты. Не надо никого ждать.

     www.yandex.ru => $
        $SetResponseHeader Access-Control-Allow-Origin: *


Теперь на моём компьютере скрипты любого сайта смогут читать www.yandex.ru.

Тестируемся на нужных данных



У себя на сайте вы за данными ходите аяксом. Вдруг выясняется, что на определённых данных ваш скрипт падает, но воспроизвести именно такие данные штатными средствами системы не так-то просто. Да, честно говоря, и непонятно пока, какой именно должен быть JSON, чтобы всё сломалось. Можно попробовать пропатчить сервер, чтобы он на определённый урл выдавал константный JSON, а можно в конфиге прокси-сервера написать

    my-service.my/my-data.json => data:application/json;{"success":false,"error":"Большущая ошибка"}


Отлаживаем в продакшне



В JS-коде обнаружена ошибка, которая воспроизводится только в продакшне.

    my-service.ru/scripts/main.js => my-service.dev/scripts/main.js


Теперь весь сайт грузится с продакшна, а единственный скрипт main.js — с локального сайта.

Отлаживаемся на чужом сайте



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

Что ж, сохраняем исходный код какой-нибудь страницы сайта, а в конфиг Yaxy пишем

    bad-site.ru/page.html => file:///home/me/bad-site.html


Для браузера ничего не поменялось, а вы теперь сможете исправить код страницы по своему усмотрению. А дальше стандартно — удаляем в файле различные строки и смотрим, после удаления которой пропадёт ошибка. Обнаружили, что ошибка появляется при подключении файла script.js? Подменяем его таким же образом и смотрим, что именно в нём плохого. После этого по желанию — или пишете владельцу, что код у него в таком-то месте, мягко говоря, так себе, или (что предпочтительней) адаптируете свой скрипт к подобным ситуациям.

Сайт за 30 секунд



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

    new-site.my => file://c:/www/my-site


Теперь в папке c:/www/my-site лежат файлы сайта, открывающиеся в браузере по адресу new-site.my.

Тестируем аяксовую загрузку данных



Распространённая проблема: на локалхосте всё работает быстро, кажется, что индикация загрузки не нужна. Но даже если есть понимание, что какая-то крутящаяся картинка нужна, мы её всё равно не успеваем увидеть.

    my-site.ru/data/data.json => $
        $Delay 5


Теперь файл data.json будет грузиться не менее 5 секунд.

Убираем мешающие HTTP-заголовки



Вам для тестов нужно открыть какой-то сайт в iframe, но сайт посылает заголовок X-Frame-Options: DENY. Добавляем правило

    site.ru => $
        $RemoveResponseHeader X-Frame-Options


Нет больше мешающего заголовка.

Заказ на доработку скриптов сайта



К вам обратился странный человек: он хочет, чтобы вы написали JS-скрипт для сайта, но доступ к сайту давать не хочет. А сайт достаточно сложен, скрипт нужно тестировать обязательно на нём. Нет никаких проблем. Выбираем на нужной странице сайта какой-нибудь подключенный JS-файл (например, /js/main.js), сохраняем его к себе (например в /home/me/main.js), добавляем в Yaxy правило

    site.ru/js/main.js => file:///home/me/main.js


Теперь весь сайт будет работать в обычном режиме, а файл main.js будет грузиться локально. Дописываем новый код в конец файла, потом можно будет вынести его отдельно.

А что если нужно менять вёрстку? Тоже никаких проблем. Сохраняем исходник главной страницы, добавляем правило

    !site.ru/ => file:///home/me/site.ru.html


Теперь вся главная страница сайта лежит у вас на диске, можно менять вёрстку по желанию.

Это далеко не полный перечень ситуаций, в которых меня выручает Yaxy. Буду рад, если он и вам пригодится. Ну и конечно приветствуются багрепорты.
Kolyaj @Kolyaj
карма
48,0
рейтинг 0,0

Похожие публикации

Реклама помогает поддерживать и развивать наши сервисы

Подробнее
Спецпроект

Самое читаемое Разработка

Комментарии (41)

  • 0
    Спасибо
  • 0
    Выглядит интересно, но меня лично вполне устраивает (да и возможностей больше) dnsmasq, nginx и небольшой скрипт для opensearch.
    • 0
      Я когда-то тоже жил на hosts+nginx, но в результате написал Yaxy ради удобного конфигурирования. А ещё в описанной ситуации с айфоном такой набор не поможет.

      А каких возможностей больше?
      • 0
        Я сказал что dnsmasq + nginx + небольшой скрипт меня вполне устраивает.

        — dnsmasq — любое количество доменов вида domain.tld/domain.dev/domain.whatever, ссылающихся на localhost. Одна строчка в конфигурации и про hosts можно забыть.
        — nginx — один конфиг для любого количества виртуалхостов для доменов из предыдущего пункта с поддержкой php (для всего остального localhost:port / зона dev). Достаточно просто создать каталог (или развернуть шаблон проекта из vcs и начать экспериментировать)
        — скрипт обеспечивает api для angularjs морды и opensearch. Удобная навигация по любому количеству доменов из предыдущих пунктов (первый эшелон — opensearch. второй — морда на angularjs в духе dmenu). Очень удобно.
        — есть шаблоны которые просто нужно адаптировать под задачу.
        — используются знакомые, предсказуемые инструменты.

        > А ещё в описанной ситуации с айфоном такой набор не поможет.
        Вы проверяете свои сайты в iPhone/iPad? Хорошо, если есть девелоперский сервер, а если нет — приходится олаживаться в продакшне. С Yaxy мы указываем в настройках прокси-сервер на нашем локальном компьютере и смотрим с телефона все локальные сайты.

        Если честно я не вижу тут проблемы. Может быть я просто не так понял суть задачи.
        • 0
          Если не секрет, расскажите, пожалуйста, подробнее про скрипт для поиска по локальным доменам через opensearch.
          • 0
            Не секрет. Я хотел его выложить в статье про настройку рабочего окружения (нормальные инструкции для ubuntu актуальных версий, а не поток сознания из предыдущего моего комментария) и настройку пакетных менеджеров (pip, npm, bower, composer, etc). Но как то не сложилось со статьёй: то времени нет, то кажется что слишком все очевидное и нет смысла писать об этом ещё раз.

            Вообще, всё просто:
            В /etc/dnsmasq.conf
            address=/template/127.0.0.1
            

            В nginx два сервера: один для скрипта (http://template/), другой для доменов (вида whatever.template/)
            Каталог (например ~/Workspace/templates) выделяется под доменную зону. Каждая папка доступна по адресу foldername.template. Папки нет — редирект на template.
            Поскольку папок много, а я ленивый и не хочу запоминать что как называется, появился скрипт. Он добавляется в список opensearch и позволяет искать через omnibox (в chrome/chromium) или через соответствующие поля в прочих браузерах. По мере ввода предоставляются подходящие домены. Либо выбирается домен из подсказки, либо нажимается enter. Домен есть — переходим на domain.template, нет — переходим на страницу со скриптом и там ищём.
            web часть скрипта на angular. Она представляет из себя простой input и список, фильтрующийся по мере ввода названия (как в dmenu из linux). Данные берутся из opensearch. Есть навигация клавишами: вверх, вниз, ввод.
            Данные формируется из списка папок в наблюдаемом каталоге.
            Достаточно добавить папку (например, через git clone <шаблон проекта> foldername) в каталог (~/Workspace/templates) и она сразу будет доступна по адресу foldername.template. А скрипт просто упрощает доступ к этому сайту. Репозитария у него нет, сам он страшненький. Зато работает безотказно.
            • 0
              Классная вещь — делайте репозиторий — не важно что страшненький, его допилят :)
              Я использую только конфиг nginx без основного сайта — но даже оно очень удобно — как-то поиск был без надобности — проектов не больше десятка
  • +1
    Спасибо.
    Несмотря на все плюшки поймал себя на мысли: «Еще одно место, где надо будет проверять почему сайт не грузится..»
    • +1
      В целом, конечно, так. Но я сижу в интернете через Yaxy больше года, за всё время была только одна ситуация, когда что-то не грузилось (она уже исправлена, разумеется).
      • +1
        Я, наверное, не так выразился.
        Не бывало такого, что 100% рабочий код не работает или работает не так? А в результате оказывается, в из хостов забыли заглушку убрать.
        Теперь такую ситуацию нужно проверять не только с hosts, но и с Yaxy =)
        • +4
          А, вы про это. Тут ничего не изменится. Проверяли файл hosts, а будете проверять конфиг Yaxy. Hosts при наличии Yaxy не нужен.
  • 0
    Реально удобная штука, пользуюсь ею уже довольно давно. Коль, а почему только сейчас статью написал?
    • +9
      Тут два обстоятельства:
      1. Обкатывал на себе.
      2. Заставлял себя написать статью.
  • 0
    orloffv$ yaxy
    env: node\r: No such file or directory

    orloffv$ yaxy --config /Users/orloffv/Dropbox/sync/yaxy/config.txt --port 9999
    env: node\r: No such file or directory

    как запустить это чудо-то?
    п.с. по описанию очень круто.
    • 0
      Кажется, что npm как-то криво поставил пакет. У вас node в стандартном месте лежит?

      Попробуйте поставить локально в какую-нибудь папку npm install yaxy (без -g) и запустить явно node yaxy (только в папку node_modules надо войти).
    • 0
      та же ошибка (mac)
      • +1
        Кажется понял в чём беда, лишние \r в запускаемом скрипте. Обновите пакет, должно заработать.
    • 0
      Обновите пакет, должно заработать.
      • 0
        проверяю
      • 0
        все хорошо.
        с https не работает?
        • 0
          С https пока не заморачивался. Но ходить на https умеет. Т.е. по задумке, если надо что-то подменить на сайте с https, можно создать правило

          site.ru/main.js => file:///home/me/main.js
          site.ru => https://site.ru
          

          А вот перехватить запрос к https с Yaxy не получится, по крайней мере пока.
          • 0
            понял, как раз хотел перехватить, весь продакшн с https)
  • 0
    Советую вам перевести документацию на английский или сделать 2 версии. В целом NodeJS сейчас в моде — ваш проект может развиться в нечто большее.
    • +1
      Тут если только кто-нибудь за пулреквестит. Я, к сожалению, могу только читать английский. Школьный немецкий меня гнетёт.
  • 0
    > _buildQureyString

    описка

    github.com/Kolyaj/Yaxy/blob/master/lib/yaxy.js#L294
    • 0
      Ой.
      Поправил, спасибо.
  • 0
    Интересный проект ). Недавно нуждался в чём-то подобном для отладки JS.
    А имеется ли возможность добавить правила вида:
    *.site.my => localhost:9898
    Т.е. перенаправлять все поддомены на какой-нибудь другой хост: порт?
    • 0
      /^http://[^.]+\.site\.my/ => localhost:9898

      В левой части правила может быть регулярка.
    • 0
      Будете клонировать — не забудьте про TOR! ;)
  • +2
    Возможно кому-нибудь пригодится.
    Стандартно chrome и chromium не позволяют задавать прокси в настройках браузера. (Предлагается выставить системные настройки прокси)
    Но есть опция командной строки через которую в chromium можно задавать прокси:

    chromium-browser --proxy-server=localhost:8008
    


    Также есть возможность запустить хромиум в чистом новом профайле

    chromium-browser --temp-profile
    
  • 0
    Весьма занимательную вещь вы разработали, и на первый взгляд выглядит очень, как это сказать, цельно. Решаемые проблемы вполне конкретны.
    Штука понравилась, попробую как-нибудь использовать. Сам я сталкивался с двумя следующими вопросами:
    1. Разрабатывается сайт с очень сильной клиентской стороной. Фактически, от веб-сервера требовалось только отдавать статические файлы. Для девелопмента использовался однострочный сервер на Python:
    $ python -m http.server 8000
    Однако, он нехорошо работал вкупе с опцией $.ajax, которая отменяет кеши. А именно, перестаёт находить файлы как только к GET-запросам передаются аргументы (?timestamp=X). Собсно, решил я это переходом на cherokee в деве. Возможно, для этого можно будет применить Yaxy.
    2. искал user-level замену файлу /etc/hosts, хотелось что-то типа ~/.hosts. Я так понимаю, Yaxy может быть использован именно для этого, если прописать его в автозагрузку и указать конфиг в user directory.
    • 0
      1.
      my-site.dev => file:///home/me/my-site

      Параметры после ? будут игнорироваться.

      2. Да, но в отличие от /etc/hosts в браузере нужно явно указывать прокси-сервер.
  • 0
    Как с поддержкой https и websockets?

    Странно, что никто не упомянул fiddler2.com/
    • 0
      Пока никак.
  • 0
    respect!
  • 0
    Использую для этих целей Pow.
  • 0
    Сегодня пытался заплатить за калужский Домолинк на сайте Ростелекома. Ввёл реквизиты карты, жму на кнопку — ноль реакции. Смотрю JS-консоль в хроме — ошибка: AJAX не смог загрузить какой-то GIF и из-а этого «упал». Думаю, Yaxi тут бы помог «подхакнуть» картинку «на лету»…

    P.S. Заплатил через онлайн-банк Альфабанка.
  • 0
    В следующих версия планируется скриптуемость или какая-то другая программируемая или просто более сложная логика?
    • 0
      Yaxy можно использовать как модуль. В пакете отдельно лежат модуль и консольная утилита, использующая этот модуль. Модуль не задокументирован, поэтому я не писал про него.

      Возможности модуля гораздо больше. Например, можно матчиться не только на урл, а на наличие какого-то http-заголовка.

      При желании иметь скриптуемую проксю, проще просто js-скрипт написать. Будет что-то вроде
      var server = require('yaxy')(8558);
      server.bind({
          refererStart: 'http://www.yandex.ru/',  // Перехватить запрос с реферером от Яндекса
          fn: function(state) {
              console.log(state.getRequestUrl());
              state.doRequest();
          }
      });
      


      Или можно взять node-webkit и сделать gui интерфейс.
  • +1
    Может кому-то пригодится: написал небольшой шеллскрипт, чтобы стартовать yaxy как службу.
    gist.github.com/MAD-GooZe/6865106
  • 0
    Получается, это что-то вроде HandyCache прокси-сервера, только LUA отсутствует.

Только зарегистрированные пользователи могут оставлять комментарии. Войдите, пожалуйста.