Page updated Jan 16, 2024

Fetch data

To invoke an endpoint, you need to set apiName, path and headers parameters, and each method returns a Promise. Under the hood the API category utilizes Axios to execute the HTTP requests. API status code response > 299 are thrown as an exception. If you need to handle errors managed by your API, work with the error.response object.

GET requests

const apiName = 'MyApiName'; const path = '/path'; const myInit = { headers: {}, // OPTIONAL response: true, // OPTIONAL (return the entire Axios response object instead of only response.data) queryStringParameters: { name: 'param' // OPTIONAL } }; API.get(apiName, path, myInit) .then((response) => { // Add your code here }) .catch((error) => { console.log(error.response); });
1const apiName = 'MyApiName';
2const path = '/path';
3const myInit = {
4 headers: {}, // OPTIONAL
5 response: true, // OPTIONAL (return the entire Axios response object instead of only response.data)
6 queryStringParameters: {
7 name: 'param' // OPTIONAL
8 }
9};
10
11API.get(apiName, path, myInit)
12 .then((response) => {
13 // Add your code here
14 })
15 .catch((error) => {
16 console.log(error.response);
17 });

Example with async/await

function getData() { const apiName = 'MyApiName'; const path = '/path'; const myInit = { headers: {} // OPTIONAL }; return API.get(apiName, path, myInit); } (async function () { const response = await getData(); })();
1function getData() {
2 const apiName = 'MyApiName';
3 const path = '/path';
4 const myInit = {
5 headers: {} // OPTIONAL
6 };
7
8 return API.get(apiName, path, myInit);
9}
10
11(async function () {
12 const response = await getData();
13})();

GET requests with query parameters

To use query parameters with get method, you can pass them in queryStringParameters parameter in your method call:

const items = await API.get('myCloudApi', '/items', { queryStringParameters: { order: 'byPrice' } });
1const items = await API.get('myCloudApi', '/items', {
2 queryStringParameters: {
3 order: 'byPrice'
4 }
5});
const apiName = 'MyApiName'; // replace this with your api name. const path = '/path'; //replace this with the path you have configured on your API const myInit = { headers: {} // OPTIONAL }; API.head(apiName, path, myInit).then((response) => { // Add your code here });
1const apiName = 'MyApiName'; // replace this with your api name.
2const path = '/path'; //replace this with the path you have configured on your API
3const myInit = {
4 headers: {} // OPTIONAL
5};
6
7API.head(apiName, path, myInit).then((response) => {
8 // Add your code here
9});

Example with async/await:

function head() { const apiName = 'MyApiName'; const path = '/path'; const myInit = { headers: {} // OPTIONAL }; return API.head(apiName, path, myInit); } (async function () { const response = await head(); })();
1function head() {
2 const apiName = 'MyApiName';
3 const path = '/path';
4 const myInit = {
5 headers: {} // OPTIONAL
6 };
7
8 return API.head(apiName, path, myInit);
9}
10
11(async function () {
12 const response = await head();
13})();

Accessing query parameters & body in Lambda proxy function

To learn more about Lambda Proxy Integration, please visit Amazon API Gateway Developer Guide.

If you are using a REST API which is generated with Amplify CLI, your backend is created with Lambda Proxy Integration, and you can access your query parameters & body within your Lambda function via the event object:

exports.handler = function (event, context, callback) { console.log(event.queryStringParameters); console.log('body: ', event.body); };
1exports.handler = function (event, context, callback) {
2 console.log(event.queryStringParameters);
3 console.log('body: ', event.body);
4};

Alternatively, you can update your backend file which is located at amplify/backend/function/[your-lambda-function]/app.js with the middleware:

const awsServerlessExpressMiddleware = require('aws-serverless-express/middleware'); app.use(awsServerlessExpressMiddleware.eventContext());
1const awsServerlessExpressMiddleware = require('aws-serverless-express/middleware');
2app.use(awsServerlessExpressMiddleware.eventContext());

Accessing Query Parameters with Serverless Express

In your request handler use req.apiGateway.event or req.query:

app.get('/items', function (req, res) { const query = req.query; // or // const query = req.apiGateway.event.queryStringParameters res.json({ event: req.apiGateway.event, // to view all event data query: query }); });
1app.get('/items', function (req, res) {
2 const query = req.query;
3 // or
4 // const query = req.apiGateway.event.queryStringParameters
5 res.json({
6 event: req.apiGateway.event, // to view all event data
7 query: query
8 });
9});

Then you can use query parameters in your path as follows:

API.get('sampleCloudApi', '/items?q=test');
1API.get('sampleCloudApi', '/items?q=test');

Custom response types

By default, calling an API with AWS Amplify parses a JSON response. If you have a REST API endpoint which returns, for example, a file in Blob format, you can specify a custom response type using the responseType parameter in your method call:

let file = await API.get('myCloudApi', '/items', { responseType: 'blob' });
1let file = await API.get('myCloudApi', '/items', {
2 responseType: 'blob'
3});

Allowed values for responseType are "arraybuffer", "blob", "document", "json" or "text"; and it defaults to "json" if not specified. See the documentation for more information.