Migrasi dari MSAL v1.x ke MSAL v2.x

Jika Anda baru menggunakan MSAL, Anda harus mulai di sini. Jika Anda berasal dari MSAL v1.x, Anda dapat mengikuti panduan ini untuk memperbarui kode Anda untuk menggunakan MSAL v2.x

1. Perbarui pendaftaran aplikasi

Buka pusat admin Microsoft Entra untuk penyewa Anda dan tinjau Pendaftaran Aplikasi. Anda dapat membuat pendaftaran baru untuk MSAL 2.x atau Anda dapat memperbarui pendaftaran yang ada untuk pendaftaran yang Anda gunakan untuk MSAL 1.x.

2. Tambahkan paket msal-browser ke proyek Anda

Menggunakan npm, gunakan hal berikut:

npm install @azure/msal-browser

3. Perbarui kode Anda

Di MSAL 1.x, Anda membuat instans aplikasi seperti di bawah ini:

import * as msal from "msal";

const msalInstance = new msal.UserAgentApplication(config);

Di MSAL 2.x, Anda dapat memperbarui ini untuk menggunakan objek baru PublicClientApplication .

import * as msal from "@azure/msal-browser";

const msalInstance = new msal.PublicClientApplication(config);

Mungkin ada beberapa perbedaan kecil dalam objek konfigurasi yang diteruskan. Jika Anda meneruskan konfigurasi yang lebih canggih ke UserAgentApplication objek, lihat di sini untuk informasi selengkapnya tentang opsi konfigurasi objek aplikasi baru.

Tanda tangan objek permintaan dan respons telah berubah - acquireTokenSilent sekarang memiliki tanda tangan objek terpisah dari API interaktif. Silakan lihat di sini untuk informasi selengkapnya tentang mengonfigurasi API permintaan.

Sebagian besar API dari MSAL 1.x telah diteruskan ke MSAL 2.x tanpa perubahan. Beberapa fungsi telah dihapus:

  • handleRedirectCallback
  • urlContainsHash
  • getCurrentConfiguration
  • getLoginInProgress
  • getAccount
  • getAccountState
  • isCallback

Dalam MSAL 2.x, menangani respons dari hash adalah operasi asinkron, karena MSAL akan melakukan pertukaran token segera setelah mengurai kode otorisasi dari respons. Karena itu, saat melakukan panggilan pengalihan, MSAL menyediakan handleRedirectPromise fungsi yang akan mengembalikan janji yang diselesaikan ketika pengalihan telah sepenuhnya ditangani oleh MSAL. Saat menggunakan metode pengalihan, halaman yang digunakan sebagai redirectUri harus diterapkan handleRedirectPromise untuk memastikan respons ditangani dan token di-cache saat kembali dari pengalihan.

const myMSALObj = new msal.PublicClientApplication(msalConfig); 

// Register Callbacks for Redirect flow
myMSALObj.handleRedirectPromise().then((tokenResponse) => {
    let accountObj = null;
    if (tokenResponse !== null) {
        accountObj = tokenResponse.account;
        const id_token = tokenResponse.idToken;
        const access_token = tokenResponse.accessToken;
    } else {
        const currentAccounts = myMSALObj.getAllAccounts();
        if (!currentAccounts || currentAccounts.length === 0) {
            // No user signed in
            return;
        } else if (currentAccounts.length > 1) {
            // More than one user signed in, find desired user with getAccountByUsername(username)
        } else {
            accountObj = currentAccounts[0];
        }
    }
    
    const username = accountObj.username;
   
}).catch((error) => {
    handleError(error);
});

function signIn() {
    myMSALObj.loginRedirect(loginRequest);
}

async function getTokenRedirect(request) {
    return await myMSALObj.acquireTokenSilent(request).catch(error => {
        this.logger.info("silent token acquisition fails. acquiring token using redirect");
        // fallback to interaction when silent call fails
        return myMSALObj.acquireTokenRedirect(request)
    });
}

Selama panggilan loginPopup, acquireTokenPopup, atau acquireTokenSilent, Anda dapat menunggu hingga promise tersebut terselesaikan.

const myMSALObj = new msal.PublicClientApplication(msalConfig); 

async function signIn(method) {
    try {
        const loginResponse = await myMSALObj.loginPopup(loginRequest);
    } catch (err) {
        handleError(error);
    }

    const currentAccounts = myMSALObj.getAllAccounts();
    if (!currentAccounts || currentAccounts.length === 0) {
        // No user signed in
        return;
    } else if (currentAccounts.length > 1) {
        // More than one user signed in, find desired user with getAccountByUsername(username)
    } else {
        accountObj = currentAccounts[0];
    }
}

async function getTokenPopup(request) {
    return await myMSALObj.acquireTokenSilent(request).catch(async (error) => {
        this.logger.info("silent token acquisition fails. acquiring token using popup");
        // fallback to interaction when silent call fails
        return await myMSALObj.acquireTokenPopup(request).catch(error => {
            handleError(error);
        });
    });
}

Silakan lihat dokumentasi login dan dokumentasi memperoleh token untuk informasi yang lebih rinci tentang penggunaan.

Token penyegaran kini dikembalikan sebagai bagian dari respons token, dan digunakan oleh pustaka untuk memperbarui token akses tanpa interaksi atau penggunaan iframe. Lihat dokumen seumur hidup token untuk informasi selengkapnya tentang memperbarui token.

Semua API lainnya harus berfungsi seperti sebelumnya. Disarankan untuk melihat sampel default untuk melihat contoh kerja MSAL 2.0.

  • Last updated on