將圖像從html發送到node.js

Question

嗨，我正在從視頻中捕獲幀並將其轉換為圖像。 但是當我將此圖像傳遞給server.js時，我無法訪問它並在控制台上獲得未定義的類型，這是我的腳本代碼：

 var canvas= document.getElementById("canvs"); var video=document.getElementById("videoElement"); var png= new Image(); var imcanvas = canvas.getContext("2d"); imcanvas.drawImage(video, 0,0 , canvas.width,canvas.height); png = canvas.toDataURL("image/png"); var json={"name":png}; jQuery.ajax({ url: "/demo", type: "POST", data:json, processData: false, cache: false, success: function(reponse) { if(reponse) { console.log(reponse); } else { console.log('Error'); } } }); 

這是我的server.js

 var express = require('express'); var cv = require('./public/opencv'); const bodyParser = require('body-parser'); var app = express(); app.use(bodyParser.json()); app.use(bodyParser.urlencoded({ extended:true })); app.use(express.static('public')); app.get('/index.html', function (req, res) { res.sendFile( __dirname + "/" + "index.html" ); }); app.post('/demo', (req,res)=>{ console.log(typeof(req.body.name)); }); var server = app.listen(8081, function () { var host = server.address().address; var port = server.address().port; }); 

Answer 1

這可能是人體的極限。

您可以按照以下步驟設置正文解析器限制：

 app.use(bodyParser.urlencoded({
    limit: '50mb',
    extended: true
 }));

如果仍未定義，請嘗試在請求中添加dataType prop並對json數據進行字符串化。 例：

var json={"name":png};

jQuery.ajax({
    url: "/demo",
    dataType  : 'json',
    type: "POST",
    data: JSON.stringify(json),
    processData: false,
    cache: false,
    success: function(reponse) {
        if(reponse) {
            console.log(reponse);
        } else {
            console.log('Error');
        }
    }
})

Answer 2

謝謝@FewFlyBy。您回答了這個問題，我在server.js中僅添加了一條額外的語句。 我可以這樣做：

         //above codes
        jQuery.ajax({
                url: "/demo",
                type: "post",
                dataType: 'json',
                contentType: "application/json; charset=utf-8",
                data: JSON.stringify(json),
                success: function (reponse) {
                    if (reponse) {
                        console.log(reponse);
                    } else {
                        console.log('Error');
                    }
                }
                });

並在server.js中

    //require statements
    app.use(bodyParser.json({limit: '50mb'}));
    app.use(bodyParser.urlencoded({
       limit: '50mb',
       extended: true
    }));
    app.post('/demo', (req, res) => {
    const base64data=req.body.image;
    }