Próbuję przekazać kilka współrzędnych z bazy danych MySQL, aby być oznaczone na mapie, ale mam problemy z ich zdobyciem. Spojrzałem na wiele podobnych pytań na stackoverflow i nie byłem w stanie znaleźć odpowiedzi. Doceni się, gdyby ktoś mógłby wskazać, gdzie poszedłem źle.

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);
  });
});

Następnie w moim pliku script.js mam

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

Przyprowadzam błąd w konsoli przeglądarki mówiącej "wymagać nie jest zdefiniowane"

Będę musiał dowiedzieć się, jak wyciągnąć współrzędne z MySQL, aby je wykreślić, musi być sposób? Czy muszę zbudować interfejs API i używać AJAX? Z góry dziękuję za jakąkolwiek pomoc.

Zaktualizowaliśmy moje plik Getlistings.js - teraz wyświetla w ciągu danych, których potrzebuję w przeglądarce jako pakiet danych surowych

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);
      }
    );
  });

Nie udało mi się uzyskać wyjścia do uruchomienia w skrypcie.js. Opublikuję kod pracy, gdy działa.

0
walk slowly 13 luty 2021, 14:13

2 odpowiedzi

Najlepsza odpowiedź

Rozwiązanie, które dostałem do pracy, jest następujące:

Getlistings.js (to było 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);
    }
  );
});

W moim pliku script.js brakowało mi poniższych

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

Wierzę, że jest ajax jQuery

Wtedy w pozycji mojego HTML potrzebowałem następujących

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

Dzięki wszystkim, którzy mi z tym pomogli. Zwłaszcza @ tsecheukfung01.

Nie rozumiem w pełni wszystkie elementy, więc zajmie mi trochę czasu, aby w pełni zrozumieć i być w stanie odtworzyć to samodzielnie. Cała część podróży!

0
walk slowly 16 luty 2021, 05:42

Dostaję błąd w przeglądarce Console "wymaga" wymaga "

Jest to dlatego, że require nie jest API dla Frontend. Powinien być składnia backend (np. Nodejs).

Czy muszę zbudować interfejs API i używać AJAX?

Jeśli chcesz wysłać dane z Frontend, aby zapleczyć. Korzystanie z ajax jest możliwe, ale głównym punktem jest posiadanie serwera Backend (np. Korzystanie z modułu {X1}} dla Nodejs), aby połączyć się z bazą danych (np. MySQL, Postgressql).


Aktualizacja 14 lutego, 2021

Moja praktyka za to, że jest użycie ajax, aby wysłać żądanie do serwera Backend z Frontend.

//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
});

W przypadku problemu CORS można zainstalować cors pakiet. Jeśli masz oprogramowanie pośrednie w globalnym zakresie (a.k.a. app.use(cors())). Za każdym razem, gdy istnieje żądanie, oprogramowanie pośrednie uruchomi się.

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')
})
0
tsecheukfung01 15 luty 2021, 15:16