要求未在控制台中定义。 node.js js mysql

Question

我正在尝试从 mysql 数据库中传递一些坐标以在地图上进行标记，但无法获取它们。我在 stackoverflow 上查看了许多类似的问题，但未能找到答案。如果有人能指出我哪里出错了，将不胜感激。

getListings.js

var mysql = require('mysql');

config = {
  host: 'localhost',
  user: 'root',
  password: 'password',
  database: 'xx',
  port: 'xxxx',
};

var connection = mysql.createConnection(config); 
connection.connect(function (err) {
  if (err) {
    console.log('error connecting:' + err.stack);
  }
  console.log('connected successfully to DB.');

  connection.query('SELECT listing_coords FROM listings', (err, rows) => {
    if (err) throw err;

    console.log('Data received from Db:\n');
    var results = JSON.parse(JSON.stringify(rows));
    module.exports = { results };
    console.log(results);
  });
});

然后在我的 script.js 文件中

var { results } = require('./getListings');
      console.log(results);

我在浏览器控制台中收到一条错误消息，提示“未定义要求”

我需要弄清楚如何从 mysql 中提取坐标以便绘制它们，一定有办法吗？我必须构建一个 api 并使用 ajax 吗？提前感谢您的帮助。

更新了我的 getListings.js 文件 - 它现在显示在浏览器中我需要的数据字符串中作为原始数据包

var mysql = require('mysql');
const express = require('express');
var app = express();
const bodyparser = require('body-parser');

app.use(bodyparser.json());

config = {
  host: 'localhost',
  user: 'root',
  password: 'password',
  database: 'xx',
  port: 'xxxx',
};

var connection = mysql.createConnection(config); //added the line
connection.connect(function (err) {
  if (err) {
    console.log('error connecting:' + err.stack);
  }
  console.log('connected successfully to DB.');

  app.listen(5000, () => console.log('express server is running at 5000'));

  app.get('/listings', (req, res) => {
    connection.query(
      'SELECT listing_coords FROM listings',
      (err, rows, fields) => {
        if (!err) res.send(rows);
        else console.log(err);
      }
    );
  });

我未能成功让输出在 script.js 中运行。我会在它工作时发布工作代码。

Answer 1

我得到的解决方案如下：

getListings.js（这是 nodeJS）

var mysql = require('mysql');
const express = require('express');
const bodyparser = require('body-parser');
var app = express();

app.use(bodyparser.json());

**app.use(function (req, res, next) {
  res.header('Access-Control-Allow-Origin', '*');
  res.header(
    'Access-Control-Allow-Headers',
    'Origin, X-Requested-With, Content-Type, Accept, Authorization'
  );
  next();
});**// I believe this is a middleware function

config = {
  host: 'localhost',
  user: 'root',
  password: 'password',
  database: 'xx',
  port: 'xxxx',
};

var connection = mysql.createConnection(config); //added the line
connection.connect(function (err) {
  if (err) {
    console.log('error connecting:' + err.stack);
  }
  console.log('connected successfully to DB.');
});

app.listen(5000, () => console.log('express server is running at 5000'));// this can be any port that isnt currently in use

app.get('/listings', (req, res) => {
  connection.query(
    'SELECT listing_coords FROM listings',
    (err, rows, fields) => {
      if (!err) res.send(rows);
      else console.log(err);
    }
  );
});

在我的 script.js 文件中，我缺少以下内容

      $.get('http://localhost:5000/listings', function (data, status) {
        console.log('Cords Data', data);

我相信那是 jQuery ajax

然后在我的 html 的标题中，我需要以下内容

  <script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>
 <script type = "module" defer src="script.js"></script>

感谢所有帮助我的人。特别是@tsecheukfung01。

我没有完全理解所有的部分，所以我需要一段时间才能完全理解这一点并能够自己重新创建它。旅程的所有部分！

Answer 2

我收到一个错误在浏览器中控制台说“require is not defined”

这是因为require 不是前端的 API。它应该是后端的语法（例如nodeJS）。

我必须构建一个 api 并使用 ajax 吗？

如果您想将数据从前端发送到后端。使用ajax 是可能的，但重点是您需要有一个后端服务器（例如，使用Express 模块用于nodeJS）来连接数据库（例如mysql、postgresSQL）。

---

2021 年 2 月 14 日更新

我的做法是使用ajax 从前端向后端服务器发送请求。

//frontend
$.ajax
  ({
    url: "yourBackendServerUrl", //eg. localhost:8001/listing. Need modification based on your backend setting.
  })
  .done(function(data) {
     console.log(data)  //data should be the result from backend, then you can retrieve the data for frontend usage
});

对于CORS问题，可以安装cors包。如果您在全局范围内有一个中间件（又名app.use(cors())）。每次有请求，这个中间件就会运行。

var express = require('express')
var cors = require('cors')
var app = express()
 
app.use(cors()) // pay attention to this line of code. 
 
app.get('/products/:id', function (req, res, next) {
  res.json({msg: 'This is CORS-enabled for all origins!'})
})
 
app.listen(80, function () {
  console.log('CORS-enabled web server listening on port 80')
})