Condividi tramite

Chiamare un'API Web in un'applicazione Web Node.js

  • Articolo

Si applica a: Cerchio bianco con un simbolo X grigio. Tenant della forza lavoro Cerchio verde con un segno di spunta bianco all'interno. Tenant esterni (altre informazioni)

Questo articolo illustra come chiamare un'API Web dall'app Web del client Node.js usando il token di accesso acquisito in Acquisire il token di accesso. L'API Web è protetta da Microsoft Entra per ID esterno. Questo articolo è la quarta e ultima parte di una serie di guide in quattro parti.

Prerequisito

Aggiornare il codice

  1. Nell'editor di codice aprire il file routes/todos.js e quindi aggiungere il codice seguente:

        const express = require('express');
    const router = express.Router();

    const toDoListController = require('../controller/todolistController');
    const authProvider = require('../auth/AuthProvider');
    const { protectedResources } = require('../authConfig');

    // custom middleware to check auth state
    function isAuthenticated(req, res, next) {
        if (!req.session.isAuthenticated) {
            return res.redirect('/auth/signin'); // redirect to sign-in route
        }

        next();
    }        
    // isAuthenticated checks if user is authenticated
    router.get('/',isAuthenticated, authProvider.getToken(protectedResources.toDoListAPI.scopes.read),toDoListController.getToDos);

    router.delete('/', isAuthenticated,authProvider.getToken(protectedResources.toDoListAPI.scopes.write),toDoListController.deleteToDo);

    router.post('/',isAuthenticated,authProvider.getToken(protectedResources.toDoListAPI.scopes.write),toDoListController.postToDo);

    module.exports = router;

    Questo file contiene le route rapide per la creazione, la lettura e l'eliminazione di una risorsa nell'API protetta. Ogni route usa tre funzioni middleware, eseguite in tale sequenza:

    • isAuthenticated controlla se l'utente è autenticato.

    • getToken richiede un token di accesso. Questa funzione è stata definita in precedenza in Acquisire il token di accesso. Ad esempio, la creazione della route di risorse (richiesta POST) richiede un token di accesso con autorizzazioni di lettura e scrittura.

    • Infine, i postToDo metodi o deleteToDo getToDos gestiscono la logica effettiva per la modifica della risorsa. Queste funzioni vengono definite nel file controller/todolistController.js.

  2. Nell'editor di codice aprire il file controller/todolistController.js, quindi aggiungere il codice seguente:

        const { callEndpointWithToken } = require('../fetch');
    const { protectedResources } = require('../authConfig');

    exports.getToDos = async (req, res, next) => {
        try {
            const todoResponse = await callEndpointWithToken(
                protectedResources.toDoListAPI.endpoint,
                req.session.accessToken,
                'GET'
            );
            res.render('todos', { isAuthenticated: req.session.isAuthenticated, todos: todoResponse.data });
        } catch (error) {
            next(error);
        }
    };

    exports.postToDo = async (req, res, next) => {
        try {
            if (!!req.body.description) {
                let todoItem = {
                    description: req.body.description,
                };

                await callEndpointWithToken(
                    protectedResources.toDoListAPI.endpoint,
                    req.session.accessToken,
                    'POST',
                    todoItem
                );
                res.redirect('todos');
            } else {
                throw { error: 'empty request' };
            }
        } catch (error) {
            next(error);
        }
    };

    exports.deleteToDo = async (req, res, next) => {
        try {
            await callEndpointWithToken(
                protectedResources.toDoListAPI.endpoint,
                req.session.accessToken,
                'DELETE',
                req.body._id
            );
            res.redirect('todos');
        } catch (error) {
            next(error);
        }
    };

    Ognuna di queste funzioni raccoglie tutte le informazioni necessarie per chiamare un'API. Delega quindi il lavoro alla funzione callEndpointWithToken e attende una risposta. La funzione callEndpointWithToken è definita nel file fetch.js. Ad esempio, per creare una risorsa nell'API, la funzione postToDo passa un endpoint, un token di accesso, un metodo HTTP e un corpo della richiesta alla funzione callEndpointWithToken e attende una risposta. Reindirizza quindi l'utente alla visualizzazione todo.hbs per visualizzare tutte le attività.

  3. Nell'editor di codice aprire il file fetch.js e quindi aggiungere il codice seguente:

        const axios = require('axios');

    /**
     * Makes an Authorization "Bearer" request with the given accessToken to the given endpoint.
     * @param endpoint
     * @param accessToken
     * @param method
     */
    const callEndpointWithToken = async (endpoint, accessToken, method, data = null) => {
        const options = {
            headers: {
                Authorization: `Bearer ${accessToken}`,
            },
        };

        switch (method) {
            case 'GET':
                return await axios.get(endpoint, options);
            case 'POST':
                return await axios.post(endpoint, data, options);
            case 'DELETE':
                return await axios.delete(endpoint + `/${data}`, options);
            default:
                return null;
        }
    };

    module.exports = {
        callEndpointWithToken,
    };

    Questa funzione effettua la chiamata API effettiva. Si noti come il token di accesso viene incluso come valore del token di connessione nell'intestazione della richiesta HTTP:

        //...        
    headers: {
        Authorization: `Bearer ${accessToken}`,
    }        
    //...

  4. Nell'editor di codice aprire il file .env, quindi aggiungere la configurazione seguente:

        # Use this variable only in the development environment. 
    # Please remove the variable when you move the app to the production environment.
    NODE_TLS_REJECT_UNAUTHORIZED='0'

    L'impostazione NODE_TLS_REJECT_UNAUTHORIZED='0' nel file .env indica Node.js di ignorare eventuali errori del certificato SSL, ad esempio l'errore del certificato autofirmato.

  5. Nell'editor di codice aprire il file app.js, quindi:

    1. Aggiungere il router delle cose da fare usando il codice seguente:

          var todosRouter = require('./routes/todos');

    2. Usare il router delle cose da fare usando il codice seguente:

          app.use('/todos', todosRouter);

Eseguire e testare le app Web e API

A questo punto, è possibile chiamare l'API Web dall'app Web del client:

  1. Usare la procedura descritta nell’articolo Proteggere un'API Web ASP.NET per avviare l'app per le API Web. L'API Web è ora pronta per gestire le richieste client.

  2. Nel terminale assicurarsi di essere nella cartella del progetto che contiene l'app Web del client, ad esempio ciam-sign-in-call-api-node-express-web-app, quindi eseguire il comando seguente:

    npm start

    Viene avviata l'app Web del client.

  3. Usare la procedura descritta in Eseguire e testare app Web e API di esempio per illustrare come l'app del client chiama l'API Web.

Passaggi successivi

È possibile: