Kontaktformular erstellen mit Spring boot mvc: Unterschied zwischen den Versionen

Aus ahrensburg.city
Zur Navigation springen Zur Suche springen
← Zum vorherigen Versionsunterschied
// via Wikitext Extension for VSCode
// via Wikitext Extension for VSCode
 
(4 dazwischenliegende Versionen desselben Benutzers werden nicht angezeigt)
Zeile 1: Zeile 1:
Kontaktformular erstellen mit Spring boot mvc
==Kontaktformular erstellen mit Spring boot mvc==
 
===Spring boot Starter===
In diesem Tutorial werden wir ein Kontaktformular erstellen, das die Eingabe von Benutzern entgegennimmt und die Daten in der Datenbank speichert. Wir werden auch die Validierung der Benutzereingaben implementieren.
* Spring Web Starter
 
== Schritt 1: Erstellen Sie ein neues Spring Boot-Projekt==
 
Erstellen Sie ein neues Spring Boot-Projekt mit dem Spring Initializr. Fügen Sie die folgenden Abhängigkeiten hinzu:
 
* Spring Web
* Thymeleaf
* Thymeleaf
* Spring Data JPA
* Spring Boot DevTools
* Spring Data JPA Starter
* H2 Database
* H2 Database
 
* Spring Security Starter
== Schritt 2: Erstellen Sie das Kontaktformular==  
* Validation Starter
 
* Spring Boot session
Erstellen Sie eine neue HTML-Datei namens `contact.html` im `src/main/resources/templates` Verzeichnis. Fügen Sie den folgenden Code hinzu:
===Projektstruktur===
 
* src
** main
*** java
**** com.example.demo
***** controller
****** HomeController.java
***** model
****** Contact.java
***** repository
****** ContactRepository.java
***** service
****** ContactService.java
***** DemoApplication.java
*** resources
**** static
***** css
****** style.css
**** templates
***** contact.html
***** index.html
***** login.html
***** register.html
***** welcome.html
**** application.properties
==Roadmap==
* Erstellen Sie ein neues Spring Boot-Projekt
* Fügen Sie die Abhängigkeiten hinzu
* Konfigurieren Sie die Datenbank
* Erstellen Sie das Modell
* Erstellen Sie das Repository
* Erstellen Sie den Service
* Erstellen Sie den Controller
* Erstellen Sie die Ansichten
* Konfigurieren Sie die Sicherheit
* Testen Sie die Anwendung
==Konfigurieren Sie die Datenbank h2==
* application.properties
<pre>
<pre>
<!DOCTYPE html>
spring.datasource.url=jdbc:h2:mem:testdb
<html xmlns:th="http://www.thymeleaf.org">
spring.datasource.driverClassName=org.h2.Driver
<head>
spring.datasource.username=sa
    <title>Kontaktformular</title>
spring.datasource.password=
</head>
spring.jpa.database-platform=org.hibernate.dialect.H2Dialect
<body>
spring.h2.console.enabled=true
    <h1>Kontaktformular</h1>
spring.h2.console.path=/h2
    <form action="#" th:action="@{/submit}" th:object="${contact}" method="post">
        <label for="name">Name:</label>
        <input type="text" id="name" th:field="*{name}" />
        <br/>
        <label for="email">Email:</label>
        <input type="email" id="email" th:field="*{email}" />
        <br/>
        <label for="message">Nachricht:</label>
        <textarea id="message" th:field="*{message}"></textarea>
        <br/>
        <button type="submit">Absenden</button>
    </form>
</body>
</html>
 
</pre>
 
== Schritt 3: Erstellen Sie das Kontaktformular-Modell==
Erstellen Sie eine neue Java-Klasse namens `Contact` im `src/main/java/com/example/demo` Verzeichnis. Fügen Sie den folgenden Code hinzu:
 
<pre>
package city.ahrensburg.demo;
 
import jakarta.persistence.Entity;
import jakarta.persistence.GeneratedValue;
import jakarta.persistence.GenerationType;
import jakarta.persistence.Id;
 
@Entity
public class Kontaktmodel {
    @Id
    @GeneratedValue(strategy = GenerationType.AUTO)
    private Long id;
    private String name;
 
    // Getter und Setter für id
    public Long getId() {
        return id;
    }
 
    public void setId(Long id) {
        this.id = id;
    }
 
    // Getter und Setter für name
    public String getName() {
        return name;
    }
 
    public void setName(String name) {
        this.name = name;
    }
}
</pre>
</pre>


== Schritt 4: Erstellen Sie den Kontaktformular-Controller==
==Konfigration erstellen Security==
Erstellen Sie eine neue Java-Klasse namens `ContactController` im `src/main/java/com/example/demo` Verzeichnis. Fügen Sie den folgenden Code hinzu:
Konfigration erstellen Security


<pre>
<pre>
package city.ahrensburg.demo;


import org.springframework.stereotype.Controller;
@Configuration
import org.springframework.ui.Model;
@EnableWebSecurity
import org.springframework.web.bind.annotation.GetMapping;
public class SecurityConfig {
import org.springframework.web.bind.annotation.PostMapping;


@Controller
    @Bean
public class Kontaktcontroller {
    public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
 
        http
    @GetMapping("/kontakt")
            .authorizeHttpRequests((authz) -> authz
    public String kontaktformular(Model model) {
                .requestMatchers("/admin/**").denyAll() // Verweigere Zugriff auf /admin/** für alle Benutzer
        model.addAttribute("contact", new Kontaktmodel());
               
         return "contact";
                .requestMatchers("/**").permitAll() // Erlaube Zugriff auf /public/** ohne Authentifizierung
                .anyRequest().authenticated() // Alle anderen Anfragen erfordern Authentifizierung
            )
            .formLogin(withDefaults()); // Aktiviere Standard-Formularanmeldung
         return http.build();
     }
     }


     @PostMapping("/submit")
     @Bean
    public String submitForm(Kontaktmodel contact) {
    public UserDetailsService userDetailsService() {
        // Speichern Sie die Kontaktformulardaten in der Datenbank
        UserDetails user = User.withDefaultPasswordEncoder()
         return "redirect:/kontakt";
            .username("Test")
            .password("Test")
            .roles("USER")
            .build();
         return new InMemoryUserDetailsManager(user);
     }
     }
}
}
</pre>


== Schritt 5: Konfigurieren Sie die Datenbank==
Öffnen Sie die `application.properties` Datei im `src/main/resources` Verzeichnis und fügen Sie die folgenden Einstellungen hinzu:
<pre>
spring.datasource.url=jdbc:h2:mem:testdb
spring.datasource.driverClassName=org.h2.Driver
spring.datasource.username=sa
spring.datasource.password=password
spring.jpa.database-platform=org.hibernate.dialect.H2Dialect
spring.h2.console.enabled=true
</pre>
</pre>
== Schritt 6: Starten Sie die Anwendung==
Starten Sie die Anwendung und navigieren Sie zu `http://localhost:8080/kontakt`, um das Kontaktformular anzuzeigen. Füllen Sie das Formular aus und klicken Sie auf "Absenden". Die eingegebenen Daten werden in der Datenbank gespeichert.
Das ist alles! Sie haben erfolgreich ein Kontaktformular mit Spring Boot MVC erstellt. Viel Spaß beim Codieren!
== Zusammenfassung==
In diesem Tutorial haben wir ein Kontaktformular erstellt, das die Eingabe von Benutzern entgegennimmt und die Daten in der Datenbank speichert. Wir haben auch die Validierung der Benutzereingaben implementiert. Sie können dieses Beispiel als Ausgangspunkt für die Entwicklung von komplexeren Formularen verwenden. Viel Spaß beim Codieren!

Aktuelle Version vom 18. Dezember 2024, 05:32 Uhr

Kontaktformular erstellen mit Spring boot mvc

Spring boot Starter

  • Spring Web Starter
  • Thymeleaf
  • Spring Boot DevTools
  • Spring Data JPA Starter
  • H2 Database
  • Spring Security Starter
  • Validation Starter
  • Spring Boot session

Projektstruktur

  • src
    • main
      • java
        • com.example.demo
          • controller
            • HomeController.java
          • model
            • Contact.java
          • repository
            • ContactRepository.java
          • service
            • ContactService.java
          • DemoApplication.java
      • resources
        • static
          • css
            • style.css
        • templates
          • contact.html
          • index.html
          • login.html
          • register.html
          • welcome.html
        • application.properties

Roadmap

  • Erstellen Sie ein neues Spring Boot-Projekt
  • Fügen Sie die Abhängigkeiten hinzu
  • Konfigurieren Sie die Datenbank
  • Erstellen Sie das Modell
  • Erstellen Sie das Repository
  • Erstellen Sie den Service
  • Erstellen Sie den Controller
  • Erstellen Sie die Ansichten
  • Konfigurieren Sie die Sicherheit
  • Testen Sie die Anwendung

Konfigurieren Sie die Datenbank h2

  • application.properties
spring.datasource.url=jdbc:h2:mem:testdb
spring.datasource.driverClassName=org.h2.Driver
spring.datasource.username=sa
spring.datasource.password=
spring.jpa.database-platform=org.hibernate.dialect.H2Dialect
spring.h2.console.enabled=true
spring.h2.console.path=/h2

Konfigration erstellen Security

Konfigration erstellen Security 


@Configuration
@EnableWebSecurity
public class SecurityConfig {

    @Bean
    public SecurityFilterChain filterChain(HttpSecurity http) throws Exception {
        http
            .authorizeHttpRequests((authz) -> authz
                .requestMatchers("/admin/**").denyAll() // Verweigere Zugriff auf /admin/** für alle Benutzer
                
                .requestMatchers("/**").permitAll() // Erlaube Zugriff auf /public/** ohne Authentifizierung
                .anyRequest().authenticated() // Alle anderen Anfragen erfordern Authentifizierung
            )
            .formLogin(withDefaults()); // Aktiviere Standard-Formularanmeldung
        return http.build();
    }

    @Bean
    public UserDetailsService userDetailsService() {
        UserDetails user = User.withDefaultPasswordEncoder()
            .username("Test")
            .password("Test")
            .roles("USER")
            .build();
        return new InMemoryUserDetailsManager(user);
    }
}
Abgerufen von „https://ahrensburg.city/index.php?title=Kontaktformular_erstellen_mit_Spring_boot_mvc&oldid=1503“