스프링 부트 및 Vue.js가 포함된 사용자 지정 로그인 페이지

스프링 부트 및 Vue.js가 포함된 사용자 지정 로그인 페이지

로 만들어진 사용자 지정 로그인 페이지를 사용하려는 경우Bootstrap-Vue그리고Vue.js, my와 함께spring boot백엔드사용하고 있다.Spring Security.

이것은 내 사용자 정의 로그인 양식이다.

<b-form @submit="onSubmit" >
  <b-form-group id="exampleInputGroup1" label="Username:" label-for="exampleInput1">
    <b-form-input id="exampleInput1" type="username" v-model="form.username" required placeholder="Enter username"></b-form-input>
    </b-form-group>
    <b-form-group id="exampleInputGroup2" label="Password:" label-for="exampleInput2">
      <b-form-input id="exampleInput2" type="password" v-model="form.password" required placeholder="Enter password"></b-form-input>
    </b-form-group>
  <b-button type="submit" variant="primary">Login</b-button>
  <b-button type="reset" variant="secondary">Register</b-button>
</b-form>

나의SecurityConfig수업은 마치

@Override
protected void configure(HttpSecurity http) throws Exception {
    http.authorizeRequests()
        .antMatchers("**").permitAll()
        .anyRequest().authenticated().and()
        .formLogin()
        .loginPage("/app");
}

@Bean
public PasswordEncoder passwordEncoder() {
    return new BCryptPasswordEncoder(11);
}

내 프로젝트가 데이터베이스에 연결되어 있기 때문에 내 데이터베이스에서 사용자와의 로그인을 테스트할 수 있다.스프링 보안의 기본 로그인 페이지에서 이미 작동했다.내 질문은 어떻게 그것을 사용자 정의 양식과 함께 사용하느냐 하는 것이다.

참조URL: https://stackoverflow.com/questions/46638029/custom-login-page-with-spring-boot-and-vue-js