Bagaimana untuk Mengintegrasikan Kunci Laluan ke dalam Java Spring Boot-javaTutorial-php.cn

Pengenalan kepada Kunci Laluan dalam Java Spring Boot

Kunci laluan menawarkan cara moden dan selamat untuk mengesahkan pengguna tanpa bergantung pada kata laluan tradisional. Dalam panduan ini, kami akan membimbing anda melalui mengintegrasikan kunci laluan ke dalam aplikasi Java Spring Boot menggunakan Thymeleaf sebagai enjin templat.

Kami akan menggunakan komponen UI pertama kunci laluan Corbado untuk menyambung ke bahagian belakang, memudahkan proses pelaksanaan. Tutorial ini menganggap anda mempunyai pemahaman asas tentang HTML dan Java Spring Boot, dan bahawa anda telah memasang Corbado Java SDK.

Lihat tutorial asal penuh

Prasyarat untuk Melaksanakan Kunci Laluan dalam Java Spring Boot

Sebelum kami memulakan, pastikan persediaan projek anda termasuk Corbado Java SDK. Untuk tutorial ini, kami akan menggunakan versi 0.0.1 sebagai contoh. Tambahkan kebergantungan berikut pada fail pom.xml anda:

<dependency>
  <groupId>com.corbado</groupId>
  <artifactId>corbado-java</artifactId>
  <version>0.0.1</version>
</dependency>

Salin selepas log masuk

Sebagai alternatif, jika anda menggunakan Gradle, tambah:

implementation "com.corbado:corbado-java:0.0.1"

Salin selepas log masuk

Menyediakan Akaun dan Projek Corbado Anda

Untuk bermula, daftar untuk akaun Corbado melalui panel pembangun. Semasa persediaan, anda akan mengkonfigurasi projek anda dengan memilih "Corbado Complete" dan memilih "Web app" untuk persekitaran anda. Pastikan anda menyediakan URL Aplikasi dan ID Pihak Bergantung, biasanya ditetapkan kepada http://localhost:8080 dan localhost, masing-masing. Tetapan ini penting untuk mengikat kunci laluan ke domain yang betul.

Seterusnya, jana rahsia API daripada panel pembangun Corbado. Ini diperlukan untuk komunikasi bahagian belakang, termasuk pengambilan data pengguna.

Membina Aplikasi Kunci Laluan But Spring Java Anda

Klon repositori pemula Spring Boot:

git clone https://github.com/spring-guides/gs-spring-boot.git

Salin selepas log masuk

Dalam projek ini, namakan semula HelloController.java kepada FrontendController.java. Pengawal ini akan menyediakan fail HTML berdasarkan permintaan pengguna. Dalam fail application.properties anda, simpan projectID dan apiSecret sebagai pembolehubah persekitaran (kedua-duanya boleh diperoleh daripada panel pembangun Corbado).

Mencipta Halaman Log Masuk Kunci Laluan

Buat fail index.html dalam direktori /complete/src/main/resources/templates. Fail ini akan berfungsi sebagai halaman log masuk, membenamkan komponen UI utama kunci laluan Corbado. Berikut ialah struktur asas:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head>
  <link rel="stylesheet" href="https://unpkg.com/@corbado/web-js@2.8.0/dist/bundle/index.css"/>
  <script src="https://unpkg.com/@corbado/web-js@2.8.0/dist/bundle/index.js" defer></script>
</head>
<body>
  <div id="corbado-auth"></div>
  <script th:inline="javascript">
    document.addEventListener('DOMContentLoaded', async () => {
      await Corbado.load({
        projectId: '[PROJECT_ID]',
        darkMode: "off",
        setShortSessionCookie: "true"
      });
      Corbado.mountAuthUI(document.getElementById('corbado-auth'), {
        onLoggedIn: () => window.location.href = '/profile',
      });
    });
  </script>
</body>
</html>

Salin selepas log masuk

Menentukan Titik Akhir Pengawal untuk Penyepaduan Kunci Laluan

Dalam FrontendController.java, tentukan titik akhir untuk mengendalikan permintaan ke halaman log masuk dan profil. Kaedah index() harus memaparkan halaman log masuk, manakala kaedah profile() akan mengesahkan sesi pengguna dan memaparkan profil pengguna.

@Controller
public class FrontendController {

  @Value("${projectID}")
  private String projectID;

  @Value("${apiSecret}")
  private String apiSecret;

  private final CorbadoSdk sdk;

  @Autowired
  public FrontendController(
      @Value("${projectID}") final String projectID, @Value("${apiSecret}") final String apiSecret)
      throws StandardException {
    final Config config = new Config(projectID, apiSecret);
    this.sdk = new CorbadoSdk(config);
  }

  @RequestMapping("/")
  public String index(final Model model) {
    model.addAttribute("PROJECT_ID", projectID);
    return "index";
  }
  ...

Salin selepas log masuk

Tambah Halaman Profil Kunci Laluan

Selepas pengesahan berjaya, komponen UI Corbado mengubah hala pengguna. Halaman ini memaparkan maklumat tentang pengguna dan menyediakan butang untuk log keluar. Dalam folder templat, tambahkan fail profile.html dengan kandungan berikut:

<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
  <head>
    <link
      rel="stylesheet"
      href="https://unpkg.com/@corbado/web-js@2.8.0/dist/bundle/index.css"
      />
      <script src="https://unpkg.com/@corbado/web-js@2.8.0/dist/bundle/index.js" defer></script>
    </head>
    <body>

     <!-- Define passkey-list div and logout button -->
    <h2>:/protected</h2>
    <p>User ID: [[${USER_ID}]]</p>
    <p>Name: [[${USER_NAME}]]</p>
    <p>Email: [[${USER_EMAIL}]]</p>
    <div id="passkey-list"></div>
    <button id="logoutButton">Logout</button>


    <!-- Script to load Corbado and mount PasskeyList UI -->
    <script th:inline="javascript">
        document.addEventListener('DOMContentLoaded', async () => {
            await Corbado.load({
                projectId: /*[[${PROJECT_ID}]]*/,
                darkMode: "off",
                setShortSessionCookie: "true" // set short session cookie automatically
            }); 

            // Get and mount PasskeyList UI
            const passkeyListElement = document.getElementById("passkey-list"); // Element where you want to render PasskeyList UI
            Corbado.mountPasskeyListUI(passkeyListElement);

            // Get logout button
            const logoutButton = document.getElementById('logoutButton');
            // Add event listener to logout button
            logoutButton.addEventListener('click', function() {
              Corbado.logout()
                    .then(() => {
                        window.location.replace("/");
                    })
                    .catch(err => {
                        console.error(err);
                    });
            });
        })();
    </script>


</body>
</html>

Salin selepas log masuk

Seterusnya, buat kaedah profile() dengan anotasi di dalam FrontendController.java:

@RequestMapping("/profile")
public String profile() {
  return "profile";
}

Salin selepas log masuk

Sahkan Sesi Corbado

Sebelum kami boleh menggunakan maklumat yang dibenamkan dalam sesi, kami perlu mengesahkan bahawa sesi itu sah. Oleh itu, kami mengambil kuki cbo_short_session (sesi) dan mengesahkan tandatangannya menggunakan perkhidmatan sesi daripada Corbado Java SDK. Ini boleh dilakukan dengan:

final SessionValidationResult validationResp =
          sdk.getSessions().getAndValidateCurrentUser(cboShortSession);

Salin selepas log masuk

Dapatkan Data daripada Corbado Session

Ia mengambil kuki cbo_short_session, mengesahkannya dan mengembalikan ID Pengguna dan nama penuh pengguna.

Kod akhir untuk pemetaan profil kelihatan seperti berikut:

  @RequestMapping("/profile")
  public String profile(
      final Model model, @CookieValue("cbo_short_session") final String cboShortSession) {
    try {
      // Validate user from token
      final SessionValidationResult validationResp =
          sdk.getSessions().getAndValidateCurrentUser(cboShortSession);
      // get list of emails from identifier service
      List<Identifier> emails;

      emails = sdk.getIdentifiers().listAllEmailsByUserId(validationResp.getUserID());

      //
      model.addAttribute("PROJECT_ID", projectID);
      model.addAttribute("USER_ID", validationResp.getUserID());
      model.addAttribute("USER_NAME", validationResp.getFullName());
      // select email of your liking or list all emails
      model.addAttribute("USER_EMAIL", emails.get(0).getValue());

    } catch (final Exception e) {
      System.out.println(e.getMessage());
      model.addAttribute("ERROR", e.getMessage());
      return "error";
    }
    return "profile";
  }

Salin selepas log masuk

Melancarkan Aplikasi Anda

Untuk memulakan aplikasi Spring Boot anda, navigasi ke direktori /complete dan jalankan:

./mvnw spring-boot:run

Salin selepas log masuk

Lawati http://localhost:8080 dalam penyemak imbas anda untuk melihat halaman log masuk sedang beraksi.

How to Integrate Passkeys into Java Spring Boot

Kesimpulan

Panduan ini menunjukkan cara menyepadukan kunci laluan ke dalam aplikasi Java Spring Boot menggunakan Corbado. Dengan mengikuti langkah ini, anda boleh melaksanakan pengesahan tanpa kata laluan dengan cekap dan selamat. Untuk dokumentasi yang lebih terperinci tentang pengurusan sesi dan penyepaduan Corbado ke dalam aplikasi sedia ada, rujuk dokumentasi rasmi Corbado.

Atas ialah kandungan terperinci Bagaimana untuk Mengintegrasikan Kunci Laluan ke dalam Java Spring Boot. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!