Arhn - архитектура программирования

Конфигурация облачной функции HTTP-прокси Angular CLI

Возможно ли это с помощью Angular CLI и https://github.com/chimurai/http-proxy-middleware для перехвата/прокси-вызовов к внешнему URL-адресу, например функции без облачного сервера, такой как Функции Azure. или функции Firebase?

Например, при нацеливании на URL-адрес внешней облачной функции, такой как https://foobar.azurewebsites.net/api/SampleHttpFunction?code=123ABC456XYZ==, как бы вы настроили proxy.conf.json для перехвата этого URL-адреса/пути?

Следующие конфигурации успешно перехватили HTTP-запрос (target настроен на локальный порт локального хоста облачной функции для целей разработки). Приложение Angular запускается с помощью команды "ng serve --proxy-config proxy.conf.json --open".

{
  "/api": {
    "target": "http://localhost:1234",
    "secure": false
  }
}

{
  "foobar.azurewebsites.net/api": {
    "target": "http://localhost:1234",
    "secure": false
  }
}

{
  "**/api": {
    "target": "http://localhost:1234",
    "secure": false
  }
}

Вызовы HttpClient https://foobar.azurewebsites.net/api/SampleHttpFunction?code=123ABC456XYZ== с любой из этих конфигураций по-прежнему направляются на URL-адрес производственной облачной функции, а не http://localhost:1234/api.

Обновление: согласно предложению, которое я пытался использовать множественная конфигурация входа и запуск приложения с ng serve --proxy-config proxy.conf.js --open, но он все еще не перехватывает HTTP-вызов:

const PROXY_CONFIG = [{
  context: [
    "/api",
    "**/api",
    "**/api/*",
    "https://foobar.azurewebsites.net/api/",
    "foobar.azurewebsites.net/api/",
    "foobar.azurewebsites.net/api/*",
    "*foobar.azurewebsites.net/api"
  ],
  target: "http://localhost:1234",
  secure: false
}]

module.exports = PROXY_CONFIG;

Спасибо за любую помощь, которую вы можете предоставить!

angular angular-cli webpack-dev-server http-proxy-middleware
02.09.2017

Ответы:


1

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

const PROXY_CONFIG = [{
  context: [
    "/api",
    "foobar.azurewebsites.net/api",
    "**/api"
  ],
  target: "http://localhost:1234",
  secure: false
}];

module.exports = PROXY_CONFIG;
create a file called proxy.conf.js and replace the proxy.conf.json from package.json with the js file and try.

02.09.2017
  • Я попытался использовать конфигурацию множественной записи proxy.conf.js, как вы предложили, с рядом шаблонов и начиная с ng serve --proxy-config proxy.conf.js --open, но, к сожалению, это не сработало. HTTP-вызовы по-прежнему направляются на URL-адрес рабочей функции Azure. Похоже, в конфигурации потребуются дополнительные параметры для просмотра полного URL-адреса HTTP-вызова. Речь также пойдет о захвате домена/происхождения. 03.09.2017
    • Новые материалы
    Коллекции публикаций по глубокому обучению
    Последние пару месяцев я создавал коллекции последних академических публикаций по различным подполям глубокого обучения в моем блоге https://amundtveit.com - эта публикация дает обзор 25..
    Представляем: Pepita
    Фреймворк JavaScript с открытым исходным кодом Я знаю, что недостатка в фреймворках JavaScript нет. Но я просто не мог остановиться. Я хотел написать что-то сам, со своими собственными..
    Советы по коду Laravel #2
    1-) Найти // You can specify the columns you need // in when you use the find method on a model User::find(‘id’, [‘email’,’name’]); // You can increment or decrement // a field in..
    Работа с временными рядами спутниковых изображений, часть 3 (аналитика данных)
    Анализ временных рядов спутниковых изображений для данных наблюдений за большой Землей (arXiv) Автор: Рольф Симоэс , Жильберто Камара , Жильберто Кейрос , Фелипе Соуза , Педро Р. Андраде ,..
    3 способа решить квадратное уравнение (3-й мой любимый) -
    1. Методом факторизации — 2. Используя квадратичную формулу — 3. Заполнив квадрат — Давайте поймем это, решив это простое уравнение: Мы пытаемся сделать LHS,..
    Создание VR-миров с A-Frame
    Виртуальная реальность (и дополненная реальность) стали главными модными терминами в образовательных технологиях. С недорогими VR-гарнитурами, такими как Google Cardboard , и использованием..
    Демистификация рекурсии
    КОДЕКС Демистификация рекурсии Упрощенная концепция ошеломляющей О чем весь этот шум? Рекурсия, кажется, единственная тема, от которой у каждого начинающего студента-информатика..