2

我在使用 torii 适配器进行 facebook 身份验证时遇到问题，错误是：“Torii 适配器必须实现open才能打开会话”。

我访问了许多教程，并尝试了所有介绍的方法，但其中大多数通常是旧的 ember 代码，而且似乎没有一个真正起作用。

当前状态：我能够登录，我得到 facebook 弹出窗口并且我可以授权。

使用 fiddler，我还可以看到来自 API 的响应，其中包含一个 JSON 响应，其中包含来自我进行身份验证的用户的所有凭据。在 Firebase 控制台中，我可以看到授权用户、重置其密码、拒绝访问、...

所有这一切让我相信这“仅仅是”一个前端问题，我似乎无法建立一个适当的“会话”来处理。

我的最终目标是获取相关的用户数据并将其作为“用户”条目传输到我的 Firebase 后端，从而允许网站访问者快速注册，但我会非常高兴有一个活跃的会话，这样我就可以剩下的我自己解决。

作为一个前端菜鸟（我通常编写 C# 代码），Ember 可能不是掌握它的最佳选择，但我已经到此为止了，我不打算让它全部滑落并拿起一个不同的框架。

我的代码：

配置/环境.js

firebase: {
    apiKey: 'xxxxxxx',
    authDomain: 'myappname.firebaseapp.com',
    databaseURL: 'https://myappname.firebaseio.com',
    storageBucket: 'myappname.appspot.com',
    messagingSenderId: '1234567890'
  },

    torii: {
      sessionServiceName: 'session'
    }

torii-adapters/application.js （我已经改变了很多，我什至不记得原始代码是什么，因为我在这里改变/添加/删除的东西似乎根本没有做任何事情。）

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

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

路线/application.js

import Ember from 'ember';

export default Ember.Route.extend({
    beforeModel: function() {
    return this.get('session').fetch().catch(function() {
    });
  },

  actions:{

    login: function(provider) {
      this.get('session').open('firebase', {
        provider: provider,
      }).then(function(data) {
        console.log(data.currentUser);
      });
    },

    logout: function() {
      this.get('session').close().then(function() {
        this.transitionTo('application');
      }.bind(this));
    }
  }
});

应用程序.hbs

<div class="container">
  {{partial 'navbar'}}
<a {{action "signIn" "facebook"}} class="btn">{{fa-icon "facebook"}}</a>
<a {{action "signIn" "twitter"}} class="btn">{{fa-icon "twitter"}}</a>
<a {{action "signIn" "github"}} class="btn">{{fa-icon "github"}}</a>
<a {{action "signIn" "google"}} class="btn">{{fa-icon "google"}}</a>
  {{outlet}}
</div>

编辑 1

重新启动 ember 服务器后，上面的代码给了我更多的错误。这是我烦恼的原因吗？所有看似没有改变的更改，直到服务器重新启动后才注册？如果是这样的话，我可能已经通过了大约一百次正确的解决方案......

编辑 2

更改了代码以反映实际问题。以前的代码被搞砸了，但我从来没有意识到它，因为它直到服务器重新启动后才恢复。

编辑 3 找到并尝试了这个，但无济于事：https ://stackoverflow.com/a/32079863/4309050

4

3 回答 3

2

这是Lorem Ipsum Dolor 的答案，但已针对 Ember 3.16+ 进行了更新

// Inside routes/application.js
import Route from '@ember/routing/route';
import { inject as service } from '@ember/service';

export default class ApplicationRoute Route {
  @service session;
    
  async beforeModel() {
    try {
      return this.session.fetch();
    } catch {}
  }
}

请注意，在 Ember 3.16+ 中，不建议向您的 Route 添加操作。相反，您可以将它们添加到控制器或组件上下文中：

import Component from '@glimmer/component';
import { inject as service } from '@ember/service';
import { action } from '@ember/object';

export default class LoginLogout extends Component {
  @service session;
  @service router;

  @action
  async login(provider)  {
    let data = await this.session.open('firebase', { provider });

    console.log(data.currentUser);
  }

  @action
  async logout() {
    await this.session.close();

    this.router.transitionTo('application');
  }
}

注意添加了路由器服务。Router 服务是我们在应用程序中与路由交互的方式。

import ToriiFirebaseAdapter from 'emberfire/torii-adapters/firebase';
    
export default class MyAdapter extends ToriiFirebaseAdapter {

}
于 2020-06-21T15:29:04.757 回答
1

注意：对于 Ember 3.16+ 应用程序，这里是相同的代码，但具有更新的语法/模式：https ://stackoverflow.com/a/62500685/356849

下面是针对 Ember < 3.16 的，即使代码可以作为 3.16+ 完全向后兼容，但编写旧代码并不总是很有趣。

尝试在您的应用程序路由中注入服务并移动散列的beforeModel外部，actions

// Inside routes/application.js

export default Ember.Route.extend({
  session: Ember.inject.service(), // (1)

  beforeModel: function() {
    return this.get('session').fetch().catch(function() {});
  },

  actions:{
    login: function(provider) {
      this.get('session').open('firebase', {
        provider: provider,
      }).then(function(data) {
        console.log(data.currentUser);
      });
    },

    logout: function() {
      this.get('session').close().then(function() {
        this.transitionTo('application');
      }.bind(this));
    }
  }
});

我昨天完成了同样的事情（Firebase Torii Auth），请尝试仔细遵循指南。指南中唯一缺少的是session手动注入服务。

还记得session你在environment.js文件中声明的吗？您必须注入它才能使其可用

session: Ember.inject.service(), // (1)

https://github.com/firebase/emberfire/blob/master/docs/guide/authentication.md

在我的 ToriiFirebaesAdapter 内部，

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

export default ToriiFirebaseAdapter.extend({
});
于 2017-04-01T01:03:12.193 回答
1

我有同样的问题，我注意到我torii-adapters/application.js位于pods结构下（因为我使用它）。所以我将文件夹移动到torii-adapters文件app夹，一切都开始工作了。

于 2017-09-24T15:46:56.300 回答