Restrictionを使用したSpringの基本認証

Question

私はSpringのoauthセキュリティでRestangularを使用しています。クライアント側ではログインリクエストにRestangularを使用しています。

OAuth2ServerConfigurationにおけるコード：

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

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

郵便配達でログインこれらの構成を必要とします：

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. 

これは私が角度JS Restangular呼び出しでこれらの設定を使用する方法を理解することはできません成功login.butを行います。

現在、これで試しています。コントローラーで

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

：：Configで

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

しかし、私はこのエラーを取得しています。ブラウザで

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

。

注：このリソースは保護されていません。

任意の解決策???

アップデート：私は春のログインバックエンドが上にある間の角度と私のフロントエンドは（XAMPPを介して）ローカルホスト上で独立して実行されていることを加えたメイン情報を忘れてしまったはlocalhost：8080 ..

エラーでネットワーク]タブ：

2 -

UPDATED

、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

：

をそれのためにすでに答えがたくさん、CORSの問題のようですが、XAMPPを使用して、あなたのケースで、あなたのapacheサーバを設定する必要があります。

https://enable-cors.org/server_apache.html。更新前の

前の回答：

restangularを使用する利点は、よりセマンティックな方法とネストされたリソースを取得する機能でリソースを管理する能力です。これらの利点はすべて、oauth2プロバイダからトークンを取得するだけの呼び出しには実際には適用されません。

私はこの特定の呼び出しにrestangularを使用することを忘れてしまいます（あなたのアプリケーションのそれ以外にもこれを使用できます）。この呼び出しを単純な$ http.postに変換します。

$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 
       }); 
      }); 

だから、あなたはたったの$ http.postを使用し、その応答に取得したトークンを使用するために、角にデフォルトのヘッダーを設定します。

乾杯、

Answer 2

Restangularカスタムポストを使用できます。 documentationを参照してください。

例：

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 
    } 
); 

はそれが私が同じドメイン（：8080ローカルホスト上の両方）にフロントエンドでのhttpでもrestangularと同じ設定を使用していた