Page updated Jan 16, 2024

Label objects in an image

Setup the backend

If you haven't already done so, run amplify init inside your project and then amplify add auth (we recommend selecting the default configuration).

Run amplify add predictions and select Identify. Then use the following answers:

1? What would you like to identify?
2 Identify Text
3 Identify Entities
4❯ Identify Labels
5 Learn More
6
7? Would you like use the default configuration? (Use arrow keys)
8❯ Default Configuration
9 Advanced Configuration
10
11? Who should have access? Auth and Guest users

The Advanced Configuration will allow you to select moderation for unsafe content or all of the identified labels. Default uses both.

NOTE: Due to a known issue, you will need to update your amplify backend configuration with the properties below before pushing to the cloud:

amplify/backend/identify-labels-resource/parameters.json

1"access": "auth | authAndGuest",
2"type": "LABELS | UNSAFE | ALL"

Now run amplify push which will generate your amplifyconfiguration.json and create resources in the cloud. You can now either add this to your backend or skip and add more features to your app.

Services used: Amazon Rekognition

Working with the API

Detect labels, such if an image has a desk or a chair in it

1import { Predictions } from '@aws-amplify/predictions';
2
3Predictions.identify({
4 labels: {
5 source: {
6 file
7 },
8 type: 'LABELS'
9 }
10})
11 .then((response) => {
12 const { labels } = response;
13 labels.forEach((object) => {
14 const { name, boundingBoxes } = object;
15 });
16 })
17 .catch((err) => console.log({ err }));

Detect unsafe content in an image

1import { Predictions } from '@aws-amplify/predictions';
2
3Predictions.identify({
4 labels: {
5 source: {
6 file
7 },
8 type: 'UNSAFE'
9 }
10})
11 .then((response) => {
12 const { unsafe } = response; // boolean
13 })
14 .catch((err) => console.log({ err }));

for both labels and unsafe content

1import { Predictions } from '@aws-amplify/predictions';
2
3Predictions.identify({
4 labels: {
5 source: {
6 file
7 },
8 type: 'ALL'
9 }
10})
11 .then((response) => {
12 const { labels } = response;
13 const { unsafe } = response; // boolean
14 labels.forEach((object) => {
15 const { name, boundingBoxes } = object;
16 });
17 })
18 .catch((err) => console.log({ err }));