使用带有torii和google-oauth2的ember-simple-auth重定向步骤

时间:2016-11-17 16:13:34

标签: redirect ember.js oauth2 ember-simple-auth torii

非常新的ember并仍然围绕着框架。使用ember-cli 2.9.1。

我正在尝试使用ember-simple-auth及其torii / google-oauth2身份验证器执行身份验证。此时,除最后一步之外,一切正常,认证成功后重定向。似乎没有完整描述这部分的教程或描述。

我看到身份验证成功执行,我收到一个身份验证代码,并将其存储在本地存储中。它持续不断刷新和所有这一切。但是,弹出窗口跳舞后,重定向永远不会发生。当我被带到我在我的应用程序和谷歌注册的redirectUri时,我仍然坐在登录页面上。

此外,在弹出式舞蹈中,出现两个弹出窗口 - 第一个是来自Google的内容,第二个是在地址栏中显示我的redirectUrl的窗口。但是,两个窗口都快速关闭,重定向不会发生在我的主登录页面上。在第二个弹出窗口中提供的主登录页面中必定存在我无法正确处理的内容。

以下是相关代码。非常感谢你的帮助!

配置/ environment.js:

// config/environment.js
var ENV = {
...
    torii: {
      providers: {
        'google-oauth2': {
          apiKey: '189573826905-p886jmjpam371fjoitktoec8hretkoo8.apps.googleusercontent.com',
          redirectUri: 'https://localhost:4200/app/search',
        }
      }
    },
...
};

应用/组件/谷歌登入-button.js

// app/components/google-signin-button.js
import Ember from 'ember';

export default Ember.Component.extend({
  session: Ember.inject.service(),

  didInsertElement() {
    Ember.$.getScript('https://apis.google.com/js/platform.js');
  },

  actions: {
    authenticate_google() {
      this.get('session').authenticate('authenticator:torii', 'google-oauth2');
    },
    invalidateSession() {
      this.get('session').invalidate();
    }
  }

});

应用程序/模板/组件/谷歌登入-button.hbs

// app/templates/components/google-signin-button.hbs
<meta name="google-signin-client_id" content="755937126905-p886jmjpam371fjoitktoec8hretkoo8.apps.googleusercontent.com">

<div {{action 'authenticate_google'}}>
  <h2 id="title">google oauth2 test</h2>
  <div google-signin-button class="g-signin2"/>
</div>

{{#if session.isAuthenticated}}
  <a {{action 'invalidateSession'}}>Logout</a>
{{else}}
  {{#link-to 'login'}}Login{{/link-to}}
{{/if}}


{{yield}}

1 个答案:

答案 0 :(得分:0)

问题结果是三重。

1)需要将操作移出路由器

2)ApplicationRouteMixin需要混合到应用程序路由中,以便ember-simple-auth按the API documentation自动执行重定向:

// app/routes/application.js
import Ember from 'ember';

export default Ember.Component.extend(ApplicationRouteMixin, {
  session: Ember.inject.service(),
...

3)需要删除Google登录按钮以避免第二次弹出窗口;我最终删除了整个东西,只是使用了谷歌的品牌形象 - 链接到按钮源及其相关的JS创建了我的布局问题,所以通用最终变得更加简单;以这种方式加载时间也快得多