Bagikan melalui

Memanggil API web di aplikasi web Node.js

Berlaku untuk: Lingkaran putih dengan simbol X abu-abu. Penyewa tenaga kerja Lingkaran hijau dengan simbol tanda centang putih. Penyewa eksternal (pelajari lebih lanjut)

Dalam artikel ini, Anda mempelajari cara memanggil API web dari aplikasi web klien Node.js Anda menggunakan token akses yang Anda peroleh di Memperoleh token akses. API web dilindungi oleh MICROSOFT Entra External ID. Artikel ini adalah bagian keempat dan terakhir dari seri panduan empat bagian.

Prasyarat

Memperbarui kode

  1. Di editor kode Anda, buka rute/filetodos.js, lalu tambahkan kode berikut:

        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;

    File ini berisi rute ekspres untuk membuat, membaca, dan menghapus sumber daya di API yang dilindungi. Setiap rute menggunakan tiga fungsi middleware, yang dijalankan dalam urutan tersebut:

    • isAuthenticated memeriksa apakah pengguna diautentikasi.

    • getToken meminta token akses. Anda menentukan fungsi ini sebelumnya di Memperoleh token akses. Misalnya, rute pembuatan sumber daya (permintaan POST) meminta token akses dengan izin untuk membaca dan menulis.

    • Terakhir, metode postToDo atau deleteToDogetToDos menangani logika aktual untuk memanipulasi sumber daya. Fungsi-fungsi ini didefinisikan dalam file controller/todolistController.js.

  2. Di editor kode Anda, buka pengontrol/filetodolistController.js, lalu tambahkan kode berikut:

        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);
        }
    };

    Masing-masing fungsi ini mengumpulkan semua informasi yang diperlukan untuk memanggil API. Kemudian mendelegasikan pekerjaan ke fungsi callEndpointWithToken dan menunggu respons. Fungsi callEndpointWithToken ditentukan dalam file fetch.js. Misalnya, untuk membuat sumber daya di API, fungsi postToDo melewati titik akhir, token akses, metode HTTP, dan isi permintaan ke fungsi callEndpointWithToken dan menunggu respons. Kemudian mengalihkan pengguna ke tampilan todo.hbs untuk menampilkan semua tugas.

  3. Di editor kode Anda, buka file fetch.js, lalu tambahkan kode berikut:

        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,
    };

    Fungsi ini membuat panggilan API yang sebenarnya. Perhatikan bagaimana Anda menyertakan token akses sebagai nilai token pembawa di header permintaan HTTP:

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

  4. Di editor kode Anda, buka file .env, lalu tambahkan konfigurasi berikut:

        # 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'

    Pengaturan NODE_TLS_REJECT_UNAUTHORIZED='0' dalam file .env Menginstruksikan Node.js untuk mengabaikan kesalahan sertifikat SSL, seperti kesalahan sertifikat yang ditandatangani sendiri.

  5. Di editor kode Anda, buka file app.js, lalu:

    1. Tambahkan router todo dengan menggunakan kode berikut:

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

    2. Gunakan router todo dengan menggunakan kode berikut:

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

Menjalankan dan menguji aplikasi web dan API

Pada titik ini, Anda siap untuk memanggil API web dari aplikasi web klien:

  1. Gunakan langkah-langkah dalam artikel Mengamankan API web ASP.NET untuk memulai aplikasi API web Anda. API web Anda sekarang siap untuk melayani permintaan klien.

  2. Di terminal Anda, pastikan Anda berada di folder proyek yang berisi aplikasi web klien Anda seperti ciam-sign-in-call-api-node-express-web-app, lalu jalankan perintah berikut:

    npm start

    Aplikasi web klien Anda dimulai.

  3. Gunakan langkah-langkah dalam Menjalankan dan menguji sampel aplikasi web dan API untuk menunjukkan bagaimana aplikasi klien memanggil API web.

Konten terkait

Anda mungkin ingin: