Как вызвать лямбда-функцию netlify из моего приложения React?

Question

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

//in functions/test.js

import axios from 'axios'

exports.handler = function(event, context, callback) {
    axios.post('http://requestbin.fullcontact.com/1c50pcg1', {name: 'richard'}).then((response)=>{
      callback(null, {
        statusCode: 200,
        body: response.body
      })
    }).catch((err) => {
      console.log(err)
    })
}

Answer 1

В реакции я обычно импортирую действие в свой компонент, а затем вызываю это действие, которое вызывает сервер

Это именно то, что вы делаете в безсерверной архитектуре, где вашим «Сервером» является API Gateway . Затем API-шлюз будет передавать входящие запросы вашей функции Lambda.

Вы можете определить специфические методы HTTP для вызова ваших функций Lambda, или вы также можете настроить API-шлюз для прокси-подключения к ним ЛЮБОГО HTTP-метода. Маршрутизация должна быть обработана вами самостоятельно. К счастью, есть несколько пакетов, которые позволяют вам обернуть веб-фреймворк (например, Express) перед вашими лямбда-функциями, поэтому ваши маршруты могут обрабатываться этими типами фреймворков.

Другой вариант - вызывать ваши функции с помощью JavaScript SDK и вызывать вашу Lambda напрямую из браузера, используя его имя. Этот подход, однако, не так гибок, поскольку вы в значительной степени полагаетесь на имя функции / ARN для ее вызова, а это означает, что любые изменения в имени вашей функции или ARN (учитывая, что вы переходите в среду prod, например) непосредственно влияют на ваш клиентов. Изменения в вашем лямбда-коде также могут означать, что клиенты должны будут изменить его реализацию, что определенно не является хорошей практикой. Еще один недостаток заключается в том, что обрабатывать действия таким образом гораздо сложнее, так как одно нажатие кнопки диктует, какую функцию Lambda вызывать. Ваш интерфейс может стать очень грязным очень быстро. Конечно, в некоторых случаях вы бы предпочли этот подход, а не API-шлюз, но об этом нужно подумать.

С другой стороны, используя API Gateway, вы просто делаете обычные вызовы REST, которые затем запускают ваши функции Lambda. Любое изменение в функциях Lambda не повлияет на контракт между клиентами и вашими API-интерфейсами REST, поэтому оно станет более гибким. Кроме того, полагаться на методы HTTP гораздо проще, чем полагаться на имена функций / ARNs

Поскольку вы уже привыкли к подходу React -> Server, я рекомендую вам выбрать путь к API Gateway.

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

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