[英]Post request from fetch gives a 404 server error (javascript/express)
[英]Ember component POST to Express API gives error
尝试从我的余烬应用程序中的组件到我的Express API进行发布时,我收到了
SyntaxError: Unexpected token V in JSON at position 0
在Chrome的网络检查器中检查收到的响应时,我看到了
ValidationError: body: Path `body` is required., title: Path `title` is required. undefined
blogpost.title和.body都返回正确的值,但是blogpost给了我
adapterError: SyntaxError: Unexpected token V in JSON at position 0 at parse
EmberApp /应用/组件/创建新员额/ Component.js
export default Component.extend({
blogpost: null,
router: inject('-routing'),
actions: {
save: function (blogpost) {
console.log(blogpost.title);
console.log(blogpost.title);
console.log(blogpost);
blogpost.save()
.then(
(value) => {
Ember.Logger.info(value);
this.get('router').transitionTo('index')
}
)
.catch(
(err) => {
Ember.Logger.info('failure to save');
console.log(err);
}
)
}
}
});
EmberApp /应用/组件/创建新员额/ template.hbs
<form {{action "save" blogpost on="submit"}}>
<p>
{{input name="title" value=blogpost.title class="form-control" placeholder="Title"}}
</p>
<p>
{{textarea name="body" value=blogpost.body class="form-control" placeholder="Body" rows="10" cols="140"}}
</p>
<p>
<button class="btn btn-primary btn-block" type="submit" value="Save">Publish</button>
</p>
</form>
EmberApp /应用/路由/ createpost.js
import Route from '@ember/routing/route';
export default Route.extend({
model() {
return this.store.createRecord('blogpost');
}
});
EmberApp /应用/模板/ createpost.hbs
<div class="container">
<div class="col-sm-12 pull-left">
{{create-new-post blogpost=model }}
</div>
</div>
我已经确认发布的api路由与邮递员一起工作,因此我不确定余烬的问题所在。
ExpressAPI路由器
router.post('/blogposts', (req, res) => {
console.log('In router');
console.log(req.body);
let newBlogPost = new BlogPostSchema(req.body);
newBlogPost.save((err, blogpost) => {
if(err){
console.log(err +" "+blogpost);
res.send(err +" "+blogpost);
}
console.log(blogpost);
res.json(blogpost);
});
});
req.body返回{},这就是为什么它会出错的原因
弄清楚我的问题。 对于任何有类似问题的人,首先尝试使用带有ember的express api作为前端时,我意识到emberjs的发布请求会发送内容类型为"application/vnd.api+json"
的标头。
因此,在我的express server.js
我添加了app.use(bodyParser.json({ type: 'application/vnd.api+json' }));
它使主体解析器能够解析并返回正确的req.body。 然后,我为我的ember应用程序创建了一个新的序列化器ember generate serializer blogpost
,该文章将请求序列化为我的express api期望的格式。
EmberApp /串行器/ blogpost.js
import DS from 'ember-data';
export default DS.JSONAPISerializer.extend({
serialize(snapshot, options){
let json = this._super(...arguments);
let newjson = {
title: json.data.attributes.title,
body: json.data.attributes.body
};
return newjson;
}
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.