Форум программистов, компьютерный форум, киберфорум
Node.js
Войти
Регистрация
Восстановить пароль
Карта форума Темы раздела Блоги Сообщество Поиск Заказать работу  
 
Рейтинг 4.73/75: Рейтинг темы: голосов - 75, средняя оценка - 4.73
1 / 1 / 3
Регистрация: 20.01.2014
Сообщений: 91
1

Как подключить jquery в node.js?

30.05.2017, 11:03. Показов 13624. Ответов 5
Метки нет (Все метки)

Author24 — интернет-сервис помощи студентам
Добрый день уважаемые программисты. Начал изучать node.js. Необходимо реализовать сайт одностраничник SPA. Незнаю как подключить jquery? Еще подскажите в какой папке будут распологатся файлы jquery?
0
Лучшие ответы (1)
Programming
Эксперт
94731 / 64177 / 26122
Регистрация: 12.04.2006
Сообщений: 116,782
30.05.2017, 11:03
Ответы с готовыми решениями:

Как mongodb подключить к node js с помощью webstorm?
как mongodb подключить к node js с помощью webstorm?

Не запускается пакет node js - пакетами? npm? сам node? gulp?
Всем доброго времени суток. Есть такая проблема, пытаюсь перебраться на Linux (Ubuntu) Установил...

Как подключить jQuery?
Скачал слайдер на jQuery(первый раз работаю с jQuery) везде рекомендуют подключить ссылку, я...

Как подключить jquery в codeigniter?
Не получается подключить jquery в codeigniter обычными методами. Он просто не работает. Как нужно...

5
Почетный модератор
Эксперт HTML/CSSЭксперт PHP
16844 / 6723 / 880
Регистрация: 12.06.2012
Сообщений: 19,967
30.05.2017, 12:08 2
Bash
1
npm install jQuery
Javascript
1
var $ = require('jQuery');
Цитата Сообщение от Сарсен Посмотреть сообщение
в какой папке будут распологатся файлы jquery?
в той, в которой вы запустите npm install, внутри node_modules
Либо в системной

Bash
1
npm list -g
- покажет, где и что у вас лежит.. Как на винде все это будет выглядеть, я не в курсе.
1
Coding is art
Эксперт JS
536 / 420 / 153
Регистрация: 04.09.2013
Сообщений: 1,056
31.05.2017, 00:29 3
Как я подрозумеваю вам нужно подключить jquery не в ноду, а что бы на сайте отображался.
Для этого нужно в html сделать <script src="указать путь до файла"></script>

где путь может быть например из cdnjs.com сайта или вам самим ( в ноде ) нужно сделать роут для этого запроса, вот пример без фреймворков:
https://stackoverflow.com/ques... r-29046869

либо смотрите доку фреймворка который используете.
( Чаще всего используют express, так вот в нём есть такой хелпер: express.static )
1
1 / 1 / 3
Регистрация: 20.01.2014
Сообщений: 91
02.06.2017, 15:19  [ТС] 4
Подключил jquery. Сформировал структуру проекта. Теперь не получается разобраться как делать запрос из фронтенд части на сервер в mysql, т.е. по кликанью на ссылку происходил бы запрос к БД? Я понимаю что нужно через ajax. Только не могу представить какой синтаксис и где его вставлять. Без node.js, просто обращался к файлам php, которые обращались в mysql, а тут что-то запутался.

В шаблонизаторе jade(html) имеется sidebar со списком ссылок:
HTML5
1
2
3
4
div(class="col-xs-2 " id="sidebar" role="navigation")
    div(class="list-group")
        a(href="#" class="list-group-item active") nvr-1
        a(href="#" class="list-group-item") nvr-2
В файле app.js происходит подключение к бд:
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
var mysql = require('mysql');
 
var connection = mysql.createConnection({
  host: 'localhost',
  user: 'root',
  password: '',
  database: 'schools'
});
 
connection.connect(function(error){
  if(!!error){
    console.log('Error connection to database');
  } else {
    console.log('Connected to database');
  }
});
 
connection.end();
Структура проекта:
HTML5
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
     bin
        > www
     node_modules
        > ...
        > ...
     public
        > css
             > bootstrap.css
             > style.css
        > fonts
        > img
        > js
             > lib
                  > bootstrap.js
                  > jquery.js
             > social.js
     routes
        > index.js
        > users.js
     views
        > error.jade
        > index.jade
        > layout.jade
     app.js
     packages.json
0
Coding is art
Эксперт JS
536 / 420 / 153
Регистрация: 04.09.2013
Сообщений: 1,056
02.06.2017, 18:35 5
Лучший ответ Сообщение было отмечено Сарсен как решение

Решение

Предположу что вы используете express фреймворк.
У вас есть папочка routes, в ней вы создаёте "пути", почти как php файлы.
например у вас есть продукты, создаёте products.js
в нутри него делаете:
Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
module.exports = function(connection) {
  return {
    index: (req, res) => { // Достаём то-то из базы
      connection.query('тут query запроса MYSQL см. доку mysql npm', function (error, results, fields) {
        if (error) return res.status(500).json({ error }); // отдаём пользователю 500 ошибку с самой ошибкой
        // делаем что-то с результатами и отправляем пользователю
        const data = desults[0];
        res.status(200).json(data);
      });
    },
    post: (req, res) => { // Записываем что-то в базу
      const postData = { // должен быть body-parser подключен что бы req.body был заполнен
        message: req.body.message, 
        id: req.body.id
      }; 
      connection.query('INSERT INTO posts SET ?', postData, function (error, results, fields) {
        if (error) return res.status(500).json({ error }); // отдаём пользователю 500 ошибку с самой ошибкой
        res.status(200).json({ status: true });
      });
    }
  }
}
далее в вашем app.js файле
нужно загрузить файл products.js, вызвать функцию передав соединение с базой и подключить нужные функции для обработки запросов:

Javascript
1
2
3
4
5
6
7
8
9
const products = require('routes/products');
 
.... // тут у вас connection создаётся
... // тут где-то у вас должен сервер создаваться, что-то типо const app = express();
 
const productRoutes = products(connection);
 
app.get('products', productRoutes.index);
app.post('products', productRoutes.post);
Теперь у вас есть 2 роута на которые можно посылать запросы:
/products (GET и POST)

в jQuery это можно сделать так:

Javascript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
$.ajax({
  method: "GET",
  url: "/products"
})
  .done(function( data ) {
    // data - данные полученые из index функции
  });
 
////////////////////////////////////////////////////
 
$.ajax({
  method: "POST",
  url: "/products",
  data: { id: 1, message: 'Сообщение из фронта' }
})
  .done(function( data ) {
    // data - данные полученые из post функции
  });
Важно: Соединение `connection.end();` закрывать не надо, тогда закроется соединение с базой и у вас всегда будет 500 ошибка.
1
1 / 1 / 3
Регистрация: 20.01.2014
Сообщений: 91
02.06.2017, 20:39  [ТС] 6
Большое спасибо за такой развернутый ответ, щас буду разбираться.
0
02.06.2017, 20:39
IT_Exp
Эксперт
87844 / 49110 / 22898
Регистрация: 17.06.2006
Сообщений: 92,604
02.06.2017, 20:39
Помогаю со студенческими работами здесь

Как в php подключить jQuery
Здравствуйте я только начинаю учиться пхп поэтому сильно не критикуйте, Как в php подключить jQuery...

Как подключить скрипт jQuery к wordpress?
Здравствуйте! Знаю, вопрос очень дурацкий, но так как я в скриптах не шарю, прошу помощи у вас. ...

Как в yii модуле подключить jquery?
Добрый день. В клиентской части Jquery уже подключен из framework\web\js\source\ Я просто...

Как подключить jQuery-скрипт к кнопке
Я пишу сайт со страницей расчётов, на котором много кнопок. Я хочу привязать к каждой кнопке для ...


Искать еще темы с ответами

Или воспользуйтесь поиском по форуму:
6
Ответ Создать тему
КиберФорум - форум программистов, компьютерный форум, программирование
Powered by vBulletin
Copyright ©2000 - 2024, CyberForum.ru