0

我对骨干比较陌生。我只是想针对服务器对用户进行身份验证。

形式

<form action="/login" id="login-form">
    <input type="text" id="username"  name="username" >
    <input type="password" id="password" name="password" >
    <a id="login">Sign in</a>
</form> 

这是移动应用程序客户端表单。

点击登录

单击登录应该将表单凭据、用户名和密码发布到 restful api 公开。

我的宁静服务

我的网络服务是单独托管的。它可以作为

  http://myservice.com/api/auth.

当我发布

{ "username" : "admin", "password" : "abc" }

如果身份验证成功,它会返回

{“id”:1,“用户名”:“管理员”,“密码”:“abc”}

如果身份验证失败,则返回

{ "message": "用户名或密码无效。"}

我的尝试

我创建了这样的模型

define(['jquery', 'backbone', 'underscore'], function($, Backbone, _){

var AuthModel = Backbone.Model.extend({
    defaults: {
        username: "",
        password: ""
    },
    url:"http://myservice.com/api/auth"
});

return AuthModel;
});

我创建了这样的视图:

 define([
    'jquery', 
    'backbone',
    'underscore',
    'models/index-model'], 
  function($, Backbone, _,  AuthModel){
 var LoginView = Backbone.View.extend({
     model: new AuthModel(),
     el: $("#login-form"),
     events: {
         "click #login": "login"
     },

     login: function(){
         this.model.save({username: this.$el.find("#username"), 
         password: this.$el.find("#password")}, {
             success: function() {
                 alert('success');
             },

             error: function() {
                 alert('fail');
                 /* handle the error code here */
             }
         });
     }
});

return new LoginView();
 });

这总是警报失败。

我的假设

我想我可能在两个地方错了。一是我很困惑如何连接到单独托管的服务。我们通常设置

url:"api/auth"

现在,我正在尝试将其设置为

网址:“ http://myservice.com/api/auth

我错了,如何正确设置它们并且无论如何都没有连接。

或者我认为我在保存模型时弄错了这段代码

 this.model.save({username: this.$el.find("#username"), 
         password: this.$el.find("#password")}, {
             success: function() {
                 alert('success');
             },

             error: function() {
                 alert('fail');
                 /* handle the error code here */
             }
         });

我想要的是

我想以 api 期望的形式发布用户名和密码,即 {"username":"something", "password":"something"}。然后,如果连接成功,我想转到 a.html 页面,否则我想警告错误。

注意:目前我在 localhost 托管服务并对其进行测试。

4

1 回答 1

1

它给出错误 Uncaught TypeError: Converting circular structure to JSON due to this.$el.find("#username") && this.$el.find("#password") 如果你将它们更改为 this.$el.find( "#username")[0].value && this.$el.find("#password")[0].value 在 chrome 桌面上运行良好。

// bb.js
$(function () {
    var AuthModel = Backbone.Model.extend({
        defaults: {
            username: "",
            password: ""
        },
        url: "/api/auth"
    });
    var LoginView = Backbone.View.extend({
        model: new AuthModel(),
        el: $("#login-form"),
        events: {
            "click #login": "login"
        },

        login: function () {
            console.log('entered');
            this.model.save({
                    username: this.$el.find("#username").val(),
                    password: this.$el.find("#password").val()
                },
                {
                    success: function () {
                        alert('success');
                    },

                    error: function () {
                        alert('fail');
                        // handle the error code here
                    }
                });
        }
    });
    var loginView = new LoginView();
});

// server.js 
app.post('/api/auth', function(req,res){
    console.log('entered on server');
    res.json({});
});
于 2013-05-16T13:34:09.270 回答