在ember.js中构建一个非常简单的auth系统

时间:2014-06-13 01:58:59

标签: javascript authentication ember.js

我试图在Ember.js 1.5中开发一个非常简单的auth系统但是我在前端部分遇到了一些麻烦。

我很贪图,所以请原谅我的无知。

所以这是我的路线及其实施

App.Router.map(function() {
    this.route('login');
    this.resource("posts");

});

App.AuthenticatedRoute = Ember.Route.extend({
    beforeModel: function(transition) {
        if (Ember.isEmpty(App.Auth.get('authToken'))) {
            this.transitionTo('login');
        }
    }
});

App.LoginRoute = Ember.Route.extend({
    renderTemplate: function() {
        this.render('login_template');
    },
    actions: {
        createSession: function() {
            var router = this;
            var email = this.controller.get('email_login');
            var password = this.controller.get('password_login');


            if (!Ember.isEmpty(email) && !Ember.isEmpty(password)) {


                $.post('/api/v1/session', {email: email, password: password}, function(data) {
                    var authToken = data.session.auth_token;
                    var user_id = data.session.user_id;

                    App.Store.authToken = authToken;
                    App.Auth = Ember.object.create({
                        authToken: authToken,
                        user_id: user_id
                    });

                    router.transitionTo('index');
                });



            }
        }
    }
});

App.ApplicationRoute = App.AuthenticatedRoute.extend({

    model: function() {
        return this.store.find('post');
    }

});

App.ProceduresRoute = App.AuthenticatedRoute.extend({
    model: function() {
        return this.store.all('post');
    }
});


// Ommitting the models because they aren't necessary for this question

因此,当然主要关注的是App.Auth最初是未定义的。我已经从教程中复制了大部分代码,但我不知道ember是否有session variables我可以初始化。

在任何情况下,我总是可以在开头用App.Auth定义初始值为null的属性,但这可能会产生其他我不知道的后果(同样我是新手烬)。

所以我的问题是如何以一种很好的方式正确存储来自服务器(auth_token和user_id)的响应。此外,如果未设置login,则将用户重定向到auth_token路由(这是我尝试对经过身份验证的路由部分执行的操作)。

如果你不能提供完整的答案,即使是一些提示/评论也会非常有帮助,谢谢!

1 个答案:

答案 0 :(得分:0)

我可能会使用容器注册一个auth管理器,并将其注入所有内容。

App.initializer({
    name: "auth",
    before: ['ember-data'],
    initialize: function (container, application) {
       var auth = Ember.Object.extend({
         isAuthenticated: Em.computed.notEmpty('authToken')
       });

      application.register("my:authToken", auth);
      application.inject("controller", "auth", "my:authToken");
      application.inject("route", "auth", "my:authToken");
      application.inject("store:main", "auth", "my:authToken");
      application.inject("adapter", "auth", "my:authToken");
    }
});

然后在您的适配器上,您可以轻松地连接标题(如果需要)

App.ApplicationAdapter = DS.RESTAdapter.extend({
  headers: function() {
    return {
      authToken: this.get('auth.authToken')
    };
  }.property("auth.authToken")
});

您可以从任何控制器/路线轻松访问this.auth

中的身份验证属性
App.AuthenticatedRoute = Ember.Route.extend({
    beforeModel: function(transition) {
        if (!this.auth.get('isAuthenticated')) {
            this.transitionTo('login');
        }
    }
});

以下是注入的示例(注意,我使用的是Ember Data 1.0 beta 8,其中一些功能,标题,在旧版本的Ember Data中不可用)。

http://emberjs.jsbin.com/OxIDiVU/639/edit