Node.js+MySQL：服务器响应正常但浏览器显示[object Object]问题

我碰到过好多次这种情况啦——你访问http://localhost:1337时浏览器输出Hello, [object Object]，但服务器实际返回的是Hello, David James，核心问题其实出在JavaScript对象和字符串拼接的自动转换上。

先看看你提供的app.js基础代码：

var express = require('express');
var app = express();
var mysql = require('mysql');
var connection = mysql.createConnection({
  host: 'localhost',
  user: 'root',
  password: '',
  database: 'mywebsite'
});
connection.connect(function(error) {
  if(!!error) {
    console.log('Error');
  } else {
    console.log('Connected!');
    // 这里应该是你的查询和响应逻辑
  }
});

问题根源 #

你肯定是在处理数据库查询结果的时候，直接把整个用户对象拼进了响应字符串里。比如类似这样的错误代码：

connection.query('SELECT first_name, last_name FROM users WHERE id = ?', [1], function(err, results) {
  if (err) throw err;
  // 错误写法：直接拼接对象
  res.send('Hello, ' + results[0]);
});

JavaScript里当你把对象和字符串相加时，会自动调用对象的toString()方法，而默认的对象toString返回的就是[object Object]，这就是浏览器显示异常的原因！

解决办法 #

你需要从查询结果的对象里提取出具体的属性值，再和字符串拼接：

方法1：用ES6模板字符串（推荐）

connection.query('SELECT first_name, last_name FROM users WHERE id = ?', [1], function(err, results) {
  if (err) throw err;
  const user = results[0]; // 注意results是数组，取第一个元素
  res.send(`Hello, ${user.first_name} ${user.last_name}`);
});

方法2：传统字符串拼接

如果你还在使用ES5及以下环境，这么写也可以：

connection.query('SELECT first_name, last_name FROM users WHERE id = ?', [1], function(err, results) {
  if (err) throw err;
  const user = results[0];
  res.send('Hello, ' + user.first_name + ' ' + user.last_name);
});

额外提醒 #

别忘了connection.query返回的results是一个数组（哪怕只查到一条数据），所以一定要用results[0]拿到单个用户对象，别直接把整个数组拿去拼接哦，不然会得到更奇怪的输出~

内容的提问来源于stack exchange，提问作者user8991131