EmberFire Google 身份验证 - 请检查设置

EmberFire Google Authentication - Review Setup Please

总结:

我想通过 Google 登录

将 EmberJS 应用程序连接到 Firebase

版本:

Ember : 3.1.2, Ember数据:3.1.1, 火力地堡:3.9.0

config/environment.js

'use strict';

module.exports = function(environment) {
  let ENV = {
    modulePrefix: 'myApp',
    environment: environment, // : environment,
    rootURL: '/',
    locationType: 'auto',
    firebase: {
      apiKey: "CORRECT_API_KEY",
      authDomain: "CORRECT_DOMAIN.firebaseapp.com", 
      databaseURL: "https://CORRECT_PREFIX.firebaseio.com", 
      projectId: "CORRECT_ID",
      storageBucket: "CORRECT_BUCKET.appspot.com",
      messagingSenderId: "CORRECT_NUMBER"
    },
    torii: {
      sessionServiceName: 'session'
    },
    EmberENV: {
      FEATURES: {
        // Here you can enable experimental features on an ember canary build
        // e.g. 'with-controller': true
      },
      EXTEND_PROTOTYPES: {
        // Prevent Ember Data from overriding Date.parse.
        Date: false
      }
    },

    APP: {
      // Here you can pass flags/options to your application instance
      // when it is created
    }
  };

  if (environment === 'development') {
    // ENV.APP.LOG_RESOLVER = true;
    // ENV.APP.LOG_ACTIVE_GENERATION = true;
    // ENV.APP.LOG_TRANSITIONS = true;
    // ENV.APP.LOG_TRANSITIONS_INTERNAL = true;
    // ENV.APP.LOG_VIEW_LOOKUPS = true;
  }

  if (environment === 'test') {
    // Testem prefers this...
    ENV.locationType = 'none';

    // keep test console output quieter
    ENV.APP.LOG_ACTIVE_GENERATION = false;
    ENV.APP.LOG_VIEW_LOOKUPS = false;

    ENV.APP.rootElement = '#ember-testing';
    // ENV.APP.autoboot = false;
  }

  if (environment === 'production') {

  }

  return ENV;
};

app/torii-adapters/application.js

import ToriiFirebaseAdapter from 'emberfire/torii-adapters/firebase';

export default ToriiFirebaseAdapter.extend({

});

app/adapters/application.js

import Ember from 'ember';
import FirebaseAdapter from 'emberfire/adapters/firebase';

export default FirebaseAdapter.extend({
  firebase: Ember.inject.service()
});

app/routes/application.js

import Ember from 'ember';

export default Ember.Route.extend({
  session: Ember.inject.service(),
  beforeModel: function() {
    return this.get('session').fetch().catch(function() {});
  },
  actions: {
    signIn: function(provider) {
      this.get('session').open('firebase', { provider: provider}).then(function(data) {
        console.log(data.currentUser);
      });
    },
    signOut: function() {
      this.get('session').close();
    }
  }
});

app/templates/login.hbs

{{#if session.currentUser}}
    <div>
        <button class="sign-out" {{action "signOut"}}>Sign Out</button>
    </div>
{{else}}
  <div>
    <button class="auth-as-google"   {{action "signIn" "google" redirect}}>Sign in with Google</button> 
  </div>
{{/if}}

<div class="jumbo">
    <h3>User Data</h3>
    <table class="user-data-table">
        <tr>
            <td class="bold">session.isAuthenticated</td>
            <td class="user-data-is-authenticated">
                {{#if session.isAuthenticated}}
                    {{session.isAuthenticated}}
                {{else}}
                    false
                {{/if}}
            </td>
        </tr>
        {{#if session.currentUser}}
            <tr>
                <td class="bold">session.provider</td>
                <td class="user-data-provider">
                    {{session.provider}}
                </td>
            </tr>
            <tr>
                <td class="bold">session.uid</td>
                <td class="user-data-uid">
                    {{session.uid}}
                </td>
            </tr>
        {{/if}}
    </table>
</div>

浏览器错误:

Mirage:您的 Ember 应用程序尝试 POST 'https://www.googleapis.com/identitytoolkit/v3/relyingparty/verifyAssertion?key=CORRECT_API_KEY',但没有定义处理此请求的路由。在您的 mirage/config.js 文件中定义一个匹配此路径的路由。您是否忘记添加命名空间?

控制台错误:

.../app/routes/application.js 32:9 错误意外的控制台语句 no-console

问题:

请查看并提供帮助。我搜索了这些错误并修改了 Mirage config.js,但不确定是否有必要(或者我是否正确地这样做)。

Mirage 会为任何未在其配置中定义的访问路由抛出错误。由于您使用的是 firebase 的 FQDN,因此您需要在配置末尾添加 passthrough

this.passthrough('https://www.googleapis.com/**');

我遇到了同样的问题,结果发现解决方法很简单:禁用 Mirage。在您的 Ember 应用的 config/environment.js 中,添加:

  if (environment === 'development') {
    ENV['ember-cli-mirage'] = {
      enabled: false
    };
  }

这将停止尝试通过 Mirage。