Связать клиент и сервер

@Satansoft · Регистрация: 27.02.2012

Студворк — интернет-сервис помощи студентам

Клиент представлен формой, которую нужно отправить на сервер

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
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Register Form</title>
    <script src="http://code.jquery.com/jquery-2.1.4.min.js"></script>
    <style type="text/css">
        #n1 { margin: 0 0 0 23px;}
        #n3 { margin: 0 0 0 40px;}
        #n4 { margin: -20px 0 0 65px; }
        #block { text-align: center; }
        #radio { margin: 0 28px 0 0; }
        textarea { width: 165px; height: 100px;}
        button { padding: 0 80px; color: #f8f8f8; font-weight: bold; background: #000000; }
        #take {margin: 5px 3px 0 0; padding: 0 83px;}
        body { background: url(3.jpg); color: #fff; }
    </style>
</head>
<body>
    <div id="block">
        <form id="Form">
            <div class="field">
                <label class="lb" for="n1">Login</label>
                <input type="text" id="n1" name="login">
            </div>
            <div class="field">
                <label class="lb" for="n2">Password</label>
                <input type="password" id="n2" name="password">
            </div>
            <div class="field" id="radio">
                <label class="lb" for="n3">Gender</label>
                <input type="radio" id="n3" name="gender" value="male">Male
                <input type="radio" name="gender" value="female">Female
            </div>
            <div class="field">
                <label class="lb" for="n4">About</label>
                <br>
                <textarea id="n4" name="hobbies"></textarea></div>
            <div>
                <button type="submit" id="submit">Отправить</button>
            </div>
        </form>
    </div>

А сервер распихивает в БД

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
var mysql = require('mysql');
 
var connection = mysql.createConnection({
  host: 'localhost',
  user: 'root',
  password: 'gh6fgh5e',
  database: 'proj'
});
connection.connect();
 
var form = {
login: 'Lusia Dashnedash',
password: 'tropinkaks4astiu',
gender: 'female',
hobbies: 's4astie, urojau';
};
 
var query = connection.query('insert into articles set ?', form, function (err, result) {
  if (err) {
    console.error(err);
    return;
  }
  console.error(result);
});

Надобно, что бы форма слалась на сервер, домен которого http://newproject.pp.ua, обращалась к *js файлу обработчика, который форму по строкам в БД раскидает, как это делается? Есть поднятый nginx, может с ним стоит связать, иль лучше напрямую?

@Granfury · 29.11.2016, 10:50

Я делал так:
скрипт отправляет json на сервер метод post

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
$(document).ready(function(){
    var name;
    var email;
    var pass;
    $("#submit").click(function(){
        name=$("#userName").val();
        email=$("#userEmail").val();
        pass=$("#userPass").val();
        /*
        * Perform some validation here.
        */
        //Отправить json на /autorUser
        $.post('http://127.0.0.1:3000/registration',{name:name, email:email, pass:pass}, function(data){    
 
            //callback function(data) {...};
            if(data==='done')           
            {
            //Если функция обратного вызова вернет done 
            window.location.href="/home";
            } 
        });
    });
});

Обязательно подключить модули
var bodyParser = require('body-parser');
чтобы парсить post json - req.body.name;
И конечно модуль mysql - var mysql = require('mysql');

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
var express = require('express');
var mysql = require('mysql');
var sql = require('../config');
/*..
..*/
 
router.post('/registration', function(req, res, next) {
    
    req.session.UserName = req.body.name;
    req.session.UserEmail = req.body.email;
    req.session.Password = req.body.pass;
 
    sql.connection.query('INSERT INTO users SET ?', { 
      DB_USER: req.session.UserName,
      DB_EMAIL: req.session.UserEmail,
      DB_PASS: req.session.Password,
      DB_SESS: req.session.id },
       function(err, result) {
    if (err) throw err;
    res.end('done');
    });
  
});

config file

JavaScript
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
var mysql = require('mysql');
 
module.exports.options = {
    host: 'localhost',
    port: 3000,
    user: 'admin',
    password: 'admin',
    database: 'db'
};
 
module.exports.connection = mysql.createConnection({
    host: 'localhost',
    port: 3000,
    user: 'admin',
    password: 'admin',
    database: 'db'
});

Новые блоги и статьи Все статьи Все блоги /
Подключение Box2D v3 к SDL3 для Android: физика и отрисовка коллайдеров 8Observer8 29.01.2026 Содержание блога Box2D - это библиотека для 2D физики для анимаций и игр. С её помощью можно определять были ли коллизии между конкретными объектами. Версия v3 была полностью переписана на Си, в. . .	Инструменты COM: Сохранение данный из VARIANT в файл и загрузка из файла в VARIANT bedvit 28.01.2026 Сохранение базовых типов COM и массивов (одномерных или двухмерных) любой вложенности (деревья) в файл, с возможностью выбора алгоритмов сжатия и шифрования. Часть библиотеки BedvitCOM Использованы. . .	Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL_LoadPNG (без SDL3_image) 8Observer8 28.01.2026 Содержание блога SDL3 имеет собственные средства для загрузки и отображения PNG-файлов с альфа-каналом и базовой работы с ними. В этой инструкции используется функция SDL_LoadPNG(), которая. . .	Загрузка PNG с альфа-каналом на SDL3 для Android: с помощью SDL3_image 8Observer8 27.01.2026 Содержание блога SDL3_image - это библиотека для загрузки и работы с изображениями. Эта пошаговая инструкция покажет, как загрузить и вывести на экран смартфона картинку с альфа-каналом, то есть с. . .
Влияние грибов на сукцессию anaschu 26.01.2026 Бифуркационные изменения массы гриба происходят тогда, когда мы уменьшаем массу компоста в 10 раз, а скорость прироста биомассы уменьшаем в три раза. Скорость прироста биомассы может уменьшаться за. . .	Воспроизведение звукового файла с помощью SDL3_mixer при касании экрана Android 8Observer8 26.01.2026 Содержание блога SDL3_mixer - это библиотека я для воспроизведения аудио. В отличие от инструкции по добавлению текста код по проигрыванию звука уже содержится в шаблоне примера. Нужно только. . .	Установка Android SDK, NDK, JDK, CMake и т.д. 8Observer8 25.01.2026 Содержание блога Перейдите по ссылке: https:/ / developer. android. com/ studio и в самом низу страницы кликните по архиву "commandlinetools-win-xxxxxx_latest. zip" Извлеките архив и вы увидите. . .	Вывод текста со шрифтом TTF на Android с помощью библиотеки SDL3_ttf 8Observer8 25.01.2026 Содержание блога Если у вас не установлены Android SDK, NDK, JDK, и т. д. то сделайте это по следующей инструкции: Установка Android SDK, NDK, JDK, CMake и т. д. Сборка примера Скачайте. . .