Reactjs彈簧啓動安全

Question

我已經開發了一個應用程序，前端有反應，後端有彈簧啓動。 我還沒有實現任何登錄頁面。我開始尋找一個例子來開始。在這個環境中沒有太多例子，很多例子都過時了。 有沒有人能指點我一個例子？或者告訴我至少它是如何做到的。 我正在使用的反應0.14.0

Answer 1

React不會爲您做出任何有關您的後端或它如何交付的決定（您可以使用字面上任何可以將HTTP/TCP發送到瀏覽器的任何東西）。如果您使用node.js作爲後端，您可以使用運行時執行JavaScript並使用React-DOM可用的一些方法來進行服務器端渲染。除此之外，React只運行客戶端，一旦實例化並開始在瀏覽器中運行，它將「接管」DOM操作。

就登錄和安全性而言，這完全取決於您使用的任何語言和服務器框架。您可以使用vanilla JS或HTTP庫向您的服務器發送憑證，但React不關心服務器端的安全性。

希望有幫助！

Answer 2

在側ReactJs登錄組件上的登錄表單的提交呼叫處理功能：

handleClick(event){ 
    axios.post("http://localhost:8080/username="+this.state.username+"&password="+this.state.password).then(function (response) { 
     if(response.data.code === 200){ 
      window.location('http://localhost:8080/hello') 
     } else { 
     console.log(response.data.code); 
     } 
    }) 
    .catch(function (error) { 
     console.log(error); 
    }); 
    } 

內部安全配置文件下面的代碼使用方法如下：

 @Override 
     protected void configure(HttpSecurity http) throws Exception { 
      http.authorizeRequests() 
       .antMatchers("/hello/**").hasRole("ADMIN") 
       .anyRequest().permitAll() 
       .and() 
        .formLogin().loginPage("/") 
         .usernameParameter("username").passwordParameter("password") 
         .defaultSuccessUrl("hello", true) 
         .and() 
         .httpBasic() 
       .and() 
        .csrf().disable(); 
      } 

     @Autowired 
     public void configureGlobal(AuthenticationManagerBuilder auth) throws Exception { 
        auth 
        .inMemoryAuthentication() 
         .withUser("user").password("user").roles("USER") 
      .and() 
        .withUser("admin").password("admin").roles("ADMIN"); 
       }