La [AWS SDK per JavaScript V3 API Reference Guide](https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/) descrive in dettaglio tutte le operazioni API per la AWS SDK per JavaScript versione 3 (V3). Le traduzioni sono generate tramite traduzione automatica. In caso di conflitto tra il contenuto di una traduzione e la versione originale in Inglese, quest'ultima prevarrà. # Inizia a usare l' AWS SDK per JavaScript L' AWS SDK for JavaScript fornisce l'accesso ai servizi Web in un browser o in un ambiente Node.js. Questa sezione contiene esercizi introduttivi che mostrano come utilizzare l' AWS SDK for JavaScript in ciascuno di questi JavaScript ambienti. **Topics** + [Autenticazione SDK con AWS](getting-your-credentials.md) + [Inizia con Node.js](getting-started-nodejs.md) + [Inizia nel browser](getting-started-browser.md) + [Guida introduttiva a React Native](getting-started-react-native.md) # Autenticazione SDK con AWS È necessario stabilire in che modo il codice si autentica AWS durante lo sviluppo con. Servizi AWSÈ possibile configurare l'accesso programmatico alle AWS risorse in diversi modi a seconda dell'ambiente e dell' AWS accesso a disposizione. Per scegliere il metodo di autenticazione e configurarlo per l'SDK, consulta [Autenticazione e accesso](https://docs.aws.amazon.com/sdkref/latest/guide/access.html) nella Guida di *riferimento agli strumenti AWS SDKs e agli strumenti*. Consigliamo ai nuovi utenti che si stanno sviluppando localmente e che non dispongono di un metodo di autenticazione dal datore di lavoro di AWS IAM Identity Center configurarlo. Questo metodo include l'installazione di AWS CLI per facilitare la configurazione e per accedere regolarmente al portale di AWS accesso. Se scegli questo metodo, l'ambiente dovrebbe contenere i seguenti elementi dopo aver completato la procedura per l'[autenticazione di IAM Identity Center](https://docs.aws.amazon.com/sdkref/latest/guide/access-sso.html) nella *AWS SDKs and Tools Reference Guide*: + Il AWS CLI, che viene utilizzato per avviare una sessione del portale di AWS accesso prima di eseguire l'applicazione. + Un [AWS`config`file condiviso](https://docs.aws.amazon.com/sdkref/latest/guide/file-format.html) con un `[default]` profilo con un set di valori di configurazione a cui è possibile fare riferimento dall'SDK. Per trovare la posizione di questo file, consulta [Posizione dei file condivisi nella Guida](https://docs.aws.amazon.com/sdkref/latest/guide/file-location.html) di *riferimento agli strumenti AWS SDKs e strumenti*. + Il `config` file condiviso imposta l'[https://docs.aws.amazon.com/sdkref/latest/guide/feature-region.html](https://docs.aws.amazon.com/sdkref/latest/guide/feature-region.html)impostazione. Questo imposta l'impostazione predefinita Regione AWS utilizzata dall'SDK per AWS le richieste. Questa regione viene utilizzata per le richieste di servizio SDK che non sono specificate con una regione da utilizzare. + L'SDK utilizza la [configurazione del provider di token SSO](https://docs.aws.amazon.com/sdkref/latest/guide/feature-sso-credentials.html#feature-sso-credentials-profile) del profilo per acquisire le credenziali prima di inviare richieste a. AWS Il `sso_role_name` valore, che è un ruolo IAM connesso a un set di autorizzazioni IAM Identity Center, consente l'accesso ai dati Servizi AWS utilizzati nell'applicazione. Il seguente `config` file di esempio mostra un profilo predefinito impostato con la configurazione del provider di token SSO. L'`sso_session`impostazione del profilo si riferisce alla [`sso-session`sezione](https://docs.aws.amazon.com/sdkref/latest/guide/file-format.html#section-session) denominata. La `sso-session` sezione contiene le impostazioni per avviare una sessione del portale di AWS accesso. ``` [default] sso_session = my-sso sso_account_id = 111122223333 sso_role_name = SampleRole region = us-east-1 output = json [sso-session my-sso] sso_region = us-east-1 sso_start_url = https://provided-domain.awsapps.com/start sso_registration_scopes = sso:account:access ``` L' AWS SDK per JavaScript v3 non richiede l'aggiunta di pacchetti aggiuntivi (come `SSO` e`SSOOIDC`) all'applicazione per utilizzare l'autenticazione IAM Identity Center. Per i dettagli sull'utilizzo esplicito di questo provider di credenziali, consulta il [https://www.npmjs.com/package/@aws-sdk/credential-providers#fromsso](https://www.npmjs.com/package/@aws-sdk/credential-providers#fromsso)sito Web di npm (Node.js package manager). ## Avviare una sessione del portale di accesso AWS Prima di eseguire un'applicazione che consente l'accesso Servizi AWS, è necessaria una sessione attiva del portale di AWS accesso affinché l'SDK utilizzi l'autenticazione IAM Identity Center per risolvere le credenziali. A seconda della durata della sessione configurata, l'accesso alla fine scadrà e l'SDK riscontrerà un errore di autenticazione. Per accedere al portale di AWS accesso, esegui il seguente comando in. AWS CLI ``` aws sso login ``` Se hai seguito le istruzioni e disponi di una configurazione predefinita del profilo, non è necessario richiamare il comando con un'`--profile`opzione. Se la configurazione del provider di token SSO utilizza un profilo denominato, il comando è `aws sso login --profile named-profile`. Per verificare facoltativamente se hai già una sessione attiva, esegui il AWS CLI comando seguente. ``` aws sts get-caller-identity ``` Se la sessione è attiva, la risposta a questo comando riporta l'account IAM Identity Center e il set di autorizzazioni configurati nel `config` file condiviso. **Nota** Se hai già una sessione attiva del portale di AWS accesso ed esegui`aws sso login`, non ti verrà richiesto di fornire credenziali. La procedura di accesso potrebbe richiedere all'utente di consentire l' AWS CLI accesso ai dati. Poiché AWS CLI è basato sull'SDK per Python, i messaggi di autorizzazione potrebbero contenere variazioni del `botocore` nome. ## Utilizzo delle credenziali di accesso alla console È possibile utilizzare le credenziali di accesso esistenti AWS della Console di gestione per l'accesso programmatico ai servizi. AWS Dopo un flusso di autenticazione basato su browser, AWS genera credenziali temporanee che funzionano con strumenti di sviluppo locali come AWS CLI e SDK for. AWS JavaScript Questa funzionalità semplifica il processo di configurazione e gestione delle credenziali CLI AWS . Per informazioni su come iniziare, segui le istruzioni [per accedere allo sviluppo AWS locale utilizzando le credenziali](https://docs.aws.amazon.com/cli/latest/userguide/cli-configure-sign-in.html) della console. Quando esegui il **aws login** comando, puoi selezionare una delle sessioni attive della console o accedere tramite il flusso di autenticazione basato sul browser: questo genererà automaticamente credenziali temporanee. L' AWS SDK aggiorna JavaScript automaticamente le credenziali 5 minuti prima della scadenza, con ogni set di credenziali valido per un massimo di 12 ore. Per ulteriori informazioni, consulta [https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/Package/-aws-sdk-credential-providers/#fromlogincredentials](https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/Package/-aws-sdk-credential-providers/#fromlogincredentials). ## Ulteriori informazioni di autenticazione Utenti umani, noti anche come *identità umane,* sono le persone, gli amministratori, gli sviluppatori, gli operatori e i consumatori delle tue applicazioni. Devono avere un'identità per accedere agli AWS ambienti e alle applicazioni dell'utente. Gli utenti umani che fanno parte della tua organizzazione, ovvero tu, lo sviluppatore, sono noti come *identità della forza lavoro*. Utilizza credenziali temporanee per l'accesso. AWS Puoi utilizzare un provider di identità per i tuoi utenti umani per fornire l'accesso federato agli AWS account assumendo ruoli che forniscono credenziali temporanee. Per la gestione centralizzata degli accessi, ti consigliamo di utilizzare AWS IAM Identity Center (IAM Identity Center) per gestire l'accesso ai tuoi account e le autorizzazioni all'interno di tali account. Per altre alternative, consulta quanto segue: + Per ulteriori informazioni sulle best practice, consulta [Best practice per la sicurezza in IAM](https://docs.aws.amazon.com/IAM/latest/UserGuide/best-practices.html) nella *Guida per l'utente di IAM*. + Per creare AWS credenziali a breve termine, consulta [Temporary Security Credentials](https://docs.aws.amazon.com/IAM/latest/UserGuide/id_credentials_temp.html) nella *IAM User Guide*. + *Per ulteriori informazioni su altri provider di credenziali AWS SDK per JavaScript V3, consulta Fornitori di [credenziali standardizzati](https://docs.aws.amazon.com/sdkref/latest/guide/standardized-credentials.html) nella and Tools Reference Guide.AWS SDKs * # Inizia con Node.js Questa guida mostra come inizializzare un pacchetto NPM, aggiungere un client di servizio al pacchetto e utilizzare l' JavaScript SDK per avviare un'azione di servizio. ## Lo scenario **Crea un nuovo pacchetto NPM con un file principale che esegua le seguenti operazioni:** + Crea un bucket Amazon Simple Storage Service + Inserisce un oggetto nel bucket Amazon S3 + Legge l'oggetto nel bucket Amazon S3 + Conferma se l'utente desidera eliminare le risorse ## Prerequisiti Prima di eseguire l'esempio, è necessario effettuare le seguenti operazioni: + Configura l'autenticazione SDK. Per ulteriori informazioni, consulta [Autenticazione SDK con AWS](getting-your-credentials.md). + Installa [Node.js](https://nodejs.org/en/download). AWS consiglia di utilizzare la versione Active LTS di Node.js per lo sviluppo. ## Fase 1: Configurare la struttura dei pacchetti e installare i pacchetti client Per configurare la struttura dei pacchetti e installare i pacchetti client: 1. Crea una nuova cartella `nodegetstarted` per contenere il pacchetto. 1. Dalla riga di comando, accedi alla nuova cartella. 1. Esegui il comando seguente per creare un `package.json` file predefinito: ``` npm init -y ``` 1. Esegui il seguente comando per installare il pacchetto client Amazon S3: ``` npm i @aws-sdk/client-s3 ``` 1. Aggiungi `"type": "module"` al `package.json` file. Ciò indica a Node.js di utilizzare la moderna sintassi ESM. La versione finale `package.json` dovrebbe essere simile alla seguente: ``` { "name": "example-javascriptv3-get-started-node", "version": "1.0.0", "description": "This guide shows you how to initialize an NPM package, add a service client to your package, and use the JavaScript SDK to call a service action.", "main": "index.js", "scripts": { "test": "vitest run **/*.unit.test.js" }, "author": "Your Name", "license": "Apache-2.0", "dependencies": { "@aws-sdk/client-s3": "^3.420.0" }, "type": "module" } ``` ## Passaggio 2: aggiungi le importazioni e il codice SDK necessari Aggiungi il codice seguente a un file denominato `index.js` nella `nodegetstarted` cartella. ``` // This is used for getting user input. import { createInterface } from "node:readline/promises"; import { S3Client, PutObjectCommand, CreateBucketCommand, DeleteObjectCommand, DeleteBucketCommand, paginateListObjectsV2, GetObjectCommand, } from "@aws-sdk/client-s3"; export async function main() { // A region and credentials can be declared explicitly. For example // `new S3Client({ region: 'us-east-1', credentials: {...} })` would //initialize the client with those settings. However, the SDK will // use your local configuration and credentials if those properties // are not defined here. const s3Client = new S3Client({}); // Create an Amazon S3 bucket. The epoch timestamp is appended // to the name to make it unique. const bucketName = `test-bucket-${Date.now()}`; await s3Client.send( new CreateBucketCommand({ Bucket: bucketName, }), ); // Put an object into an Amazon S3 bucket. await s3Client.send( new PutObjectCommand({ Bucket: bucketName, Key: "my-first-object.txt", Body: "Hello JavaScript SDK!", }), ); // Read the object. const { Body } = await s3Client.send( new GetObjectCommand({ Bucket: bucketName, Key: "my-first-object.txt", }), ); console.log(await Body.transformToString()); // Confirm resource deletion. const prompt = createInterface({ input: process.stdin, output: process.stdout, }); const result = await prompt.question("Empty and delete bucket? (y/n) "); prompt.close(); if (result === "y") { // Create an async iterator over lists of objects in a bucket. const paginator = paginateListObjectsV2( { client: s3Client }, { Bucket: bucketName }, ); for await (const page of paginator) { const objects = page.Contents; if (objects) { // For every object in each page, delete it. for (const object of objects) { await s3Client.send( new DeleteObjectCommand({ Bucket: bucketName, Key: object.Key }), ); } } } // Once all the objects are gone, the bucket can be deleted. await s3Client.send(new DeleteBucketCommand({ Bucket: bucketName })); } } // Call a function if this file was run directly. This allows the file // to be runnable without running on import. import { fileURLToPath } from "node:url"; if (process.argv[1] === fileURLToPath(import.meta.url)) { main(); } ``` Il codice di esempio può essere trovato [qui GitHub](https://github.com/awsdocs/aws-doc-sdk-examples/blob/main/javascriptv3/example_code/nodegetstarted/index.js). ## Fase 3: Esegui l'esempio **Nota** Ricordati di effettuare l'accesso\$1 Se utilizzi IAM Identity Center per l'autenticazione, ricordati di accedere utilizzando il AWS CLI `aws sso login` comando. 1. Esegui `node index.js`. 1. Scegli se svuotare ed eliminare il bucket. 1. Se non elimini il bucket, assicurati di svuotarlo manualmente ed eliminarlo in un secondo momento. # Inizia nel browser Questa sezione illustra un esempio che dimostra come eseguire la versione 3 (V3) dell' AWS SDK for nel browser. JavaScript **Nota** L'esecuzione di V3 nel browser è leggermente diversa dalla versione 2 (V2). Per ulteriori informazioni, consulta [Utilizzo dei browser in V3](welcome.md#v3_browsers). Per altri esempi di utilizzo (V3) dell' AWS SDK per, consulta. JavaScript [SDK per esempi di JavaScript codice (v3)](javascript_code_examples.md) **Questo esempio di applicazione web mostra:** + Come accedere ai AWS servizi utilizzando Amazon Cognito per l'autenticazione. + Come leggere un elenco di oggetti in un bucket Amazon Simple Storage Service (Amazon S3) utilizzando AWS Identity and Access Management un ruolo (IAM). **Nota** Questo esempio non viene utilizzato AWS IAM Identity Center per l'autenticazione. ## Lo scenario Amazon S3 è un servizio di archiviazione di oggetti che offre scalabilità, disponibilità dei dati, sicurezza e prestazioni tra le migliori del settore. Puoi usare Amazon S3 per archiviare dati come oggetti all'interno di contenitori chiamati bucket. Per ulteriori informazioni su Amazon S3, consulta la Amazon [S3 User Guide](https://docs.aws.amazon.com/AmazonS3/latest/userguide/). Questo esempio mostra come configurare ed eseguire un'app Web che presuppone un ruolo IAM per la lettura da un bucket Amazon S3. L'esempio utilizza la libreria front-end React e gli strumenti front-end Vite per fornire un ambiente di sviluppo. JavaScript L'app Web utilizza un pool di identità Amazon Cognito per fornire le credenziali necessarie per accedere ai servizi. AWS L'esempio di codice incluso illustra i modelli di base per il caricamento e l'utilizzo dell' AWS SDK per JavaScript le app Web. ## Fase 1: creare un pool di identità Amazon Cognito e un ruolo IAM In questo esercizio, crei e utilizzi un pool di identità Amazon Cognito per fornire un accesso non autenticato alla tua app Web per il servizio Amazon S3. La creazione di un pool di identità crea anche un ruolo AWS Identity and Access Management (IAM) per supportare gli utenti guest non autenticati. In questo esempio, lavoreremo solo con il ruolo utente non autenticato per mantenere l'attività concentrata. È possibile integrare il supporto per un provider di identità e per gli utenti autenticati in un secondo momento. Per ulteriori informazioni sull'aggiunta di un pool di identità di Amazon Cognito, consulta il [Tutorial: Creazione di un pool di identità](https://docs.aws.amazon.com/cognito/latest/developerguide/tutorial-create-identity-pool.html) nella *Amazon Cognito Developer Guide*. **Per creare un pool di identità Amazon Cognito e un ruolo IAM associato** 1. Accedi Console di gestione AWS e apri la console Amazon Cognito all'indirizzo. [https://console.aws.amazon.com/cognito/](https://console.aws.amazon.com/cognito/) 1. Nel riquadro di navigazione a sinistra, scegli **Identity pool**. 1. Scegli **Crea pool di identità**. 1. In **Configure identity pool trust**, scegli **Accesso ospite** per l'autenticazione degli utenti. 1. In **Configura le autorizzazioni**, scegli **Crea un nuovo ruolo IAM** e inserisci un nome (ad esempio, *getStartedRole*) nel **nome del ruolo IAM**. 1. In **Configure properties**, inserisci un nome (ad esempio, *getStartedPool*) in **Identity pool name**. 1. In **Esamina e crea**, conferma le selezioni effettuate per il nuovo pool di identità. Seleziona **Modifica** per tornare alla procedura guidata e modificare le eventuali impostazioni. Al termine, seleziona **Crea un pool di identità**. 1. Prendi nota dell'**ID del pool di identità** e della **regione** del pool di identità di Amazon Cognito appena creato. Questi valori sono necessari per sostituirli *IDENTITY\$1POOL\$1ID* e *REGION* inserirli. [Passaggio 4: configura il codice del browser](#getting-started-browser-create-html) Dopo aver creato il tuo pool di identità Amazon Cognito, sei pronto per aggiungere le autorizzazioni per Amazon S3 necessarie alla tua app web. ## Passaggio 2: aggiungi una policy al ruolo IAM creato Per abilitare l'accesso a un bucket Amazon S3 nella tua app Web, utilizza il ruolo IAM non autenticato (ad esempio, *getStartedRole*) creato per il tuo pool di identità Amazon Cognito (ad esempio,). *getStartedPool* Ciò richiede l'associazione di una policy IAM al ruolo. Per ulteriori informazioni sulla modifica dei ruoli IAM, consulta [Modifica della politica di autorizzazione di un ruolo](https://docs.aws.amazon.com/IAM/latest/UserGuide/roles-managingrole-editing-console.html#roles-modify_permissions-policy) nella Guida per l'utente *IAM*. **Per aggiungere una policy Amazon S3 al ruolo IAM associato a utenti non autenticati** 1. Accedi Console di gestione AWS e apri la console IAM all'indirizzo. [https://console.aws.amazon.com/iam/](https://console.aws.amazon.com/iam/) 1. Nel pannello di navigazione a sinistra, seleziona **Ruoli**. 1. Scegli il nome del ruolo che desideri modificare (ad esempio, *getStartedRole*), quindi scegli la scheda **Autorizzazioni**. 1. Seleziona **Aggiungi autorizzazioni**, quindi seleziona **Collega policy**. 1. **Nella pagina **Aggiungi autorizzazioni** per questo ruolo, trova e seleziona la casella di controllo per AmazonS3. ReadOnlyAccess** **Nota** Puoi utilizzare questo processo per abilitare l'accesso a qualsiasi servizio. AWS 1. Scegli **Add Permissions (Aggiungi autorizzazioni)**. Dopo aver creato il tuo pool di identità Amazon Cognito e aggiunto le autorizzazioni per Amazon S3 al tuo ruolo IAM per utenti non autenticati, sei pronto per aggiungere e configurare un bucket Amazon S3. ## Fase 3: aggiungere un bucket e un oggetto Amazon S3 In questo passaggio, aggiungerai un bucket Amazon S3 e un oggetto per l'esempio. Attiverai anche la condivisione delle risorse tra le origini (CORS) per il bucket. *Per ulteriori informazioni sulla creazione di bucket e oggetti Amazon S3, consulta la sezione [Guida introduttiva ad Amazon S3 nella Amazon S3](https://docs.aws.amazon.com/AmazonS3/latest/userguide/GetStartedWithS3.html) User Guide.* **Per aggiungere un bucket e un oggetto Amazon S3 con CORS** 1. Accedi a Console di gestione AWS e apri la console Amazon S3 all'indirizzo. [https://console.aws.amazon.com/s3/](https://console.aws.amazon.com/s3/) 1. Nel riquadro di navigazione a sinistra, scegli **Bucket e scegli **Crea** bucket**. 1. **Inserisci un nome di bucket conforme alle [regole di denominazione dei bucket](https://docs.aws.amazon.com/AmazonS3/latest/userguide/bucketnamingrules.html) (ad esempio, *getstartedbucket*) e scegli Crea bucket.** 1. **Scegli il bucket che hai creato, quindi scegli la scheda Oggetti.** Scegliere quindi **Upload (Carica)**. 1. In **File e cartelle**, seleziona **Aggiungi file**. 1. Seleziona un file da caricare, quindi scegli **Apri**. Quindi scegli **Carica** per completare il caricamento dell'oggetto nel tuo bucket. 1. Quindi, scegli la scheda **Autorizzazioni** del tuo bucket, quindi scegli **Modifica** nella sezione **Cross-origin resource sharing** (CORS). Inserisci il seguente codice JSON: ``` [ { "AllowedHeaders": [ "*" ], "AllowedMethods": [ "GET" ], "AllowedOrigins": [ "*" ], "ExposeHeaders": [] } ] ``` 1. Scegli **Save changes** (Salva modifiche). Dopo aver aggiunto un bucket Amazon S3 e aggiunto un oggetto, sei pronto per configurare il codice del browser. ## Passaggio 4: configura il codice del browser L'applicazione di esempio è costituita da un'applicazione React a pagina singola. I file di questo esempio possono essere trovati [qui su GitHub](https://github.com/awsdocs/aws-doc-sdk-examples/tree/main/javascriptv3/example_code/web/s3/list-objects). **Per configurare l'applicazione di esempio** 1. Installa [Node.js](https://nodejs.org/en/download). 1. Dalla riga di comando, clona il [AWS Code Examples Repository](https://github.com/awsdocs/aws-doc-sdk-examples/): ``` git clone --depth 1 https://github.com/awsdocs/aws-doc-sdk-examples.git ``` 1. Passa all'applicazione di esempio: ``` cd aws-doc-sdk-examples/javascriptv3/example_code/web/s3/list-objects/ ``` 1. Eseguite il comando seguente per installare i pacchetti richiesti: ``` npm install ``` 1. Quindi, apri `src/App.tsx` in un editor di testo e completa quanto segue: + *YOUR\$1IDENTITY\$1POOL\$1ID*Sostituiscilo con l'ID del pool di identità di Amazon Cognito in cui hai registrato. [Fase 1: creare un pool di identità Amazon Cognito e un ruolo IAM](#getting-started-browser-create-identity-pool) + Sostituisci il valore per regione con la regione assegnata al tuo bucket Amazon S3 e al pool di identità Amazon Cognito. Tieni presente che le regioni per entrambi i servizi devono essere le stesse (ad esempio, *us-east-2*). + *bucket-name*Sostituiscilo con il nome del bucket in cui hai creato. [Fase 3: aggiungere un bucket e un oggetto Amazon S3](#getting-started-browser-create-s3-bucket) Dopo aver sostituito il testo, salva il `App.tsx` file. Ora sei pronto per eseguire l'app web. ## Passaggio 5: Esegui l'esempio **Per eseguire l'applicazione di esempio** 1. Dalla riga di comando, accedete all'applicazione di esempio: ``` cd aws-doc-sdk-examples/javascriptv3/example_code/web/s3/list-objects/ ``` 1. Dalla riga di comando, esegui il seguente comando: ``` npm run dev ``` L'ambiente di sviluppo Vite verrà eseguito con il seguente messaggio: ``` VITE v4.3.9 ready in 280 ms ➜ Local: http://localhost:5173/ ➜ Network: use --host to expose ➜ press h to show help ``` 1. Nel tuo browser web, accedi all'URL mostrato sopra (ad esempio, http://localhost:5173). L'app di esempio ti mostrerà un elenco di nomi di file di oggetti nel tuo bucket Amazon S3. ## Pulizia Per ripulire le risorse create durante questo tutorial, procedi come segue: + [Nella console Amazon S3](https://console.aws.amazon.com/s3/)*, elimina tutti gli oggetti e i bucket creati (ad esempio getstartedbucket).* + Nella [console IAM, elimina il](https://console.aws.amazon.com/iam/home#/roles) nome del ruolo (ad esempio,). *getStartedRole* + [Nella console Amazon Cognito](https://console.aws.amazon.com/cognito/home#/identity), elimina il nome del pool di identità (ad esempio, *getStartedPool*). # Guida introduttiva a React Native Questo tutorial mostra come creare un'app React Native utilizzando la [CLI React Native](https://reactnative.dev/docs/environment-setup). ![\[JavaScript code example that applies to React Native.\]](http://docs.aws.amazon.com/it_it/sdk-for-javascript/v3/developer-guide/images/browsericon.png) **Questo tutorial ti mostra:** + Come installare e includere l' AWS SDK per i moduli della JavaScript versione 3 (V3) utilizzati dal progetto. + Come scrivere codice che si connetta ad Amazon Simple Storage Service (Amazon S3) per creare ed eliminare un bucket Amazon S3. ## Lo scenario Amazon S3 è un servizio cloud che consente di archiviare e recuperare qualsiasi quantità di dati in qualsiasi momento, da qualsiasi punto del Web. React Native è un framework di sviluppo che consente di creare applicazioni mobili. Questo tutorial mostra come creare un'app React Native che si connette ad Amazon S3 per creare ed eliminare un bucket Amazon S3. L'app utilizza il seguente AWS SDK per: JavaScript APIs + Costruttore [https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/client/cognito-identity/](https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/client/cognito-identity/) + Costruttore [https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/client/s3/](https://docs.aws.amazon.com/AWSJavaScriptSDK/v3/latest/client/s3/) ## Attività prerequisite **Nota** Se hai già completato uno dei passaggi seguenti con altri tutorial o configurazioni, ignora questi passaggi. Questa sezione fornisce la configurazione minima necessaria per completare questo tutorial. Non la considerare come una configurazione completa. Per la configurazione completa, vedi [Configura l'SDK per JavaScript](setting-up.md). + Installa i seguenti strumenti: + [npm](https://docs.npmjs.com/getting-started/) + [Node.js](https://nodejs.org/en/download/) + [Xcode](https://developer.apple.com/xcode/) se stai testando su iOS + [Android Studio](https://developer.android.com/studio/) se esegui il test su Android + Configura il tuo [ambiente di sviluppo React Native](https://reactnative.dev/docs/environment-setup) + Configura l'ambiente di progetto per eseguire questi TypeScript esempi di Node e installa l' AWS SDK richiesto per i JavaScript moduli di terze parti. Segui le istruzioni su. [ GitHub](https://github.com/awsdocs/aws-doc-sdk-examples/blob/main/javascriptv3/example_code/nodegetstarted/README.md) + È necessario stabilire in che modo il codice si autentica AWS durante lo sviluppo con AWS i servizi. Per ulteriori informazioni, consulta [Autenticazione SDK con AWS](getting-your-credentials.md). **Nota** Il ruolo IAM per questo esempio deve essere impostato per utilizzare le autorizzazioni **FullAccessAmazonS3**. ## Fase 1: creare un pool di identità di Amazon Cognito In questo esercizio, crei e utilizzi un pool di identità Amazon Cognito per fornire un accesso non autenticato alla tua app per il servizio Amazon S3. La creazione di un pool di identità crea anche due ruoli AWS Identity and Access Management (IAM), uno per supportare gli utenti autenticati da un provider di identità e l'altro per supportare gli utenti guest non autenticati. In questo esercizio, lavoreremo solo con il ruolo degli utenti non autenticati in modo che l'attività risulti mirata. È possibile integrare il supporto per un provider di identità e per gli utenti autenticati in un secondo momento. **Per creare un pool di identità Amazon Cognito** 1. Accedi Console di gestione AWS e apri la console Amazon Cognito su [Amazon Web Services](https://console.aws.amazon.com/cognito/) Console. 1. Scegli **Identity Pools** nella pagina di apertura della console. 1. Nella pagina successiva, scegliere **Create new identity pool (Crea nuovo pool di identità)**. **Nota** Se non sono presenti altri pool di identità, la console Amazon Cognito salterà questa pagina e aprirà invece la pagina successiva. 1. In **Configure identity pool trust**, scegli **Accesso ospite per l'autenticazione degli** utenti. 1. In **Configura le autorizzazioni**, scegli **Crea un nuovo ruolo IAM** e inserisci un nome (ad esempio, *getStartedReactRuolo*) nel **nome del ruolo IAM**. 1. In **Configure properties**, inserisci un nome (ad esempio, *getStartedReactPool*) nel campo **Identity pool name**. 1. In **Esamina e crea**, conferma le selezioni effettuate per il nuovo pool di identità. Seleziona **Modifica** per tornare alla procedura guidata e modificare le eventuali impostazioni. Al termine, seleziona **Crea un pool di identità**. 1. Annota l'ID del pool di identità e la regione per questo pool di identità appena creato. Questi valori devono essere sostituiti *region* e inseriti *identityPoolId* nello script del browser. Dopo aver creato il tuo pool di identità Amazon Cognito, sei pronto per aggiungere le autorizzazioni per Amazon S3 necessarie alla tua app React Native. ## Fase 2: aggiungere una policy al ruolo IAM creato Per consentire l'accesso tramite script del browser ad Amazon S3 per creare ed eliminare un bucket Amazon S3, utilizza il ruolo IAM non autenticato creato per il tuo pool di identità Amazon Cognito. Ciò richiede l'aggiunta di una policy IAM al ruolo. Per ulteriori informazioni sui ruoli IAM, consulta [Creating a Role to Delegate Permissions to an AWS Service](https://docs.aws.amazon.com/IAM/latest/UserGuide/id_roles_create_for-service.html) nella *IAM User Guide*. **Per aggiungere una policy Amazon S3 al ruolo IAM associato a utenti non autenticati** 1. Accedi Console di gestione AWS e apri la console IAM all'indirizzo. [https://console.aws.amazon.com/iam/](https://console.aws.amazon.com/iam/) 1. Nel pannello di navigazione a sinistra, seleziona **Ruoli**. 1. Scegli il nome del ruolo che desideri modificare (ad esempio, *getStartedRole*), quindi scegli la scheda **Autorizzazioni**. 1. Seleziona **Aggiungi autorizzazioni**, quindi seleziona **Collega policy**. 1. **Nella pagina **Aggiungi autorizzazioni** per questo ruolo, trova e seleziona la casella di controllo per AmazonS3. ReadOnlyAccess** **Nota** Puoi utilizzare questo processo per abilitare l'accesso a qualsiasi servizio. AWS 1. Scegli **Add Permissions (Aggiungi autorizzazioni)**. Dopo aver creato il tuo pool di identità Amazon Cognito e aggiunto le autorizzazioni per Amazon S3 al tuo ruolo IAM per utenti non autenticati, sei pronto per creare l'app. ## Passaggio 3: crea l'app utilizzando create-react-native-app Crea un'app React Native eseguendo il seguente comando. ``` npx react-native init ReactNativeApp --npm ``` ## Fase 4: Installare il pacchetto Amazon S3 e altre dipendenze All'interno della directory del progetto, esegui i seguenti comandi per installare il pacchetto Amazon S3. ``` npm install @aws-sdk/client-s3 ``` Questo comando installa il pacchetto Amazon S3 nel progetto e lo `package.json` aggiorna per elencare Amazon S3 come dipendenza del progetto. Puoi trovare informazioni su questo pacchetto cercando "@aws -sdk» sul sito web di npm. [https://www.npmjs.com/](https://www.npmjs.com/) Questi pacchetti e il relativo codice vengono installati nella sottodirectory `node_modules` del progetto. Per ulteriori informazioni sull'installazione dei pacchetti Node.js, consulta [Scaricamento e installazione dei pacchetti localmente](https://docs.npmjs.com/downloading-and-installing-packages-locally) e [Creazione dei moduli Node.js sul sito](https://docs.npmjs.com/creating-node-js-modules) web di [npm (Node.js package manager)](https://www.npmjs.com/). Per informazioni sul download e l'installazione dell' AWS SDK per JavaScript, consulta. [Installa l'SDK per JavaScript](setting-up.md#installing-jssdk) Installa le altre dipendenze necessarie per l'autenticazione. ``` npm install @aws-sdk/client-cognito-identity @aws-sdk/credential-provider-cognito-identity ``` ## Passaggio 5: scrivere il codice React Native Aggiungi il codice seguente a`App.tsx`. Sostituisci *identityPoolId* e *region* con l'ID del pool di identità e la regione in cui verrà creato il bucket Amazon S3. ``` import React, { useCallback, useState } from "react"; import { Button, StyleSheet, Text, TextInput, View } from "react-native"; import "react-native-get-random-values"; import "react-native-url-polyfill/auto"; import { S3Client, CreateBucketCommand, DeleteBucketCommand, } from "@aws-sdk/client-s3"; import { fromCognitoIdentityPool } from "@aws-sdk/credential-providers"; const client = new S3Client({ // The AWS Region where the Amazon Simple Storage Service (Amazon S3) bucket will be created. Replace this with your Region. region: "us-east-1", credentials: fromCognitoIdentityPool({ // Replace the value of 'identityPoolId' with the ID of an Amazon Cognito identity pool in your Amazon Cognito Region. identityPoolId: "us-east-1:edbe2c04-7f5d-469b-85e5-98096bd75492", // Replace the value of 'region' with your Amazon Cognito Region. clientConfig: { region: "us-east-1" }, }), }); enum MessageType { SUCCESS = 0, FAILURE = 1, EMPTY = 2, } const App = () => { const [bucketName, setBucketName] = useState(""); const [msg, setMsg] = useState<{ message: string; type: MessageType }>({ message: "", type: MessageType.EMPTY, }); const createBucket = useCallback(async () => { setMsg({ message: "", type: MessageType.EMPTY }); try { await client.send(new CreateBucketCommand({ Bucket: bucketName })); setMsg({ message: `Bucket "${bucketName}" created.`, type: MessageType.SUCCESS, }); } catch (e) { console.error(e); setMsg({ message: e instanceof Error ? e.message : "Unknown error", type: MessageType.FAILURE, }); } }, [bucketName]); const deleteBucket = useCallback(async () => { setMsg({ message: "", type: MessageType.EMPTY }); try { await client.send(new DeleteBucketCommand({ Bucket: bucketName })); setMsg({ message: `Bucket "${bucketName}" deleted.`, type: MessageType.SUCCESS, }); } catch (e) { setMsg({ message: e instanceof Error ? e.message : "Unknown error", type: MessageType.FAILURE, }); } }, [bucketName]); return ( {msg.type !== MessageType.EMPTY && ( {msg.message} )} setBucketName(text)} autoCapitalize={"none"} value={bucketName} placeholder={"Enter Bucket Name"} />