Member 12435531 Ответов: 3

Node.js как сложить два числа?

Hy Я хочу создать клиент-сервер . Сервер находится внутри NOde.js и общайтесь со страницей hml/javascript.
Не могли бы вы кто-нибудь сделать мне один пример, как отправить node.js и вернуть сумму в html-файл для переменной в javascript?

Что я уже пробовал:

//demo.html
<!DOCTYPE html>
<html>
<body>

<h1>My First Heading</h1>


<form>
  First number:<br>
  <input type="number" name="firstnumber"><br>
  Second number:<br>
  <input type="number" name="lastnumber"><br><br>
	<input type="submit" value="Submit"><br><br><br>
    SUM:<br>
  <input type="number" name="answer">
</form>


</body>
</html>



//server.js
var http = require("http");
http.createServer(function(req, res) {
  res.writeHead(200, {"Content-Type": "text/plain"});
  res.end('Hello q\n');
}).listen(8080,'127.0.0.1');

console.log("Server is listening");

3 Ответов

Рейтинг:
1

Ali Majed HA

Привет

Пихты вы должны использовать с идентификатором вместо имени:

<input type="number" id="firstnumber"><br>

<button type="button" onclick="myFunction()">Submit</button>


и ваша функция js будет :

<script>
function myFunction() {
    var x, y;

    // Get the value of the input field with id="firstnumber"
    x = document.getElementById("firstnumber").value;

// Get the value of the input field with id="secondnumber"
    x = document.getElementById("secondnumber").value;

    // If x is Not a Number or less than one or greater than 10
    
    document.getElementById("answer").innerHTML = x + y;
}
</script>


надеюсь, это сработает
с уважением

Member 12435531

Привет

Спасибо Вам за ответ и помощь.
Сейчас работает:)

<!DOCTYPE html>







Мой Первый Заголовок


Первый номер:
Второй номер:

Ответ:




Теперь я хочу сделать так,чтобы функция вычислялась не в html, а в node.js на стороне сервера.
Основная цель-создать простую серверно-клиентскую связь.

Тха в формате HTML отправить данные node.js сервер, узел вычисления суммы цифр и отправить обратно в функцию JavaScript в HTML.

Ali Majed HA

Если это сработает, не могли бы вы принять и проголосовать за это решение? заранее спасибо

Keith Barrow

Ваше решение не отвечает на вопрос - оно принимает два входных значения и добавляет их, все на стороне клиента. NodeJS не участвует вообще, и нет никакого сервера.
Я не говорю, что ваше решение плохо, оно будет работать, но это не то, о чем вас просят.

Рейтинг:
1

Member 12435531 

<html>
<head><title>Sum of two numbers</title></head>

  <script>
  function myFunction() {
      var x, y,sum;
      x = parseFloat(document.getElementById('firstnumber').value);
      y = parseFloat(document.getElementById('secondnumber').value);
      sum = x + y;
      document.getElementById('answer').value = sum;
  }
  </script>


<body>
  <h1>My First Heading</h1>
  First number: <br> <input type="number" id="firstnumber"><br>
  Second number:<br> <input type="number" id="secondnumber"><br>
  <button type="button" onclick="myFunction()">Submit</button><br>
  Answer: <input type="number" id="answer">

</body>
</html>

Рейтинг:
0

Keith Barrow

Это более широкий вопрос, чем можно дать подробный ответ здесь. Ваш первый шаг - это решить, как вы хотите, чтобы ваш серверный API выглядел-обычно я бы предложил архитектуру REST, но здесь она применима только наполовину. В любом случае вам нужно определить схему URI, с которой будет связываться клиент. Я бы предложил что-то вроде:

http://hostname/calculator/add?param1=10¶m2=5

На HTTP GET - as вы получаете результат в противоположность этому. Я бы настоятельно рекомендовал node package express для этой работы:
Node.js Экспресс-Фреймворк[^]. Чтобы настроить конечную точку, вы должны сделать что-то вроде:

app.get('/calculator/add', function (req, res) {
    response = {
      result: req.query.param1 + req.query.param2,
   };
   res.end(JSON.stringify(response));
})


Выше, вероятно, понадобится некоторое футеровки - не знаете ли параметр1 &амп; параметр param2 будет результат в строку конкатенацию например или нет.
Вы можете проверить это, вызвав URL-адрес через расширение chrome "Postman" (Почтальон - Интернет-Магазин Chrome[^]). Даже эта схема имеет недостатки - вы привязываете клиента к предоставлению параметров - вы также можете захотеть иметь возможность поддерживать эту схему
http://hostname/calculator/add/10/5
Кроме того, вы должны думать о кодах состояния HTTP и о том, как обрабатывать ошибки и т. д.
Еще одна вещь, "отсутствующая" в этом простом коде, - это то, что мы предполагаем, что клиент хочет получить данные JSON-чтение заголовка запроса "Accept" более приемлемо, кроме того, мы должны установить заголовок ответа "Content-Type", чтобы отразить тот факт, что мы обслуживаем JSON (или что-то еще, если мы выполняем запрос Accept).

Для звонка от клиента вы можете просто использовать форму (возможно, вам придется изменить схему - формы, как правило, работают с POST) или использовать
объект XMLHttpRequest[^] чтобы сформировать вызов, вызовите сервер и используйте его событие onstatechange для получения ответа. Несмотря на свое название, этот объект используется для отправки/получения ответов JSON. Опять же, детали этого зависят от вашей схемы.

В конечном итоге, главное-это следить за проблемы ПДБС - вы, вероятно, не получите их с почтальоном, а потом вдруг ваш сервер перестает отвечать, когда вы запускаете клиента. Клиент, вероятно, сначала отправит запрос опций, который потерпит неудачу, так как ваш сервер предотвращает запросы CORS - вам нужно закодировать свой сервер, чтобы разрешить запросы из любого источника.

Есть о чем подумать! - Шаг первый-это получение сервера, отвечающего на запросы почтальона, я бы просто начал с того, который отвечает на обычный текст "Привет, мир".