表单提交值给 null - mongoose 和 express js

Question

我正在尝试使用 express 将数据从基本 html 表单发送到 mongodb。但是当我 post 它时它给了我 null。

我使用了以下架构：commentname: String。

这是HTML：

<form id="form" onsubmit="return false;">
  <input type="textbox" id="cmt-1" placeholder="comment here"/>
</form>
<button type="button" onclick="submit()" class="submit">
  submit
</button>

JS:


var cmt = document.getElementById('cmt-1').value;
var comment = {commentname: ''};
comment = {commentname: cmt};

function submit () {
  async function postData (url = '', data = {}) {
    const response = await fetch(url, {
      method: 'POST',
      mode: 'same-origin',
      cache: 'no-cache',
      credentials: 'same-origin',
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify(data) // body data type must match "Content-Type" header
    });
    return response.json(); // parses JSON response into native JavaScript objects
  }

  postData(
    'https://realtime-comt-system-100.glitch.me/comments/add',{comment}
  )
  .then(data => { console.log(data); });
}

我错过了什么？

Answer 1

只需尝试此代码，但请检查我输入的 url。不要把整个 url 只放路径名。还复制并粘贴此代码，html 和 java 脚本将它们都带走，因为我更改了它们

var form = document.getElementById('form');


form.addEventListener('submit', async(e) => {
    e.preventDefault();
    
    let cmt = form.cmt.value;
let data = {commentname: cmt};

 const response = await fetch('/comments/add', {
      method: 'POST',
      headers: {
        'Content-Type': 'application/json'
      },
      body: JSON.stringify(data)
      
      }).then(res =>{
      console.log(res)
      }).catch(err){
      console.error(err)
      }
    
    })

<form id="form">
  <input type="textbox" id="cmt-1" name='cmt' placeholder="comment here"/>
</form>
<button type="submit" onclick="submit()" class="submit">
  submit
</button>

Answer 2

问题不是由上面发布的代码引起的。

这是猫鼬问题。您正在尝试创建两个具有相同 ID 的文档，而该 ID 已指定为 Mongoose 唯一。

这是代码在正文中发布到后端的内容，JSON 字符串：

{"comment":{"commentname":"my sample comment"}}

您在对象中发布对象这一事实看起来很可疑。这种模式会更常见：

{"commentname":"my sample comment"}

但是由于没有发布后端代码，所以无法判断这是否正确。

当我尝试使用 Postman 将 {"comment":{"commentname":"my sample comment"}} 发布到后端 URL 时，我收到了以下响应代码：

400 Bad Request

响应正文：

"Error: MongoError: E11000 duplicate key error collection: database.comments index: commentname_1 dup key: { commentname: null }"

来自Mastering JS - Debug E11000 Errors in Mongoose

MongoDB's E11000 error is a common source of confusion. This error occurs when two documents have the same value for a field that's defined as unique in your Mongoose schema.

Mongoose models have an _id field that's always unique.

表单提交值给 null - mongoose 和 express js

Form submit value giving null - mongoose and express js

javascript

mongoose

node.js

express

mongoose-schema