2016-09-05 3 views
3

フロントエンドできれいな角度でSpring起動アプリケーションを構築したい。私の要件は次のとおりです。Spring起動時の角度アプリケーションセキュリティの処理方法

  1. アプリケーションが
  2. ログインフォーム
  3. にいくつかのページが含まれており、電話を休まが

これらはかなり基本的な要件ですが、私はの可能性に迷ってしまいましたが保護されなければならないベースのブラウザですWebアプリケーションのセキュリティ確保。それを行う標準的な、推奨された方法はありますか?私は実際にhttps://spring.io/guides/tutorials/spring-security-and-angular-js/からチュートリアルに従おうとしましたが、それを記述するのではなく、いくつかの可能な解決方法を混在させるので、混乱します。

ありがとうございます。

+0

JHipsterを参考にしてください:https://jhipster.github.io/ – TheKojuEffect

答えて

1

私は私がそう最初Thymleafを使用し、コンフィギュレーションクラスに

import org.springframework.beans.factory.annotation.Autowired; 
import org.springframework.context.annotation.Configuration; 
import org.springframework.security.config.annotation.authentication.builders.AuthenticationManagerBuilder; 
import org.springframework.security.config.annotation.method.configuration.EnableGlobalMethodSecurity; 
import org.springframework.security.config.annotation.web.builders.HttpSecurity; 
import org.springframework.security.config.annotation.web.builders.WebSecurity; 
    import org.springframework.security.config.annotation.web.configuration.EnableWebSecurity; 
    import org.springframework.security.config.annotation.web.configuration.WebSecurityConfigurerAdapter; 


    import javax.sql.DataSource ; 

    @Configuration 
    @EnableWebSecurity 
    @EnableGlobalMethodSecurity 
    public class SecurityConfig extends WebSecurityConfigurerAdapter { 


@Autowired 
Securityhandler successHandler ; 


//this method to make datasource 
@Autowired 
public void GlobalConfig(AuthenticationManagerBuilder auth,DataSource dataSource) throws Exception { 
auth.jdbcAuthentication() 


.dataSource(dataSource) 
    .usersByUsernameQuery("SELECT \"user\" AS principal , \"Password\" AS credentials , true FROM \"usersss\" WHERE \"user\" = ? ") 
      .authoritiesByUsernameQuery("SELECT u.\"user\" AS principal , r.role as role FROM \"UTILISATEUR\" u ,\"Role\" r where u.id_role=r.id_role AND \"user\" = ? "); 

} 
     //this one to ignore security for your ressources 
    @Override 
public void configure(WebSecurity web) throws Exception { 
    web.ignoring() 
    .antMatchers("/bootstrap/**","/css/**"); 

} 
@Override 
protected void configure(HttpSecurity http) throws Exception { 
http 

    .csrf().disable() 
    .authorizeRequests() 
    .anyRequest() 
     .authenticated()   
      .and() 
      .formLogin() 
     //this one add to login page 
      .loginPage("/login") 
      .permitAll() 
      .successHandler(successHandler) 
      .and()  
      .logout() 
      .invalidateHttpSession(true) 
      .logoutUrl("/logout") 
      .permitAll(); 
} 

} 

を行う必要があり、今thymleafがでページを解決しなければならなかった、私の認証にangularjsを使用していない私の場合には同じ問題を持っていましたuri/login ので、あなたが

import org.springframework.context.annotation.Configuration; 
import org.springframework.web.servlet.config.annotation.ViewControllerRegistry; 
import org.springframework.web.servlet.config.annotation.WebMvcConfigurerAdapter; 
@Configuration 
public class WebMVCconfig extends WebMvcConfigurerAdapter { 

@Override 
public void addViewControllers(ViewControllerRegistry registry) { 
    registry.addViewController("/login").setViewName("login"); 
    registry.addViewController("/logout").setViewName("login"); 

} 
} 
以下、このような別のクラスを作成する必要が viewresolver

を追加する必要がありますtemplatesこの

<html xlmns:th="http://www.thymeleaf.org" xml:lang="fr"> 

のようにDOCTYPEでthymleafを宣言する必要があり、ログインフォーム

<form name="form" id="form" class="form-horizontal" th:action="@{/login}" method="post"> 

       <div class="input-group"> 
        <span class="input-group-addon"><i class="glyphicon glyphicon-user"></i></span> 
        <input id="username" type="text" class="form-control" name="username" value="" required="" placeholder="Nom de l'utilisateur"/>           
       </div> 

       <div class="input-group"> 
        <span class="input-group-addon"><i class="glyphicon glyphicon-lock"></i></span> 
        <input id="password" type="password" class="form-control" name="password" required="" placeholder="Mot de passe"/> 
       </div>                 

         <div th:if="${param.error}" class="alert alert-default ">  
      <i class="glyphicon glyphicon-exclamation-sign"></i> 
       <b> Nom d'utilisateur et mot de passe invalide.</b> 

      </div> 

         <div th:if="${param.logout}" class="alert alert-default ">  
       <i class="glyphicon glyphicon-exclamation-sign"></i> 
       <b> Vous venez de déconnecter</b> 

      </div> 
       <div class="form-group"> 
        <!-- Button --> 
        <div class="col-sm-12 controls"> 
         <button type="submit" href="#" class="btn btn-success pull-right"><i class="glyphicon glyphicon-log-in"></i> Connéxion</button>       
        </div> 


       </div> 

      </form>  

で終了になりました春のセキュリティはの多くを提供してという名前のフォルダの下のHTMLページで最後に

あなたのアプリケーションにあなたがアプリケーションを追加しなければならなかった場合には、このソリューションはあなたが入力したすべてのURLにログインページを提供することをあなたに伝えようとしているのであれば、別のフロントエンドのセキュリティangleJsで異なる役割を持つ複数のユーザーが特権にアクセスすることはできませんurls

+1

私はあなたの答えを完全に理解しているとは思えませんが、私はthymeleaf +春のセキュリティと一緒に行き、この設定で角度を統合します。ありがとう – xwhyz

関連する問題