1

node.js をバックエンドとして使用し、canjs をフロントエンド ライブラリとして使用しています。

ノードコード:

var express = require('express');
var app = express();
var http = require("http");
var fs = require("fs");
var cons = require('consolidate')

app.configure(function(){
      app.engine('html', cons.handlebars);
      app.set('view engine', 'html');
      app.set('views', __dirname)
      app.use(express.favicon())
      app.use(express.logger('dev'))
      app.use(express.static(__dirname ))
      app.use(express.bodyParser())
      app.use(express.methodOverride())
      app.use(express.cookieParser("secret"))
      app.use(express.session({ secret: 'keyboard cat' }))
      app.use(app.router)
    });

app.init = function(){
    fs.readFile('./sample.json', 'utf8', function(error, data) {
        if (error) {
            throw(error);
        }
        else
            app.set("json", data);
    })};

app.get('/things', function(req, res){
    app.init();
    res.set('Content-Type', 'text/json');
    res.send(app.get("json"));
});

app.get('/things/:id', function(req, res){
    app.init();
    res.set('Content-Type', 'text/json');
    res.send((JSON.parse(app.get("json")))[req.param('id')]);
});

app.get('/main.html', function(req, res){
    app.init(function(error, data){
        if (error) {throw error}
        res.render('main.html');
    });
});

app.listen(3000);

Can.js コード:

Todo = can.Model({
    findAll: "GET /things",
    findOne: "GET /things/{id}",
},{});

$(document).ready(function(){

    Todo.findAll({}, function(todos){
        console.log(JSON.stringify(todos));
    })

    Todo.findOne( { id: 1 }, function( todo ) {
        console.log( todo );
    })

});

HTML:

<script type="text/javascript" charset="utf-8" src="./jquery-1.8.2.js"></script>
<script type="text/javascript" charset="utf-8" src="./can.jquery-1.0.7.js"></script>
<script type="text/javascript" charset="utf-8" src="./can.fixture.js"></script>
<script type="text/javascript" charset="utf-8" src="./master.js"></script>

JSON:

{"0":{"id":1,"name":"do the dishes"},"1":{"id":2,"name":"go to dentist"},"2":{"id":3,"name":"go swimming"},"4":{"id":5,"name":"masturbate"}}

サーバーが起動するたびに、コンソールは両方の関数 (findAll と findOne) の ajax GET 応答を検出し、未定義または 500 エラーを返します。

XHR finished loading: "http://localhost:3000/things". jquery-1.8.2.js:8416
undefined master.js:12

GET http://localhost:3000/things/1 500 (Internal Server Error) jquery-1.8.2.js:8416
XHR finished loading: "http://localhost:3000/things/1". jquery-1.8.2.js:8416
Uncaught TypeError: Function.prototype.apply: Arguments list has wrong type

しかし、この後にページを更新すると、2 つの関数は正常に動作し、次のようになります。

XHR finished loading: "http://localhost:3000/things". jquery-1.8.2.js:8416
{"0":{"id":1,"name":"do the dishes"},"1":{"id":2,"name":"go to dentist"},"2":{"id":3,"name":"go swimming"},"4":{"id":5,"name":"masturbate"},"length":0,"_namespace":".observe2"} master.js:12
XHR finished loading: "http://localhost:3000/things/1". jquery-1.8.2.js:8416
Constructor {name: "go to dentist", _data: Object, id: 2, _namespace: ".observe3"}
 master.js:16

何が起こっている？？

4

1 に答える 1

2

問題は、app.get("json");その値がfs.readfileコールバックによって設定される前に呼び出していることですapp.init(これは、最初の呼び出しがapp.init();返された後に発生します)。

コードを変更して 1 回だけ呼び出すようapp.initにし、作業が完了するまでリクエストをリッスンしないようにする必要があります。

app.init = function(callback){
    fs.readFile('./sample.json', 'utf8', function(error, data) {
        if (error) {
            throw(error);
        } else {
            app.set("json", data);
            callback();
        }
    });
};

...

app.init(function() {
    app.listen(3000);
});
于 2012-11-13T03:21:41.843 に答える