如何正确编写Ajax Post?

时间:2020-11-02 04:22:56

标签: javascript node.js ajax express

我正在尝试使用Ajax POST方法将图像url从某些javascript发送到node.js服务器。我希望服务器返回一些文本,但是什么也没有发生,并且我不确定我要去哪里。这是相关的javascript:

function drop(evt){
    evt.stopPropagation();
    evt.preventDefault();
    var imageUrl=evt.dataTransfer.getData('URL');
    //alert(imageUrl);
    console.log(imageUrl);
    $.ajax({
        type: "POST",
        url: "http://localhost:3000/examineImage",
        contentType:"application/json; charset=utf-8",
        dataType:"json",
        data: JSON.stringify({"imageRequested":imageUrl}),

        success: function(data){
            console.log("REACHED BACK");
            console.log(data);
            var tags="";
        }
    })
}

我认为该功能可以正常运行,因为它可以按预期在控制台中显示url。如果我在服务器外部单独运行该节点,则它也可以按预期工作。这是node.js代码:

app.post("/examineImage",function(req, resp){
    console.log("REACHED");
    var imageURL=req.body.imageRequested;
    stub.PostModelOutputs(
        {
            model_id: "e0be3b9d6a454f0493ac3a30784001ff",
           // version_id: "1ed35c3d176f45d69d2aa7971e6ab9fe",  // This is optional. Defaults to the latest model version.
            inputs: [
                {data: {image: {url:imageURL}}}
            ]
        },
        metadata,
        (err, response) => {
            if (err) {
                throw new Error(err);
            }
    
            if (response.status.code !== 10000) {
                throw new Error("Post model outputs failed, status: " + response.status.description);
            }
    
            const output = response.outputs[0];
    
            console.log("Predicted concepts:");
            for (const concept of output.data.concepts) {
                console.log(concept.name + " " + concept.value);
            }
            resp.send(output.data.concepts);
        }
    );

});

就像我之前说的那样,JavaScript代码本身可以很好地工作,而node.js代码本身可以工作,所以我认为这与POST方法有关。我是使用Node和JavaScript的新手,如果这是一个明显的错误,我深表歉意。

1 个答案:

答案 0 :(得分:1)

@ user10509686,我尝试了您下面的app.js代码:

const express = require('express')
const bodyParser = require('body-parser');
const cors = require('cors');
const fs = require('fs');
const app = express();
const port = 3000;

// Where we will keep books
    let books = [];

app.use(cors());

// Configuring body parser middleware
app.use(bodyParser.urlencoded({ extended: false }));
app.use(bodyParser.json());


app.get("/",function(req, resp){
    fs.createReadStream('index.html').pipe(resp);
});

app.post("/examineImage",function(req, resp){
    console.log("REACHED");
    var imageURL=req.body.imageRequested;
    console.log(imageURL);
});

app.listen(port, () => console.log(`app listening on port ${port}!`));

通过您的以下ajax调用:

$.ajax({
        type: "POST",
        url: "http://localhost:3000/examineImage",
        contentType:"application/json; charset=utf-8",
        dataType:"json",
        data: JSON.stringify({"imageRequested":imageUrl}),

        success: function(data){
            console.log("REACHED BACK");
            console.log(data);
            var tags="";
        }
    })

我在服务器端(Node.js)找到了参数值。现在,就像您告诉您没有得到回应一样,这意味着您的stub.PostModelOutputs中存在一些问题 方法。您需要进一步调试它。我的假设是没有从您的stub.PostModelOutputs得到响应,因此,您没有得到响应。