カスタムember-simple-authオーセンティケータの実装

Question

まず、私は熟練したJSデベロッパーではないので、私ができた明らかな間違いをお許しください。

私は、をリクエスト本体の一部として渡す必要があるOAuth2パスワード許可を使用して、Keycloakでユーザを認証するためのカスタム認証プロバイダを実装しようとしています。

import OAuth2PasswordGrant from 'ember-simple-auth/authenticators/oauth2-password-grant'; 
export default OAuth2PasswordGrant.extend({ 
    serverTokenEndpoint: 'http://localhost:8080/something/token', 
    makeRequest(url, data, headers = {}) { 
    data.client_id = 'my-app'; 
    return this._super(url, data, headers); 
    } 
}); 

私はこのアクションを呼び出すことにより、この認証を使用するコントローラを持っている：

actions: { 
    authenticate() { 
    let {username, password} = this.getProperties('username', 'password'); 
    this.get('session').authenticate('authenticator:oauth2', username, password).then(() => { 
     // Do something 
    }).catch((response) => { 
     // Show error 
    }); 
    } 
} 

これはFirefoxがハングアップし、私に応答のないスクリプトメッセージを表示します。

私はmakeRequest()方法からreturnを削除した場合、私はKeycloakへの呼び出しは、実際に私のトークンなどを含むオブジェクトを正しく返し、ブラウザのデバッガから見ることができます。しかし燃えさしの検査官は、未解決の約束に関連したいくつかのエラーを示しています。しかし、私はもはや約束を返さないためだと思います。

私はここで間違っていますか？

応答しないスクリプトの問題を修正するにはどうすればよいですか？

私の目標を達成する別の方法がありますか？

編集1：私はリターンここ

を削除するとき、これがあるが、実際に返されるオブジェクトです：

{ 
"access_token":"eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6ICJTRUNSd09fMlZWdGhxUVBUWnFxNHlqX0tKekxnOElSTjBrQkx5UTlacklrIn0.eyJqdGkiOiI1NDgzZDdkMi0zMDdhLTQyZjItYWUxZC0xYTZjMTZjOTM2ZjAiLCJleHAiOjE1MDgzMzE5MjAsIm5iZiI6MCwiaWF0IjoxNTA4MzMxNjIwLCJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjgwODAvYXV0aC9yZWFsbXMvc2Z4LWl0cmFuc2Zlci13ZWItYWdlbnQiLCJhdWQiOiJhZ2VudC13ZWItYXBwIiwic3ViIjoiMzZiMWY4OWMtNGYwMC00OTU1LWE0YzMtZWQ0NzZmZDU2OGM3IiwidHlwIjoiQmVhcmVyIiwiYXpwIjoiYWdlbnQtd2ViLWFwcCIsImF1dGhfdGltZSI6MCwic2Vzc2lvbl9zdGF0ZSI6IjQwODMxZWFhLTRmMmEtNDk2ZS05NDVkLTdiZWIxN2U0NmU0NCIsImFjciI6IjEiLCJhbGxvd2VkLW9yaWdpbnMiOlsiaHR0cDovL2xvY2FsaG9zdDo0MjAwIl0sInJlYWxtX2FjY2VzcyI6eyJyb2xlcyI6WyJ1bWFfYXV0aG9yaXphdGlvbiIsImJhY2stb2ZmaWNlLWFnZW50Il19LCJyZXNvdXJjZV9hY2Nlc3MiOnsiYWNjb3VudCI6eyJyb2xlcyI6WyJtYW5hZ2UtYWNjb3VudCIsIm1hbmFnZS1hY2NvdW50LWxpbmtzIiwidmlldy1wcm9maWxlIl19fSwibmFtZSI6IlVtYXIgS2hvbHZhZGlhIiwicHJlZmVycmVkX3VzZXJuYW1lIjoidW1hciIsImdpdmVuX25hbWUiOiJVbWFyIiwiZmFtaWx5X25hbWUiOiJLaG9sdmFkaWEiLCJlbWFpbCI6InVtYXJAYWlydmFudGFnZS5jby56YSJ9.eUJFklRiRjQPOC1rQLcqrljsSWmGXCpNNKqLJGAcvbnbwx8X0T1iqrmpFdyMN3EKRrIfTZyYRfcTEbpcBEjZcZtgDY9V0Ntvt4pvpUx_8Ey6I8xZQolHVwferjM30puLqG8MImADUimNrj3ghbJbAaCOJktIKgLnTIhDbkNb-8lzgbyq-rEP6lYAWjQ2OuOZnc8NQQ9CJiR9M1SB79SEmY2iQW9E_J8xo8BgZQ0GUBrhaWPo-Kn4RnlEcRNzVnlLHQKi5FM7Zpov3SMQUbAeLat38V41y09ap2XVCy7MfL_7-TrSlMx0TLrhWqPgA5aaXbmsT9_vKOoXNZoJ9bWCuA", 
"expires_in":300, 
"refresh_expires_in":1800, 
"refresh_token":"eyJhbGciOiJSUzI1NiIsInR5cCIgOiAiSldUIiwia2lkIiA6ICJTRUNSd09fMlZWdGhxUVBUWnFxNHlqX0tKekxnOElSTjBrQkx5UTlacklrIn0.eyJqdGkiOiIxNTUwNDIyZS02OThkLTQ5N2ItODZmYi00YmY5MTFlMTcwYzYiLCJleHAiOjE1MDgzMzM0MjAsIm5iZiI6MCwiaWF0IjoxNTA4MzMxNjIwLCJpc3MiOiJodHRwOi8vbG9jYWxob3N0OjgwODAvYXV0aC9yZWFsbXMvc2Z4LWl0cmFuc2Zlci13ZWItYWdlbnQiLCJhdWQiOiJhZ2VudC13ZWItYXBwIiwic3ViIjoiMzZiMWY4OWMtNGYwMC00OTU1LWE0YzMtZWQ0NzZmZDU2OGM3IiwidHlwIjoiUmVmcmVzaCIsImF6cCI6ImFnZW50LXdlYi1hcHAiLCJhdXRoX3RpbWUiOjAsInNlc3Npb25fc3RhdGUiOiI0MDgzMWVhYS00ZjJhLTQ5NmUtOTQ1ZC03YmViMTdlNDZlNDQiLCJyZWFsbV9hY2Nlc3MiOnsicm9sZXMiOlsidW1hX2F1dGhvcml6YXRpb24iLCJiYWNrLW9mZmljZS1hZ2VudCJdfSwicmVzb3VyY2VfYWNjZXNzIjp7ImFjY291bnQiOnsicm9sZXMiOlsibWFuYWdlLWFjY291bnQiLCJtYW5hZ2UtYWNjb3VudC1saW5rcyIsInZpZXctcHJvZmlsZSJdfX19.XgYSZWwfaHeY1yZZuwnQ5bj-0IHP4UEmiPTqaeCE1KVyjl3kZz3HJVisndtcKPr05kalS-M_NqU0TaYvbcZ_zesJRIga5sz4gGRqObUmUCUJoQ_iWoOhbM2SutiVnlfgJDACvOxegIcSvakZTgQsEcSweio_0kMFqi-2DYzFp6Rl0TpQ8vALLkc7rEOonUGyt7S4qQzkT-xB1_ZDlSVfm6mC-QKYNZhtqBT18P7MKxBhEgwrJtCytA_4ft7qNAbgvZ3kUohcbhzxGvtHej5RKHNI2wTzwK3IWHbkLWNndxSk_Lzj2-lCx380VpTkVpiDJfq5umjskOmI13dyPF7paA", 
"token_type":"bearer", 
"not-before-policy":0, 
"session_state":"40831eaa-4f2a-496e-945d-7beb17e46e44" 
} 

これは何燃えさしインスペクタで（約束）が示しています

ここにPromiseのスタックトレースがあります。

Ember Inspector ($E): authenticate/<@http://localhost:4200/assets/vendor.js:77927:9 
initializePromise@http://localhost:4200/assets/vendor.js:63591:7 
Promise@http://localhost:4200/assets/vendor.js:64067:35 
authenticate@http://localhost:4200/assets/vendor.js:77919:14 
authenticate@http://localhost:4200/assets/vendor.js:78528:14 
authenticate@http://localhost:4200/assets/vendor.js:79420:14 
authenticate@http://localhost:4200/assets/sfx-itransfer-web-agent.js:855:9 
join@http://localhost:4200/assets/vendor.js:20249:24 
run$1.join@http://localhost:4200/assets/vendor.js:37657:12 
makeClosureAction/</<@http://localhost:4200/assets/vendor.js:29073:16 
exports.flaggedInstrument@http://localhost:4200/assets/vendor.js:37087:14 
makeClosureAction/<@http://localhost:4200/assets/vendor.js:29072:15 
submit/<@http://localhost:4200/assets/vendor.js:70453:20 
tryCatch@http://localhost:4200/assets/vendor.js:63549:14 
invokeCallback@http://localhost:4200/assets/vendor.js:63562:15 
publish@http://localhost:4200/assets/vendor.js:63532:9 
@http://localhost:4200/assets/vendor.js:54458:16 
invoke@http://localhost:4200/assets/vendor.js:19948:17 
flush@http://localhost:4200/assets/vendor.js:19827:25 
flush@http://localhost:4200/assets/vendor.js:20019:25 
end@http://localhost:4200/assets/vendor.js:20128:26 
run@http://localhost:4200/assets/vendor.js:20212:21 
join@http://localhost:4200/assets/vendor.js:20219:24 
run$1.join@http://localhost:4200/assets/vendor.js:37657:12 
handleEvent/<@http://localhost:4200/assets/vendor.js:58233:18 
exports.flaggedInstrument@http://localhost:4200/assets/vendor.js:37087:14 
handleEvent@http://localhost:4200/assets/vendor.js:58232:17 
_Mixin$create.handleEvent@http://localhost:4200/assets/vendor.js:57385:12 
_bubbleEvent@http://localhost:4200/assets/vendor.js:57685:14 
setupHandler/<@http://localhost:4200/assets/vendor.js:57619:20 
dispatch@http://localhost:4200/assets/vendor.js:5546:16 
add/elemData.handle@http://localhost:4200/assets/vendor.js:5355:6 

Answer 1

実際、ソリューションは正しいと思われます。

私は、サーバーの応答または不一致の要求方法に問題がPOST/をGET 持っていると思います。これを解決するには、makeRequestの中で約束をデバッグしてみてください。だから、

return new RSVP.Promise((resolve, reject) => { 
    fetch(url, options).then((response) => { 
    response.text().then((text) => { //<-- here debug text 
     let json = text ? JSON.parse(text) : {}; 
     if (!response.ok) { //<-- and here debug response 
     response.responseJSON = json; 
     reject(response); 
     } else { 
     resolve(json); 
     } 
    }); 
    }).catch(reject); 

問題は、ここでは、ちょうどmakeRequestの全体の方法を書き換えて、あなたにカスタムfetchと自身の約束を追加する場合。

もう一つの方法はマニュアルに書いたように（必要に応じて）invalidate方法をrestore、authenticateをオーバーライドし、カスタムAuthenticator書くとすることです：https://github.com/simplabs/ember-simple-auth#implementing-a-custom-authenticator