爲什麼不能在node.js應用程序中正確解析html表單發佈數據？

我正在做一個博客作爲一個學習練習 - 參見github project - 在node.js中從頭開始。我有一個與input和textarea字段類似的html表單。提交時，每個分別應被解析爲title和content。爲什麼不能在node.js應用程序中正確解析html表單發佈數據？

<!DOCTYPE html> 
<html> 
    <head> 
     <title> 
      Post Form 
     </title> 
     <link href="/css/master.css" rel="stylesheet" type="text/css" /> 
    </head> 
    <body> 
     <h1> 
      New post 
     </h1> 

     <form method="post" action="/posts" id="new_post" class="new_post"> 

      <div class="field"> 
       <label for="post_title">Title</label><br> 
       <input type="text" name="title" id="post_title" size="30" /> 
      </div> 

      <div class="field"> 
       <label for="post_content">Content</label><br> 
       <textarea name="content" cols="40" rows="20" id="post_content"></textarea> 
      </div> 

      <div class="actions"> 
       <input type="submit" value="Create Post" id="post_submit" /> 
      </div> 
     </form> 
     <p><br> 
      <a href="/home">Back</a> 
     </p> 
    </body> 
</html>

在index.js文件中我定義了我的路由和一些實用函數來幫助我解析提交的信息中的數據。

var http = require('http'), 
    url = require('url'), 
    fs = require('fs'), 
    qs = require('querystring'); 

// html file cache 
var homeHTML = fs.readFileSync('views/post/home.html'); 
var newHTML = fs.readFileSync('views/post/new.html'); 
var postsHTML = fs.readFileSync('views/post/posts.html') 


// render functions 
... 

function renderPostForm(request, response) { 
    response.writeHead(200, { 
    'content-type': 'text/html; charset=utf-8' 
    }); 
    response.end(newHTML); 
} 

function addNewPost(request, response) { 
    response.writeHead(200, { 
    'content-type': 'text/html; charset=utf-8' 
    }); 

    // the parseBody is defined below this function 
    // title and content should get logged to the console, but title comes out Title: undefined 
    // content works fine 

    parseBody(request, function(body) { 
    var post = { 
     title: body.title, 
     content: body.content 
    } 
    console.log("Title: " + post.title); 
    console.log("Content: " + post.content); 
    }); 
    response.end(postsHTML); 
} 

// utils 
... 

function parseBody(request, callback) { 
    var body = " "; 

    request.on('data', function(chunk) { 
    body += chunk; 
    }); 
    request.on('end', function() { 
    callback(qs.parse(body)); // I may be misunderstanding the usage of the parse function 
    }); 
} 

// routes 
var homeREGEX = new RegExp('^/?$'); 
var newREGEX = new RegExp('^/posts/new/?$'); 
var postsREGEX = new RegExp('^/posts/?$'); 

// server 
var server = http.createServer(function(request, response){ 
    var pathname = url.parse(request.url).pathname; 

    if (homeREGEX.test(pathname)) { 
    renderHome(request, response); 
    } else if (newREGEX.test(pathname)) { 
    renderPostForm(request, response); 
    } else if (postsREGEX.test(pathname)) { 
    addNewPost(request, response); 
    } else { 
    render404(request, response); 
    } 
}); 

server.listen(3000);

來源

2014-09-22 kurofune

在你的代碼中，你認爲你的表單數據應該被解析？發佈請求不作爲URL查詢字符串參數發送。發佈數據在請求的主體中發送，並需要從那裏解析。 – jfriend00 2014-09-22 18:28:27

好吧，我定義了'parseBody'函數，它調用正文中的'querystring'模塊（導入在頂部）的qs.parse函數。它是在所有數據從請求中分塊後完成的。它在addNewPost函數中被調用，它創建一個名爲「post」的新對象，並用'body.title'和'body.content'填充它。顯然，'body.content'被解析並沒有問題。爲什麼不'body.title'？因此，通過'parseBody'函數在'addNewPost'函數中回答你的問題。 – kurofune 2014-09-22 18:41:55

我敢打賭那是因爲你的parseBody()緩衝開始用一個空格和title是在表單中的第一場。所以你的緩衝區最終被類似：

 title=foo&content=bar

，而不是

title=foo&content=bar

變化var body = " ";到var body = "";。

來源

2014-09-22 19:48:37 mscdex

這是解決方案。我剛剛發現自己（磅胸）。謝謝！ – kurofune 2014-09-22 20:15:58

爲什麼不能在node.js應用程序中正確解析html表單發佈數據？

回答

相關問題