Basis-Authentifizierung des Frühlings mit Restangular

Question

Ich benutze Restangular mit Spring oauth Sicherheit und auf der Clientseite benutze ich Restangular für Login-Anfrage.

-Code in OAuth2ServerConfiguration:

@Override 
    public void configure(ClientDetailsServiceConfigurer clients) throws Exception { 
     clients 
      .inMemory() 

       .withClient("clientapp") 
        .authorizedGrantTypes("password", "refresh_token") 
        .authorities("USER") 
        .scopes("read", "write") 
        .secret("abc"); 
     } 

Anmeldung mit Postbote braucht diese Konfigurationen:

1-Set Authorization as "Basic Auth". 
2-Set username,password as {"username":"clientapp","password":"abc"}//credentials to access server side 
3-In request body through "x-www-form-urlencoded" three parameters are sent. 
    {"username":"abc@gmail.com","password":"abc123","grant_type":"password"}//credentials to login which are checked from database. 

Dies wird eine erfolgreiche tun login.but ich kann nicht verstehen, wie diese Konfigurationen in Angular JS Restangular Aufruf zu verwenden, .

derzeit versuche ich mit diesem.

In Config:

RestangularProvider.withConfig(function (RestangularConfigurer) { 
    return RestangularConfigurer.setDefaultHeaders({ "Authorization": "Basic Y2xpZW50YXBwOkxNUw==", 
     "username":"clientapp", 
     "password":"abc", 
     "Content-type": "application/x-www-form-urlencoded; charset=utf-8" 
      }); 

In Controller:

 Restangualar.all("oauth/login").post({username;$scope.user.username, 
    password:"$scope.user.password","grant_type":"password"}).then(function(){ 
console.log(res); 
    }); 

Aber ich bin immer diese Fehlermeldung:

error:"unauthorized",error_description:"Full authentication is required to access this resource" 

in Browser.

Hinweis: Diese Ressource ist nicht gesichert.

Jede Lösung ???

Update: ich hinzugefügt Haupt Informationen vergessen, dass mein Frontend mit Winkel wird (durch xampp) während Frühling Login Backend ist auf localhost unabhängig auf localhost läuft: 8080 ..

Fehler in Netzwerk-Register:

2-

public void configure(HttpSecurity http) throws Exception { 
     // @formatter:off 
     http 
      .authorizeRequests() 
      .anyRequest().permitAll() 
      //.antMatchers("/users").permitAll() 
     .antMatchers(HttpMethod.OPTIONS, "/oauth/token").permitAll() 
     .and().csrf().disable(); 
    } 

3-

endpoints 
      .tokenStore(this.tokenStore) 
      .authenticationManager(this.authenticationManager) 
      .userDetailsService(userDetailsService) 
      .addInterceptor(new HandlerInterceptorAdapter() { 

       public boolean preHandle(HttpServletRequest hsr,   HttpServletResponse rs, Object o,FilterChain chain) throws Exception { 
        rs.setHeader("Access-Control-Allow-Origin", "*"); 
        rs.setHeader("Access-Control-Allow-Methods", "GET,OPTIONS,POST"); 
        // rs.setHeader("Access-Control-Max-Age", "7200"); 
        rs.setHeader("Access-Control-Allow-Headers", "Origin, X- Requested-With, Content-Type, Accept, Authorization"); 
        HttpServletRequest httpServletRequest = (HttpServletRequest) hsr; 
        if (httpServletRequest.getMethod().equalsIgnoreCase("OPTIONS")) { 
         chain.doFilter(hsr, rs); 
        } else { 
         // In case of HTTP OPTIONS method, just return the response 
         return true; 
        } 
        return false; 
        } 
       }); 

Answer 1

AKTUALISIERT:

Es scheint ein CORS Problem, viele Antworten für sie schon zu sein, aber in Ihrem Fall XAMPP verwenden müssen Sie Ihre Apache-Server konfigurieren:

https://enable-cors.org/server_apache.html.

vorherige Antwort BEFORE UPDATE:

Der Vorteil restangular ist die Möglichkeit, Ressourcen in einer semantischen Art und Weise und die Fähigkeit, zu verwalten, um verschachtelte Ressourcen zu erhalten. All diese Vorteile gelten nicht wirklich für einen Anruf, nur um ein Token von einem oauth2-Provider abzurufen.

Ich würde empfehlen, die Verwendung von Restangular für diesen bestimmten Anruf zu vergessen (Sie können es immer noch für alles andere in Ihrer Anwendung verwenden) und wandeln diesen Anruf in eine einfache $ http.post um.

$http.post('oauth/login', 
      { username;$scope.user.username, 
       password:"$scope.user.password", 
       "grant_type":"password" 
      }, 
      { 
       headers: { "Authorization": "Basic Y2xpZW50YXBwOkxNUw==", 
          "username":"clientapp", 
          "password":"abc", 
          "Content-type": "application/x-www-form-urlencoded; charset=utf-8" 
         } 
      }) 
      .then(function(response) { 
       Restangular.setDefaultHeaders({ 
        "Authorization": "Bearer " + response.token 
       }); 
      }); 

So verwenden Sie nur $ http.post, und auf seine Antwort die Standardschriften in Winkel gesetzt den abgerufenen Token zu verwenden.

Cheers,

Answer 2

Sie Restangular benutzerdefinierte Post verwenden können. Siehe documentation.

Beispiel:

Restangular.service("/oauth/login").one().customPOST(
    {}, 
    '', 
    { 
    // Params... 
    grant_type: 'password', 
    client_id: 'clientapp', 
    client_secret: 'abc', 
    username: 'abc@gmail.com', 
    password: 'abc123', 
    scope: 'read, write' 
    }, 
    { 
    // headers... 
    }).then(
    function (response) { 
     // Manage successfull response 
    }, 
    function() { 
     // Manage error response 
    } 
); 

Hoffe, dass es