ember.js 2.7.0中的多个布局

9nvpjoqh  于 2022-11-05  发布在  其他
关注(0)|答案(3)|浏览(121)

我想有两个布局,一个是供客人使用的,可以看到一些路线,如://contacts/rules等...另一个用于已验证用户,这意味着他们必须登录才能进入授权路线。如何为不同的路线组定义两个布局?

w8biq8rn

w8biq8rn1#

有一种方法可以利用Ember的路由器来解决这个问题,方法是将经过验证的路由嵌套在一个路由中。

Router.map(function() {
  this.route('contacts');
  this.route('rules');

  this.route('authenticated', { path: '/' }, function() {
    this.route('settings');
    this.route('profile');
  });
});

转到/contacts/rules将不需要任何身份验证,但转到/settings则需要。
注意path选项传递给了authenticated路由,因为我们将其设置为/,所以它不会出现在URL中,它将取代application.index。如果这听起来很奇怪,请阅读Ember.js教程中关于什么是索引页的内容。

nkhmeac6

nkhmeac62#

答案是维护一个保存用户状态的服务。

// services/user-state
import Ember from 'ember';

export default Ember.Service.extend({
  loggedIn: true
});

然后,根据您的组织方式,您可以将服务注入到控制器或路由中。
在您的模板中,您可以使用handlebars/htmlbars if辅助程式。

{{#if loggedIn}}
  render logged-in stuff... 
{{/else}}
  render message explaining that this is only for logged in users
{{/if}}

您也可以根据目前阶段作业数据,将使用者重新导向至其他路由。您可能有特定角色的整个路由,或者您可能有根据角色而有不同行为的样板部分。
如果你没有登录,那么你可能无法访问你的个人资料页面。这条路径可能是完全禁止的,或者它可能会把你重定向到一个登录页面。另一方面,也许它只是一个“登录”按钮组件或你的模板的一部分,如果你没有登录,它会显示“你好,警长”。
还有Ember插件提供了更强大的“角色”轮廓。想想一个博客页面,它可能有一个“编辑”按钮给实际用户,但有一个“标记”按钮给版主。在这种情况下,你不能只是有一个完全不同的路线嵌套在某处。
大多数认证插件/库都有一个带有某种会话状态的“服务”。但是 * 模板方面 *,基本思想就像一个JS if/else语句。

if (helpful) {
  this.upvote();
} else {
  // something else
}

我希望这对你有帮助。:)

x3naxklr

x3naxklr3#

看一看ember-simple-auth插件。
它有很多有用的类都是关于授权的,包括你的用例的mixin。如果你想让route只对登录的用户可见,简单地使用AuthenticatedRouteMixin,如下所示:

/app/routes/protectedRoute.js
import Ember from 'ember';
import AuthenticatedRouteMixin from 'ember-simple-auth/mixins/authenticated-route-mixin';

export default Ember.Route.extend(AuthenticatedRouteMixin);

相关问题