鍍金池/ 問答/HTML/ express中ajax請(qǐng)求第一次undefined后續(xù)均成功,但結(jié)果是上一次的

express中ajax請(qǐng)求第一次undefined后續(xù)均成功,但結(jié)果是上一次的結(jié)果而非該次請(qǐng)求的結(jié)果

剛開始用node+express,使用了靜態(tài)頁面請(qǐng)求ajax出現(xiàn)問題,目前結(jié)果來看是:
1.第一次請(qǐng)求不進(jìn)入success,打印undefined;
2.第二次請(qǐng)求開始,進(jìn)入success,打印第一次請(qǐng)求結(jié)果;
3.第三次請(qǐng)求打印第二次請(qǐng)求結(jié)果,但查看后臺(tái)傳輸值發(fā)現(xiàn),傳輸過去的值沒有問題,接收的值出現(xiàn)問題

請(qǐng)教這個(gè)問題怎么解決?

app.js代碼是:

var mysql = require('mysql');
var express = require('express');
var app = express();
var settings = require('./build/db');
app.use(express.static('./src'));
//連接數(shù)據(jù)庫
var connection = mysql.createConnection(settings.db);
connection.connect(function(err){
    if(err){
        console.log('[query] - :'+err);
    }else{
        console.log('[connection connect]  succeed!');
    }
   
});
//查詢
var arr=[];
    //把搜索值輸出
app.get('/getname', function(req, res) {
    var selectSQL = 'select linkname from `mkln_server_contract`';
    connection.query(selectSQL, function(err, rows) {
        if (err) throw error;
        for (var i = 0; i < rows.length; i++) {
            arr[i] = rows[i].linkname;
        }
        console.log(arr[1]);
        
    });
    res.send(arr);
});

app.post('/getid', function(req, res) {
    var selectSQL = 'select id from `mkln_server_contract`';
    connection.query(selectSQL, function(err, rows) {
         if (err) throw error;
        for (var i = 0; i < rows.length; i++) {
            arr[i] = rows[i].id;
        }
        console.log(arr[1]);
    });
    res.send(arr);
});
//關(guān)閉連接
//connection.end();
app.listen(3000);

html

    <head>
    <meta charset="utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>Page Title</title>
    <meta name="viewport" content="width=device-width, initial-scale=1">
    <script src="js/jquery-1.12.0.js"></script>
    <script src="js/index.js"></script>
    <style>
        #uid{
            margin-left:40px;
        }
    </style>
    </head>
    <body>
    <button id="name">獲取聯(lián)系人</button>
    <button id="uid">獲取ID</button>  
    </body>

js

$(function() {
  $("#name").click(function() {
    $.ajax({
      type: "GET",
      url: "getname",
      success: function(data) {
        console.log(data[1]);
      },
      error : function (err) {
        console.log("error : " + err);
    }
    });
  });
  $("#uid").click(function() {
    $.ajax({
        type: "POST",
        url: "getid",
        success: function(data) {
          console.log(data[1]);
        },
        error : function (err) {
          console.log("error : " + err);
        }
      });
  });
});
回答
編輯回答
生性
不過這個(gè)依次延續(xù)的原因,不是很懂。

arr是一個(gè)全局變量,第一次你同步返回,arr為空,但返回后query繼續(xù)執(zhí)行,往arr添加數(shù)據(jù)。這就是依次延續(xù)的原因。

2018年3月7日 19:16
編輯回答
久礙你

已解決,將 res.send(arr) 放到 connection.query()中即可避免。
出現(xiàn)的原因 應(yīng)當(dāng) 是 該查詢是異步執(zhí)行,第一次res.send時(shí),arr值未更改。
不過這個(gè)依次延續(xù)的原因,不是很懂。

2018年6月26日 17:45