2017-01-03 8 views
-1

私はEmberJSの新人です。nodejsとexpressjsをバックエンドとしてAmazon DynamoDBに保存しようとしていますが、EmberJSからフォームを送信するときに空のreq bodyが出てきます。EmberJS空のreq本体

次のようにカールを試してみると、データを正常に保存できるため、バックエンドが正常に動作していることがわかります。

curl --header "Content-Type: application/json" --data '{"user":{"email":"[email protected]","firstName":"teste","lastName":"last name","password":"teste"}}' http://localhost:3000/api/users 

私はapplication.js JSONAPIAdapterで Content-Type headerを設定しようとしましたが、運を持っていません。私はまた、RESTアダプターを使用しようとし、運も得られませんでした。登録 -

<div class="container" style="margin-top: 30px;"> 
    <div class="row"> 
     <form class="col s12" name="registerForm" id="registerForm"> 
      <div class="row"> 
       <div class="input-field col s6"> 
        {{input name="firstName" name="firstName" type="text" value=model.firstName class="validate" required="required" aria-required="true"}} 
        <label for="firstName">First Name</label> 
       </div> 
       <div class="input-field col s6"> 
        {{input name="lastName" name="lastName" type="text" value=model.lastName class="validate" required="required" aria-required="true"}} 
        <label for="lastName">Last Name</label> 
       </div> 
      </div> 
      <div class="row"> 
       <div class="input-field col s6"> 
        {{input type="email" value=model.email name="email" class="validated" }} 
        <label for="email">Email</label> 
       </div> 
       <div class="input-field col s6"> 
        {{input name="password" name="password" type="password" value=model.password class="validate" required="required" aria-required="true"}} 
        <label for="password">Password</label> 
       </div> 
      </div> 
     </form> 
    </div> 
    <div class="row"> 
     <div class="col s6 m6 l6"> 
      <button class="waves-effect waves-light center-align btn col s6 m6 l6 teal darken-1" {{action 'register'}} >Register Me!</button> 
     </div> 
     <div class="col s6 m6 l6"> 
      {{#link-to 'main'}}<a href="" class="waves-effect waves-light center-align btn col s6 m6 l6 teal darken-1">Cancel</a>{{/link-to}} 
     </div> 
    </div> 
</div> 

ルートregister.hbs - -

import DS from 'ember-data'; 

export default DS.Model.extend({ 
    email: DS.attr('string'), 
    firstName: DS.attr('string'), 
    lastName: DS.attr('string'), 
    password: DS.attr('string'), 
}); 

テンプレートはuser.jsの

フロントエンド モデル:

以下は、私のコードです。 js

import Ember from 'ember'; 

export default Ember.Route.extend({ 
    model() { 
     return this.store.createRecord('user'); 
    }, 

    actions: {  
     willTransition() { 
      // rollbackAttributes() removes the record from the store 
      // if the model 'isNew' 
      this.controller.get('model').rollbackAttributes(); 
     }, 

     register() { 
      let email = this.controller.get('model.email'); 
      let firstName = this.controller.get('model.firstName'); 
      let lastName = this.controller.get('model.lastName'); 
      let password = this.controller.get('model.password'); 

      let user = { 
       email: email, 
       firstName: firstName, 
       lastName: lastName, 
       password: password 
      }; 

      console.log('USER === ' + JSON.stringify(user)); 

      const newUser = this.store.createRecord('user', { 
       user 
      }); 

      newUser.save().then((response) => { 
       alert('Registro efetuado com sucesso ! ID = ' + response.get('id')); 
       this.set('email', ''); 
       this.set('firstName', ''); 
       this.set('lastName',''); 
       this.set('password',''); 

       this.transitionTo('main'); 
      }); 
     }, 
    } 
}); 

バックエンド - NodeJS + ExpressJS

app.js

var express = require('express'); 

var app = express(); 
var bodyParser = require('body-parser'); 

app.use(bodyParser.json()); 
app.use(bodyParser.urlencoded({ extended: true })); 

console.log('ENV = ' + process.env.NODE_ENV); 

var cors; 

if (process.env.NODE_ENV == 'production') { 
    cors = 'https://www.myserserver.com'; 
} 
else { 
    cors = 'http://localhost:4200'; 
} 

app.use(function(req, res, next) { 
    res.setHeader('Access-Control-Allow-Origin', cors); 

    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept"); 
    res.header('Access-Control-Allow-Methods', 'POST, GET, PUT, DELETE, OPTIONS'); 
    next(); 
}); 

var globSync   = require('glob').sync; 
var routes   = globSync('./routes/*.js', { cwd: __dirname}).map(require); 

var ddb = require('dynamodb').ddb(
     { 
      accessKeyId: 'XXXXX', 
      secretAccessKey: 'ZZZZZZZ', 
      endpoint: 'dynamodb.eu-west-1.amazonaws.com' 
    }); 

routes.forEach(function(route) { 
    route(app, ddb); 
}); 

module.exports = app; 

経路 - users.js

var express = require('express'); 
var uuid = require('node-uuid'); 
var crypto = require('crypto'); 

module.exports = function(app, client) { 
    var router = express.Router(); 

    var options = { attributesToGet: ['nome'], 
        consistentRead: true 
        };  

    router.get('/users',function(req, res, next){ 
     client.scan('users', {}, function(err, data) { 
      if(err) { 
       return res.status(200).json({"erro": err}); 
      } 
      else { 
       res.send({user:data.items}); 
      } 
     }); 
    });  

    router.post('/users',function(req, res, next) { 
     var payload = req.body.user; 

     console.log('\n REQ BODY = ' + JSON.stringify(req.body) + '\n\n'); 

     var response = ''; 

     var id = uuid.v1(); 
     var salt = crypto.randomBytes(16).toString('hex'); 

     var password = payload.password; //req.body.password; 

     var hash = crypto.pbkdf2Sync(password, salt, 1000, 64,'sha512').toString('hex'); 

     var firstName = payload.firstName; 
     var lastName = payload.lastName; 
     var email = payload.email; 

     var user = { 
      id: id, 
      email: email, 
      firstName: firstName, 
      lastName: lastName, 
      hash: hash, 
      salt: salt 
     }   

     console.log(user); 

     client.putItem('users', user, {}, function(err, res, cap) { 
      if (err) { 
       this.response = ('erro = ' + err); 
      } 
      else { 
       //console.log('PutItem: ' + cap); 
       console.log(res); 
       //this.response = ('User registered!'); 
      } 
     }); 

     return res.status(200); 
    }); 

    app.use('/api', router); 
}; 

これはコンソールであります.log EmberJSを使用してデータを送信するときreq.bodyのために:

REQ BODY = {"user":{"email":null,"firstName":null,"lastName":null,"password":null}} 

私はここで何が欠けていますか?

ありがとうございました!

+0

あなたはapp.js 'res.header(「アクセス制御 - 許可 - 起源」でこれを追加してみてくださいすることができ、" * ");' –

+0

@DeepakBandi同じ結果が得られました。助けてくれてありがとう! :-) – Marrone

答えて

0

実行中です。 は同じ問題に直面して人のために、私はちょうどと私のregisterアクションを置き換え、この1:

register: function() { 
    var _this = this; 

    this.get('model').save() 
    .then(function(data) { 
     console.log('signup response:', data); 
     alert('signup saved ok! redirect to signin'); 
     _this.transitionToRoute('main'); 
    }, 
    function(data) { 
     alert('signup saved fail!'); 
     _this.set('error', data.responseJSON.error || 'sorry, signup failed.'); 
    }); 
} 
関連する問題