Как отправить массив из html в node.js, а затем в mongodb? - PullRequest
Новая
       10

Как отправить массив из html в node.js, а затем в mongodb?

0 голосов
/ 16 сентября 2018

Необходимо отправить значения long и lat как один массив во входных данных, а затем сохранить его в базе данных.Нашел много примеров, объясняющих, как обращаться с массивами, но большинство из них на PHP.Вот код:

HTML 

<html>
<head>
    <script>
        function geoFindMe() {
            var coordinates = document.getElementById("coordinates");
            if (!navigator.geolocation) {
                alert("Geolocation is not supported by your browser");
                return;
            }
            function success(position) {
                var latitude  = position.coords.latitude;
                var longitude = position.coords.longitude;
                var coordinates = [longitude, latitude];
                document.getElementById("coordinates").value = coordinates;
            }
            function error() { alert("Unable to retrieve your location"); }
            navigator.geolocation.getCurrentPosition(success, error);
        }
    </script>
</head>
<body>   
    <label for="pos">Allow location service</label>
    <input name="pos" id="coordinates" type="checkbox" onclick="geoFindMe()" value="coordinates[]">
</body>
</html>

app.js 

app.post("/", (req, res) => {
    const newUser = new data({
        geometry: {
            type:'Point',
            coordinates: req.body.coordinates
        }
    });
});

data.js

const FindMyLocation = new Schema({
    geometry: {
        type: {
            type: String,
            default: 'Point'
        },
        coordinates: {
            type:[Number],
            index: '2dsphere'
        }
    }
});

Спасибо за внимание.

Ответы [ 3 ]

0 голосов
/ 17 сентября 2018

Чтобы отправить данные формы, добавьте вызов jQuery Ajax в свой HTML-скрипт: 

function geoFindMe() {
    // get input's value
    var coordinates = document.getElementById("coordinates").value;
    // post coordinates to "/"
    $.ajax({
        type: "POST",
        url: "/",
        data: coordinates,
        success: function() {
            // do things if successful
        }
    });
}

Чтобы получить данные формы HTML в Express, вам необходимо использовать промежуточное программное обеспечение body-parser. Кроме того, имя свойства объекта, к которому вы обращаетесь к данным, основано на атрибуте name ввода HTML, а не id. 

const bodyParser = require('body-parser');
app.use(bodyParser.json());

app.post("/", (req, res) => {
    const newUser = new data({
        geometry: {
            type:'Point',
            coordinates: req.body.pos
            // property is "pos" because form input name is "pos"
        }
    });
});

И затем, чтобы вставить данные в MongoDB через Mongoose, вы должны сделать что-то вроде этого: 

newUser.save().then(() => console.log('user saved'));
0 голосов
/ 17 сентября 2018

Вы можете использовать jquery ajax, так как он широко используется в браузерах для вызова API.Это отправляет данные из браузера на сервер.

это часть только javaScript, поэтому не запутайтесь.

Будет использоваться встроенный script и только дополнительный необходимый вам код.

При установке значения ввода, например <input value ="coordinates[]"> Вы не устанавливаете какой-либо массив как значение, это просто строка.Как и Var A = "координаты []";a - это не массив, а просто строка.

HTML и JS: 

<body>
    <label for="pos">Allow location service</label>
    <input name="pos" id="coordinates" type="checkbox" onclick="geoFindMe()">
    <p onClick="sendCoordinatesToNode()">Click Here to Send Coordinates To NodeJs</p>

</body>
<script type="text/javascript" src="https://code.jquery.com/jquery-3.3.1.min.js"></script>
<script>
    function sendCoordinatesToNode() {
        var coordinates = $('#coordinates').val();

        $.ajax({
            "url": "http://localhost:4000/", // this is url path of your API or just "/"
            "method": "POST",
            "data": {coordinates}
            // Feel free to set headers if needed, like content-type: application/json
        })
        // If API returned success then here
        .then( result => {
            // Message to notify success submition
            alert("Successfully added user.");
            return;
        })
        // If API returned error then here
        .catch ( err => {
            // Notify in case some error occurred
            alert("An error occurred.");
            return;
        });
    }
</script>

Теперь вы сможете получить координаты в req.body.coordinates;

0 голосов
/ 17 сентября 2018

Использование Ajax для вызова API для отправки запроса. 

<script>
        function geoFindMe() {
            var coordinates = document.getElementById("coordinates");
            if (!navigator.geolocation) {
                alert("Geolocation is not supported by your browser");
                return;
            }
            function success(position) {
                var latitude  = position.coords.latitude;
                var longitude = position.coords.longitude;
                var coordinates = [longitude, latitude];
                document.getElementById("coordinates").value = coordinates;
                var xhttp = new XMLHttpRequest();
                xhttp.open("POST",URL, true);
                xhttp.setRequestHeader('Content-type','application/json; charset=utf-8');
                xhttp.send(JSON.stringify({"coordinates":coordinates}));
            }
            function error() { alert("Unable to retrieve your location"); }
            navigator.geolocation.getCurrentPosition(success, error);
        }
    </script>

в вашем API вам понадобится пакет mongoose или mongodb для вставки 

var data = require('data.js');
app.post("/", (req, res) => {
    const newUser = new data({
        geometry: {
            type:'Point',
            coordinates: req.body.coordinates
        }
    });
newUser.save(err => {
if (err) return res.status(500).send(err);
return res.status(200).send("your success message");
});

В вашем data.js вам понадобится конец файла, чтобы он мог быть доступен. 

module.exports = mongoose.model('FindMyLocation', FindMyLocation );
Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...