Hướng dẫn how connect nodejs with html? - cách kết nối nodejs với html?

Tôi mới sử dụng Node.js và tôi đang cố gắng tạo một cách dễ dàng để người dùng nhập dữ liệu vào biểu mẫu HTML, sau đó khi nhấp vào gửi dữ liệu được chuyển đến tập lệnh Node.js. Tập lệnh Node.js là một tập lệnh bài đăng lấy dữ liệu được nhập của người dùng và sau đó tạo một bài đăng lên API và nhận được trả lại trong JSON từ API. Tôi đang cố gắng để JSON trả lại để được in lại trên trang HTML. Làm thế nào để bạn làm điều này một cách sạch sẽ và dễ dàng?

<!DOCTYPE html>
<html>
  <head>
    <meta charset="UTF-8">
    <title>Commute | Ad-hoc</title>
      <link rel="stylesheet" href="css/style.css">
      <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" type="text/javascript"></script>

  </head>

  <body>

      <div class="container cf">

      <div class="container cf">
  <div>
     <h2>Manual Query</h2>
    <label>Mode</label>
    <select id="modes">
      <option value="driving">Driving</option>
           <option value="walking">Walking</option>
           <option value="cycling">Cycling</option>
      </select>
    <label>Latitude Origin</label>
    <input type="text" name="latitude_origin" id="latitude_origin" value="37.791871">
    <label>Longitude Origin</label>
    <input type="text" name="longitude_origin" id="longitude_origin" value = "-122.396742">
    <label>Latitude Destination</label>
    <input type="text" name="latitude_dest" id="latitude_dest" value = "37.782461">
    <label>Longitude Destination</label>
    <input type="text" name="longitude_dest" id="longitude_dest" value = "-122.454807">
    <button id="singleQuery" class="singleQuery" input type="default small">Run</button>
  </div>
  <div>
    <h2>Multi-Query (.tsv)</h2>
    <label>Upload</label>
    <input type="file" name="pic" id="laserPrinters">
    <button id="testLaser" class="default small" input type="default small">Run</button>
  </div>
  <div>
    <h2>Result</h2>
    <textarea rows="4" cols="50">  </textarea>
  </body>
</html>


<script type="text/javascript">

var mode = $("#modes").val();
var latitude_origin = $("#latitude_origin").val();
var longitude_origin = $("#longitude_origin").val();
var latitude_dest = $("#latitude_dest").val();
var longitude_dest = $("#longitude_dest").val();

</script>

Tập lệnh bài đăng Node.js của tôi:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});

Tác giả đã chọn Quỹ Cứu trợ Covid-19 để nhận quyên góp như một phần của Chương trình Viết cho Đóng góp.

Giới thiệu

Khi bạn xem một trang web trong trình duyệt của mình, bạn đang yêu cầu một máy tính khác trên internet, sau đó cung cấp cho bạn trang web như một phản hồi. Máy tính mà bạn đang nói chuyện qua Internet là một máy chủ web. Một máy chủ web nhận được các yêu cầu HTTP từ máy khách, như trình duyệt của bạn và cung cấp phản hồi HTTP, như trang HTML hoặc JSON từ API.

Rất nhiều phần mềm được tham gia cho một máy chủ để trả về một trang web. Phần mềm này thường rơi vào hai loại: frontend và phụ trợ. Mã mặt trước quan tâm đến cách trình bày nội dung, chẳng hạn như màu của thanh điều hướng và kiểu dáng văn bản. Mã back-end quan tâm đến cách dữ liệu được trao đổi, xử lý và lưu trữ. Mã xử lý các yêu cầu mạng từ trình duyệt của bạn hoặc giao tiếp với cơ sở dữ liệu chủ yếu được quản lý bởi mã back-end.

Node.js cho phép các nhà phát triển sử dụng JavaScript để viết mã back-end, mặc dù theo truyền thống, nó đã được sử dụng trong trình duyệt để viết mã mặt trước. Có cả phía trước và phụ trợ cùng nhau như thế này làm giảm nỗ lực để tạo một máy chủ web, đó là một lý do chính khiến Node.js là một lựa chọn phổ biến để viết mã back-end.

Trong hướng dẫn này, bạn sẽ tìm hiểu cách xây dựng các máy chủ web bằng mô -đun

const http = require("http");
7 có trong Node.js. Bạn sẽ xây dựng các máy chủ web có thể trả về dữ liệu JSON, tệp CSV và các trang web HTML.

Điều kiện tiên quyết

  • Đảm bảo rằng Node.js được cài đặt trên máy phát triển của bạn. Hướng dẫn này sử dụng Node.js phiên bản 10.19.0. Để cài đặt điều này trên macOS hoặc Ubuntu 18.04, hãy làm theo các bước trong cách cài đặt Node.js và tạo môi trường phát triển cục bộ trên macOS hoặc cài đặt bằng phần PPA về cách cài đặt Node.js trên Ubuntu 18.04.Installing Using a PPA section of How To Install Node.js on Ubuntu 18.04.
  • Nền tảng Node.js hỗ trợ tạo máy chủ web ra khỏi hộp. Để bắt đầu, hãy chắc chắn rằng bạn đã quen thuộc với những điều cơ bản của Node.js. Bạn có thể bắt đầu bằng cách xem xét hướng dẫn của chúng tôi về cách viết và chạy chương trình đầu tiên của bạn trong Node.js.
  • Chúng tôi cũng sử dụng lập trình không đồng bộ cho một trong các phần của chúng tôi. Nếu bạn không quen thuộc với lập trình không đồng bộ trong Node.js hoặc mô -đun
    const http = require("http");
    
    8 để tương tác với các tệp, bạn có thể tìm hiểu thêm với bài viết của chúng tôi về cách viết mã không đồng bộ trong Node.js.

Bước 1 - Tạo máy chủ HTTP cơ bản

Hãy để bắt đầu bằng cách tạo một máy chủ trả về văn bản đơn giản cho người dùng. Điều này sẽ bao gồm các khái niệm chính cần thiết để thiết lập một máy chủ, sẽ cung cấp nền tảng cần thiết để trả về các định dạng dữ liệu phức tạp hơn như JSON.

Đầu tiên, chúng ta cần thiết lập một môi trường mã hóa có thể truy cập để thực hiện các bài tập của mình, cũng như các bài tập khác trong bài viết. Trong thiết bị đầu cuối, tạo một thư mục gọi là

const http = require("http");
9:

  1. mkdir first-servers

Sau đó nhập thư mục đó:

  1. cd first-servers

Bây giờ, hãy tạo tệp sẽ chứa mã:

  1. touch hello.js

Mở tệp trong trình soạn thảo văn bản. Chúng tôi sẽ sử dụng

...
const host = 'localhost';
const port = 8000;
0 vì nó có sẵn trong thiết bị đầu cuối:

  1. nano hello.js

Chúng tôi bắt đầu bằng cách tải mô -đun

const http = require("http");
7 tiêu chuẩn mà với tất cả các cài đặt Node.js. Thêm dòng sau vào
...
const host = 'localhost';
const port = 8000;
2:

first-servers/hello.js

const http = require("http");

Mô -đun

const http = require("http");
7 chứa hàm để tạo máy chủ mà chúng ta sẽ thấy sau này. Nếu bạn muốn tìm hiểu thêm về các mô -đun trong Node.js, hãy xem cách tạo bài viết mô -đun Node.js.

Bước tiếp theo của chúng tôi sẽ là xác định hai hằng số, máy chủ và cổng mà máy chủ của chúng tôi sẽ bị ràng buộc:

first-servers/hello.js

...
const host = 'localhost';
const port = 8000;

Như đã đề cập trước đó, các máy chủ web chấp nhận các yêu cầu từ trình duyệt và các máy khách khác. Chúng tôi có thể tương tác với một máy chủ web bằng cách nhập một tên miền, được dịch sang địa chỉ IP bởi máy chủ DNS. Địa chỉ IP là một chuỗi các số duy nhất xác định máy trên mạng, như Internet. Để biết thêm thông tin về các khái niệm tên miền, hãy xem phần giới thiệu về thuật ngữ, thành phần và khái niệm của DNS.

Giá trị

...
const host = 'localhost';
const port = 8000;
4 là một địa chỉ riêng tư đặc biệt mà máy tính sử dụng để chỉ chúng. Nó thường tương đương với địa chỉ IP nội bộ
...
const host = 'localhost';
const port = 8000;
5 và nó chỉ có sẵn cho máy tính cục bộ, không phải cho bất kỳ mạng cục bộ nào mà chúng tôi đã tham gia hoặc vào Internet.

Cổng là một số mà các máy chủ sử dụng làm điểm cuối hoặc cửa ra vào địa chỉ IP của chúng tôi. Trong ví dụ của chúng tôi, chúng tôi sẽ sử dụng cổng

...
const host = 'localhost';
const port = 8000;
6 cho máy chủ web của chúng tôi. Các cổng
...
const host = 'localhost';
const port = 8000;
7 và
...
const host = 'localhost';
const port = 8000;
6 thường được sử dụng làm cổng mặc định đang phát triển và trong hầu hết các trường hợp, các nhà phát triển sẽ sử dụng chúng thay vì các cổng khác cho các máy chủ HTTP.

Khi chúng tôi liên kết máy chủ của mình với máy chủ và cổng này, chúng tôi sẽ có thể tiếp cận máy chủ của mình bằng cách truy cập

...
const host = 'localhost';
const port = 8000;
9 trong trình duyệt cục bộ.

Hãy để thêm một chức năng đặc biệt, trong Node.js, chúng tôi gọi người nghe yêu cầu. Hàm này có nghĩa là để xử lý một yêu cầu HTTP đến và trả về phản hồi HTTP. Hàm này phải có hai đối số, đối tượng yêu cầu và đối tượng phản hồi. Đối tượng yêu cầu nắm bắt tất cả dữ liệu của yêu cầu HTTP mà Lừa đến. Đối tượng phản hồi được sử dụng để trả về các phản hồi HTTP cho máy chủ.

Chúng tôi muốn máy chủ đầu tiên của chúng tôi trả về thông báo này bất cứ khi nào ai đó truy cập nó:

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
0.

Hãy để thêm chức năng đó tiếp theo:

Máy chủ đầu tiên/Hello.js

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};

Hàm thường sẽ được đặt tên dựa trên những gì nó làm. Ví dụ: nếu chúng tôi tạo chức năng người nghe yêu cầu trả về danh sách các cuốn sách, chúng tôi có thể sẽ đặt tên cho nó

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
1. Vì đây là trường hợp mẫu, chúng tôi sẽ sử dụng tên chung
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
2.

Tất cả các hàm người nghe yêu cầu trong Node.js chấp nhận hai đối số:

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
3 và
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
4 (chúng ta có thể đặt tên cho chúng khác nhau nếu chúng ta muốn). Yêu cầu HTTP mà người dùng gửi được ghi lại trong một đối tượng yêu cầu, tương ứng với đối số đầu tiên,
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
3. Phản hồi HTTP mà chúng tôi quay lại cho người dùng được hình thành bằng cách tương tác với đối tượng phản hồi trong đối số thứ hai,
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
4.

Dòng đầu tiên

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
7 đặt mã trạng thái HTTP của phản hồi. Mã trạng thái HTTP cho biết mức độ yêu cầu HTTP được xử lý tốt như thế nào. Trong trường hợp này, mã trạng thái
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
8 tương ứng với
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
9. Nếu bạn quan tâm đến việc tìm hiểu về các mã HTTP khác nhau mà các máy chủ web của bạn có thể trả về với ý nghĩa mà chúng biểu thị, hướng dẫn của chúng tôi về cách khắc phục mã lỗi HTTP thông thường là một nơi tốt để bắt đầu.

Dòng tiếp theo của hàm,

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
0, viết phản hồi HTTP lại cho khách hàng yêu cầu. Hàm này trả về bất kỳ dữ liệu nào mà máy chủ phải trả về. Trong trường hợp này, nó trả về dữ liệu văn bản.

Cuối cùng, bây giờ chúng tôi có thể tạo máy chủ của mình và sử dụng trình nghe yêu cầu của chúng tôi:

Máy chủ đầu tiên/Hello.js

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});

Hàm thường sẽ được đặt tên dựa trên những gì nó làm. Ví dụ: nếu chúng tôi tạo chức năng người nghe yêu cầu trả về danh sách các cuốn sách, chúng tôi có thể sẽ đặt tên cho nó

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
1. Vì đây là trường hợp mẫu, chúng tôi sẽ sử dụng tên chung
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
2.

Tất cả các hàm người nghe yêu cầu trong Node.js chấp nhận hai đối số:

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
3 và
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
4 (chúng ta có thể đặt tên cho chúng khác nhau nếu chúng ta muốn). Yêu cầu HTTP mà người dùng gửi được ghi lại trong một đối tượng yêu cầu, tương ứng với đối số đầu tiên,
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
3. Phản hồi HTTP mà chúng tôi quay lại cho người dùng được hình thành bằng cách tương tác với đối tượng phản hồi trong đối số thứ hai,
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
4.

Dòng đầu tiên

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
7 đặt mã trạng thái HTTP của phản hồi. Mã trạng thái HTTP cho biết mức độ yêu cầu HTTP được xử lý tốt như thế nào. Trong trường hợp này, mã trạng thái
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
8 tương ứng với
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
9. Nếu bạn quan tâm đến việc tìm hiểu về các mã HTTP khác nhau mà các máy chủ web của bạn có thể trả về với ý nghĩa mà chúng biểu thị, hướng dẫn của chúng tôi về cách khắc phục mã lỗi HTTP thông thường là một nơi tốt để bắt đầu.

Dòng tiếp theo của hàm,

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
0, viết phản hồi HTTP lại cho khách hàng yêu cầu. Hàm này trả về bất kỳ dữ liệu nào mà máy chủ phải trả về. Trong trường hợp này, nó trả về dữ liệu văn bản.

Cuối cùng, bây giờ chúng tôi có thể tạo máy chủ của mình và sử dụng trình nghe yêu cầu của chúng tôi:

Lưu và thoát

...
const host = 'localhost';
const port = 8000;
0 bằng cách nhấn
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
2.
Even though
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 does not use the
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
3 object, it must still be the first argument of the function.

Trong dòng đầu tiên, chúng tôi tạo một đối tượng

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
3 mới thông qua hàm
const http = require("http");
7 ____ ____995. Máy chủ này chấp nhận các yêu cầu HTTP và truyền chúng vào chức năng
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 của chúng tôi.

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
0

Sau khi chúng tôi tạo máy chủ của mình, chúng tôi phải liên kết nó với một địa chỉ mạng. Chúng tôi làm điều đó với phương pháp

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
7. Nó chấp nhận ba đối số:
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
8,
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
9 và chức năng gọi lại bắn khi máy chủ bắt đầu nghe.

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
1

Tất cả các đối số này là tùy chọn, nhưng bạn nên nêu rõ ràng cổng và máy chủ mà chúng tôi muốn một máy chủ web sử dụng. Khi triển khai các máy chủ web đến các môi trường khác nhau, việc biết cổng và máy chủ, nó đang chạy được yêu cầu để thiết lập cân bằng tải hoặc bí danh DNS.

Trong một cửa sổ thiết bị đầu cuối riêng biệt, chúng tôi sẽ liên lạc với máy chủ bằng Curl, một công cụ CLI để truyền dữ liệu đến và từ mạng. Nhập lệnh để thực hiện yêu cầu HTTP

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
02 vào máy chủ đang chạy của chúng tôi:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
2

Khi chúng tôi nhấn

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
03, thiết bị đầu cuối của chúng tôi sẽ hiển thị đầu ra sau:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
3

Bây giờ chúng tôi đã thiết lập một máy chủ và nhận được phản hồi máy chủ đầu tiên của chúng tôi.

Hãy để phá vỡ những gì đã xảy ra khi chúng tôi thử nghiệm máy chủ của chúng tôi. Sử dụng Curl, chúng tôi đã gửi yêu cầu

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
02 đến máy chủ tại
...
const host = 'localhost';
const port = 8000;
9. Máy chủ Node.js của chúng tôi đã nghe các kết nối từ địa chỉ đó. Máy chủ đã chuyển yêu cầu đó cho chức năng
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6. Hàm được trả về dữ liệu văn bản với mã trạng thái
...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
8. Sau đó, máy chủ đã gửi phản hồi đó trở lại Curl, trong đó hiển thị thông báo trong thiết bị đầu cuối của chúng tôi.

Trước khi chúng tôi tiếp tục, hãy để thoát khỏi máy chủ đang chạy của chúng tôi bằng cách nhấn

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
08. Điều này làm gián đoạn việc thực hiện máy chủ của chúng tôi, đưa chúng tôi trở lại dấu nhắc dòng lệnh.

Trong hầu hết các trang web chúng tôi truy cập hoặc API chúng tôi sử dụng, các phản hồi của máy chủ hiếm khi bằng văn bản đơn giản. Chúng tôi nhận được các trang HTML và dữ liệu JSON làm định dạng phản hồi phổ biến. Trong bước tiếp theo, chúng tôi sẽ tìm hiểu cách trả về các phản hồi HTTP trong các định dạng dữ liệu phổ biến mà chúng tôi gặp phải trên web.

Bước 2 - Trả về các loại nội dung khác nhau

Phản hồi chúng tôi trở lại từ một máy chủ web có thể có nhiều định dạng khác nhau. JSON và HTML đã được đề cập trước đó và chúng tôi cũng có thể trả về các định dạng văn bản khác như XML và CSV. Cuối cùng, các máy chủ web có thể trả về dữ liệu không phải là văn bản như PDFS, tệp có khóa, âm thanh và video.

Trong bài viết này, ngoài văn bản đơn giản chúng tôi vừa trả lại, bạn sẽ học cách trả về các loại dữ liệu sau:

  • Json
  • CSV
  • HTML

Ba loại dữ liệu đều dựa trên văn bản và là các định dạng phổ biến để cung cấp nội dung trên web. Nhiều ngôn ngữ và công cụ phát triển phía máy chủ có hỗ trợ trả về các loại dữ liệu khác nhau này. Trong bối cảnh của Node.js, chúng ta cần phải làm hai điều:

  1. Đặt tiêu đề
    var request = require("request");
    
    var options = { method: 'POST',
      url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
      headers:
       { 'postman-token': 'blah',
         'cache-control': 'no-cache' },
      body: '{"query1":[latitude_dest,longitude_dest]}' };
    
    request(options, function (error, response, body) {
      if (error) throw new Error(error);
    
      console.log(body);
    });
    
    09 trong các phản hồi HTTP của chúng tôi với giá trị phù hợp.
  2. Đảm bảo rằng
    var request = require("request");
    
    var options = { method: 'POST',
      url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
      headers:
       { 'postman-token': 'blah',
         'cache-control': 'no-cache' },
      body: '{"query1":[latitude_dest,longitude_dest]}' };
    
    request(options, function (error, response, body) {
      if (error) throw new Error(error);
    
      console.log(body);
    });
    
    10 có được dữ liệu ở định dạng phù hợp.

Hãy cùng xem điều này trong hành động với một số ví dụ. Mã chúng tôi sẽ viết trong phần này và sau này có nhiều điểm tương đồng với mã chúng tôi đã viết trước đây. Hầu hết các thay đổi tồn tại trong hàm

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6. Hãy để tạo ra các tệp với mã mẫu này, mã hóa này để làm cho các phần trong tương lai dễ theo dõi hơn.

Tạo một tệp mới gọi là

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
12. Tệp này sẽ được sử dụng sau để trả về văn bản HTML trong phản hồi HTTP. Chúng tôi sẽ đặt mã mẫu ở đây và sao chép nó vào các máy chủ khác trả về nhiều loại khác nhau.

Trong thiết bị đầu cuối, nhập như sau:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
4

Bây giờ hãy mở tệp này trong trình soạn thảo văn bản:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
5

Hãy để sao chép mã mẫu. Nhập cái này vào

...
const host = 'localhost';
const port = 8000;
0:

first-servers/html.js

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
6

Lưu và thoát

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
12 với
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
2, sau đó quay lại thiết bị đầu cuối.

Bây giờ, hãy để sao chép tệp này vào hai tệp mới. Tệp đầu tiên sẽ là trả về dữ liệu CSV trong phản hồi HTTP:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
7

Tệp thứ hai sẽ trả về phản hồi JSON trong máy chủ:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
8

Các tệp còn lại sẽ dành cho các bài tập sau:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
9

Bây giờ chúng tôi đã thiết lập để tiếp tục các bài tập của chúng tôi. Hãy bắt đầu với việc trả lại JSON.

Phục vụ JSON

Ký hiệu đối tượng JavaScript, thường được gọi là JSON, là định dạng trao đổi dữ liệu dựa trên văn bản. Như tên của nó cho thấy, nó có nguồn gốc từ các đối tượng JavaScript, nhưng nó độc lập với ngôn ngữ, có nghĩa là nó có thể được sử dụng bởi bất kỳ ngôn ngữ lập trình nào có thể phân tích cú pháp của nó.

JSON thường được API sử dụng để chấp nhận và trả về dữ liệu. Sự phổ biến của nó là do kích thước truyền dữ liệu thấp hơn so với các tiêu chuẩn trao đổi dữ liệu trước đây như XML, cũng như công cụ tồn tại cho phép các chương trình phân tích chúng mà không cần nỗ lực quá mức. Nếu bạn muốn tìm hiểu thêm về JSON, bạn có thể đọc hướng dẫn của chúng tôi về cách làm việc với JSON trong JavaScript.

Mở tệp

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
16 bằng
...
const host = 'localhost';
const port = 8000;
0:

  1. mkdir first-servers
0

Chúng tôi muốn trả lại phản hồi JSON. Hãy để sửa đổi chức năng

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 để trả về tiêu đề thích hợp mà tất cả các phản hồi JSON có bằng cách thay đổi các dòng được tô sáng như vậy:

first-servers/json.js

  1. mkdir first-servers
1

Phương thức

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
19 thêm một tiêu đề HTTP vào phản hồi. Tiêu đề HTTP là thông tin bổ sung có thể được đính kèm với yêu cầu hoặc phản hồi. Phương thức
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
19 có hai đối số: tên tiêu đề và giá trị của nó.

Tiêu đề

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
09 được sử dụng để chỉ định định dạng của dữ liệu, còn được gọi là loại phương tiện, mà được gửi với yêu cầu hoặc phản hồi. Trong trường hợp này
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
09 của chúng tôi là
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
23.

Bây giờ, hãy để trả về nội dung JSON cho người dùng. Sửa đổi

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
16 vì vậy có vẻ như sau:

first-servers/json.js

  1. mkdir first-servers
2

Giống như trước đây, chúng tôi nói với người dùng rằng yêu cầu của họ đã thành công bằng cách trả về mã trạng thái là

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
8. Lần này trong cuộc gọi
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
26, đối số chuỗi của chúng tôi chứa JSON hợp lệ.

Lưu và thoát

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
16 bằng cách nhấn
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
2. Bây giờ, hãy để Lừa chạy máy chủ với lệnh
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
29:

  1. mkdir first-servers
3

Trong một thiết bị đầu cuối khác, hãy để tiếp cận với máy chủ bằng cách sử dụng Curl:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
2

Khi chúng tôi nhấn

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
03, chúng ta sẽ thấy kết quả sau:

  1. mkdir first-servers
5

Bây giờ chúng tôi đã trả lời thành công một phản hồi JSON, giống như nhiều API phổ biến mà chúng tôi tạo ra. Hãy chắc chắn thoát khỏi máy chủ đang chạy với

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
08 để chúng tôi có thể quay lại dấu nhắc thiết bị đầu cuối tiêu chuẩn. Tiếp theo, hãy để Lôi nhìn vào một định dạng phổ biến khác của dữ liệu trả về: CSV.

Phục vụ CSV

Định dạng tệp các giá trị phân tách dấu phẩy (CSV) là một tiêu chuẩn văn bản mà thường được sử dụng để cung cấp dữ liệu bảng. Trong hầu hết các trường hợp, mỗi hàng được phân tách bằng một dòng mới và mỗi mục trong hàng được phân tách bằng dấu phẩy.

Trong không gian làm việc của chúng tôi, hãy mở tệp

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
32 với trình soạn thảo văn bản:

  1. mkdir first-servers
6

Hãy để thêm các dòng sau vào chức năng

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 của chúng tôi:

first-servers/csv.js

  1. mkdir first-servers
7

Lần này,

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
09 của chúng tôi chỉ ra rằng tệp CSV đang được trả về vì giá trị là
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
35. Tiêu đề thứ hai chúng tôi thêm là
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
36. Tiêu đề này cho trình duyệt biết cách hiển thị dữ liệu, đặc biệt là trong trình duyệt hoặc dưới dạng tệp riêng.

Khi chúng tôi trả về các phản hồi CSV, hầu hết các trình duyệt hiện đại sẽ tự động tải xuống tệp ngay cả khi tiêu đề

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
36 không được đặt. Tuy nhiên, khi trả lại một tệp CSV, chúng tôi vẫn nên thêm tiêu đề này vì nó cho phép chúng tôi đặt tên của tệp CSV. Trong trường hợp này, chúng tôi báo hiệu cho trình duyệt rằng tệp CSV này là một tệp đính kèm và nên được tải xuống. Sau đó, chúng tôi nói với trình duyệt rằng tên tệp tên là
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
38.

Hãy cùng viết dữ liệu CSV trong phản hồi HTTP:

first-servers/csv.js

  1. mkdir first-servers
8

Giống như trước khi chúng tôi trả lại trạng thái ________ 88/________ 140 với phản hồi của chúng tôi. Lần này, cuộc gọi của chúng tôi đến

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
10 có một chuỗi mà một CSV hợp lệ. Dấu phẩy phân tách giá trị trong mỗi cột và ký tự dòng mới (
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
42) tách các hàng. Chúng tôi có hai hàng, một cho tiêu đề bảng và một cho dữ liệu.

Chúng tôi sẽ kiểm tra máy chủ này trong trình duyệt. Lưu

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
32 và thoát trình soạn thảo với
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
2.

Chạy máy chủ bằng lệnh node.js:

  1. mkdir first-servers
9

Trong một thiết bị đầu cuối khác, hãy để tiếp cận với máy chủ bằng cách sử dụng Curl:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
2

Bảng điều khiển sẽ hiển thị điều này:

  1. cd first-servers
1

Nếu chúng tôi truy cập

...
const host = 'localhost';
const port = 8000;
9 trong trình duyệt của chúng tôi, một tệp CSV sẽ được tải xuống. Tên tệp của nó sẽ là
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
38.

Thoát khỏi máy chủ đang chạy bằng

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
08 để trở lại dấu nhắc đầu cuối tiêu chuẩn.

Sau khi trả lại JSON và CSV, chúng tôi đã bao gồm hai trường hợp phổ biến cho API. Hãy cùng chuyển sang cách chúng tôi trả về dữ liệu cho các trang web mà mọi người xem trong trình duyệt.

Phục vụ HTML

HTML, Ngôn ngữ đánh dấu siêu văn bản, là định dạng phổ biến nhất để sử dụng khi chúng tôi muốn người dùng tương tác với máy chủ của chúng tôi thông qua trình duyệt web. Nó được tạo ra để cấu trúc nội dung web. Các trình duyệt web được xây dựng để hiển thị nội dung HTML, cũng như bất kỳ kiểu nào chúng tôi thêm vào CSS, một công nghệ web phía trước khác cho phép chúng tôi thay đổi tính thẩm mỹ của các trang web của chúng tôi.

Hãy để lại mở lại

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
12 với trình soạn thảo văn bản của chúng tôi:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
5

Sửa đổi chức năng

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 để trả về tiêu đề
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
09 thích hợp cho phản hồi HTML:

first-servers/html.js

  1. cd first-servers
3

Bây giờ, hãy để lại trả về nội dung HTML cho người dùng. Thêm các dòng được tô sáng vào

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
12 để có vẻ như sau:

Máy chủ đầu tiên/HTML.JS

  1. cd first-servers
4

Trước tiên chúng tôi thêm mã trạng thái HTTP. Sau đó, chúng tôi gọi

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
26 với một đối số chuỗi chứa HTML hợp lệ. Khi chúng tôi truy cập máy chủ của mình trong trình duyệt, chúng tôi sẽ thấy một trang HTML có một thẻ tiêu đề chứa
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
53.

Hãy để lưu và thoát bằng cách nhấn

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
2. Bây giờ, hãy để Lừa chạy máy chủ với lệnh
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
29:

  1. cd first-servers
5

Chúng tôi sẽ thấy

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
56 khi chương trình của chúng tôi đã bắt đầu.

Bây giờ đi vào trình duyệt và truy cập

...
const host = 'localhost';
const port = 8000;
9. Trang của chúng tôi sẽ trông như thế này:

Hướng dẫn how connect nodejs with html? - cách kết nối nodejs với html?

Hãy để thoát khỏi máy chủ đang chạy với

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
08 và quay lại dấu nhắc thiết bị đầu cuối tiêu chuẩn.

Nó phổ biến cho HTML được viết trong một tệp, tách biệt với mã phía máy chủ như các chương trình Node.js của chúng tôi. Tiếp theo, hãy để Lừa xem cách chúng ta có thể trả lại các phản hồi HTML từ các tệp.

Bước 3 - Phục vụ trang HTML từ tệp

Chúng tôi có thể phục vụ HTML dưới dạng các chuỗi trong Node.js cho người dùng, nhưng nó tốt hơn là chúng tôi tải các tệp HTML và phục vụ nội dung của chúng. Bằng cách này, khi tệp HTML phát triển, chúng tôi không thể duy trì các chuỗi dài trong mã Node.js của chúng tôi, giữ cho nó ngắn gọn hơn và cho phép chúng tôi làm việc trên từng khía cạnh của trang web của chúng tôi một cách độc lập. Sự phân tách mối quan tâm này là phổ biến trong nhiều thiết lập phát triển web, vì vậy, thật tốt khi biết cách tải các tệp HTML để hỗ trợ nó trong Node.js

Để phục vụ các tệp HTML, chúng tôi tải tệp HTML với mô -đun

const http = require("http");
8 và sử dụng dữ liệu của nó khi viết phản hồi HTTP của chúng tôi.

Đầu tiên, chúng tôi sẽ tạo một tệp HTML mà máy chủ web sẽ trả về. Tạo tệp HTML mới:

  1. cd first-servers
6

Bây giờ mở

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
60 trong trình soạn thảo văn bản:

  1. cd first-servers
7

Trang web của chúng tôi sẽ được tối thiểu. Nó sẽ có một nền màu cam và sẽ hiển thị một số văn bản chào hỏi ở trung tâm. Thêm mã này vào tệp:

first-servers/index.html

  1. cd first-servers
8

Trang web duy nhất này hiển thị hai dòng văn bản:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
61 và
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
62. Các dòng xuất hiện ở trung tâm của trang, một trên nhau. Dòng văn bản đầu tiên được hiển thị trong một tiêu đề, có nghĩa là nó sẽ lớn. Dòng văn bản thứ hai sẽ xuất hiện nhỏ hơn một chút. Tất cả các văn bản sẽ xuất hiện màu trắng và trang web có nền màu cam.

Mặc dù nó không phải là phạm vi của bài viết hoặc loạt bài này, nhưng nếu bạn quan tâm đến việc tìm hiểu thêm về HTML, CSS và các công nghệ web phía trước khác, bạn có thể xem Mozilla, bắt đầu với hướng dẫn web.

Đó là tất cả những gì chúng ta cần cho HTML, vì vậy hãy lưu và thoát tệp bằng

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
2. Bây giờ chúng ta có thể chuyển sang mã máy chủ.

Đối với bài tập này, chúng tôi sẽ làm việc trên

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
64. Mở nó với Trình chỉnh sửa văn bản:

  1. cd first-servers
9

Khi chúng ta phải đọc một tệp, hãy để bắt đầu bằng cách nhập mô -đun

const http = require("http");
8:

first-servers/htmlFile.js

  1. touch hello.js
0

Mô -đun này chứa hàm

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
66 mà chúng tôi sẽ sử dụng để tải tệp HTML tại chỗ. Chúng tôi nhập biến thể hứa hẹn để phù hợp với các thực tiễn tốt nhất của JavaScript hiện đại. Chúng tôi sử dụng lời hứa như là cú pháp ngắn hơn so với các cuộc gọi lại, mà chúng tôi sẽ phải sử dụng nếu chúng tôi chỉ định
const http = require("http");
8 cho chỉ
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
68. Để tìm hiểu thêm về các thực tiễn tốt nhất của lập trình không đồng bộ, bạn có thể đọc cách viết mã không đồng bộ của chúng tôi trong hướng dẫn Node.js.

Chúng tôi muốn tệp HTML của chúng tôi được đọc khi người dùng yêu cầu hệ thống của chúng tôi. Hãy bắt đầu bằng cách sửa đổi

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 để đọc tệp:

first-servers/htmlFile.js

  1. touch hello.js
1

Chúng tôi sử dụng phương thức

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
70 để tải tệp. Lập luận của nó có
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
71. Biến đặc biệt
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
72 có đường dẫn tuyệt đối của nơi mã Node.js đang được chạy. Sau đó, chúng tôi nối thêm
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
73 để chúng tôi có thể tải tệp HTML mà chúng tôi đã tạo trước đó.

Bây giờ, hãy để trả về trang HTML sau khi nó được tải:

first-servers/htmlFile.js

  1. touch hello.js
2

Nếu lời hứa

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
70 giải quyết thành công, nó sẽ trả về dữ liệu của nó. Chúng tôi sử dụng phương pháp
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
75 để xử lý trường hợp này. Tham số
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
76 chứa dữ liệu tệp HTML.

Trước tiên, chúng tôi đặt tiêu đề

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
09 thành
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
78 để nói với khách hàng rằng chúng tôi đang trả về dữ liệu HTML. Sau đó chúng tôi viết mã trạng thái để cho biết yêu cầu đã thành công. Cuối cùng chúng tôi gửi cho khách hàng trang HTML mà chúng tôi đã tải, với dữ liệu trong biến
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
76.

Đôi khi phương thức

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
70 có thể thất bại, vì vậy chúng ta nên xử lý trường hợp này khi chúng ta gặp lỗi. Thêm điều này vào chức năng
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6:

first-servers/htmlFile.js

  1. touch hello.js
3

Lưu tệp và thoát

...
const host = 'localhost';
const port = 8000;
0 với
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
2.

Khi một lời hứa gặp phải một lỗi, nó bị từ chối. Chúng tôi xử lý trường hợp đó bằng phương pháp

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
84. Nó chấp nhận lỗi mà
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
70 trả về, đặt mã trạng thái thành
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
86 biểu thị rằng lỗi nội bộ đã gặp phải và trả về lỗi cho người dùng.

Chạy máy chủ của chúng tôi bằng lệnh

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
29:

  1. touch hello.js
4

Trong trình duyệt web, truy cập

...
const host = 'localhost';
const port = 8000;
9. Bạn sẽ thấy trang này:

Hướng dẫn how connect nodejs with html? - cách kết nối nodejs với html?

Bây giờ bạn đã trả lại một trang HTML từ máy chủ cho người dùng. Bạn có thể thoát khỏi máy chủ đang chạy với

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
08. Bạn sẽ thấy lời nhắc đầu cuối trở lại khi bạn làm.

Khi viết mã như thế này trong sản xuất, bạn có thể không muốn tải một trang HTML mỗi khi bạn nhận được yêu cầu HTTP. Mặc dù trang HTML này có kích thước khoảng 800 byte, các trang web phức tạp hơn có thể có kích thước megabyte. Các tập tin lớn có thể mất một lúc để tải. Nếu trang web của bạn mong đợi rất nhiều lưu lượng truy cập, tốt nhất là tải các tệp HTML khi khởi động và lưu nội dung của chúng. Sau khi chúng được tải, bạn có thể thiết lập máy chủ và khiến nó lắng nghe các yêu cầu trên một địa chỉ.

Để chứng minh phương pháp này, hãy để xem cách chúng ta có thể làm lại máy chủ của mình để có hiệu quả và có thể mở rộng hơn.

Phục vụ HTML một cách hiệu quả

Thay vì tải HTML cho mọi yêu cầu, trong bước này, chúng tôi sẽ tải nó một lần khi bắt đầu. Yêu cầu sẽ trả về dữ liệu chúng tôi tải khi khởi động.

Trong thiết bị đầu cuối, mở lại tập lệnh Node.js với Trình chỉnh sửa văn bản:

  1. cd first-servers
9

Hãy bắt đầu bằng cách thêm một biến mới trước khi chúng tôi tạo hàm

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6:

first-servers/htmlFile.js

  1. touch hello.js
6

Khi chúng tôi chạy chương trình này, biến này sẽ giữ nội dung tệp HTML.

Bây giờ, hãy để điều chỉnh lại chức năng

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6. Thay vì tải tệp, giờ đây nó sẽ trả về nội dung của
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
92:

first-servers/htmlFile.js

  1. touch hello.js
7

Tiếp theo, chúng tôi chuyển logic đọc tệp từ hàm

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 sang khởi động máy chủ của chúng tôi. Thực hiện các thay đổi sau khi chúng tôi tạo máy chủ:

first-servers/htmlFile.js

  1. touch hello.js
8

Lưu tệp và thoát

...
const host = 'localhost';
const port = 8000;
0 với
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
2.

Mã đọc tệp tương tự như những gì chúng tôi đã viết trong lần thử đầu tiên của chúng tôi. Tuy nhiên, khi chúng tôi đọc thành công tệp, chúng tôi sẽ lưu các nội dung vào biến

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
92 toàn cầu của chúng tôi. Sau đó, chúng tôi khởi động máy chủ bằng phương thức
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
97. Điều quan trọng là tệp được tải trước khi máy chủ được chạy. Bằng cách này, hàm
...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 chắc chắn sẽ trả về một trang HTML, vì
var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
92 không còn là một biến trống.

Người xử lý lỗi của chúng tôi cũng đã thay đổi. Nếu tệp có thể được tải, chúng tôi bắt lỗi và in nó vào bảng điều khiển của chúng tôi. Sau đó, chúng tôi thoát khỏi chương trình Node.js với chức năng

  1. mkdir first-servers
00 mà không cần khởi động máy chủ. Bằng cách này, chúng ta có thể thấy lý do tại sao việc đọc tệp không thành công, giải quyết vấn đề và sau đó khởi động lại máy chủ.

Bây giờ chúng tôi đã tạo ra các máy chủ web khác nhau trả về các loại dữ liệu khác nhau cho người dùng. Cho đến nay, chúng tôi chưa sử dụng bất kỳ dữ liệu yêu cầu nào để xác định những gì nên được trả lại. Chúng tôi sẽ cần sử dụng dữ liệu yêu cầu khi thiết lập các tuyến hoặc đường dẫn khác nhau trong máy chủ Node.js, vì vậy tiếp theo, hãy để chúng xem cách chúng làm việc cùng nhau.

Bước 4 - Quản lý các tuyến đường bằng đối tượng yêu cầu HTTP

Hầu hết các trang web chúng tôi truy cập hoặc API mà chúng tôi sử dụng thường có nhiều hơn một điểm cuối để chúng tôi có thể truy cập các tài nguyên khác nhau. Một ví dụ điển hình sẽ là một hệ thống quản lý sách, một hệ thống có thể được sử dụng trong thư viện. Nó không chỉ cần quản lý dữ liệu sách mà còn quản lý dữ liệu tác giả để lập danh mục và tìm kiếm sự tiện lợi.

Mặc dù dữ liệu cho sách và tác giả có liên quan, chúng là hai đối tượng khác nhau. Trong những trường hợp này, các nhà phát triển phần mềm thường mã hóa từng đối tượng trên các điểm cuối khác nhau như một cách để chỉ cho người dùng API loại dữ liệu mà họ đang tương tác.

Hãy để tạo một máy chủ mới cho một thư viện nhỏ, sẽ trả về hai loại dữ liệu khác nhau. Nếu người dùng truy cập địa chỉ máy chủ của chúng tôi tại

  1. mkdir first-servers
01, họ sẽ nhận được một danh sách các cuốn sách trong JSON. Nếu họ đến
  1. mkdir first-servers
02, họ sẽ nhận được một danh sách thông tin tác giả trong JSON.

Cho đến nay, chúng tôi đã trả lại phản hồi tương tự cho mọi yêu cầu chúng tôi nhận được. Hãy để minh họa điều này một cách nhanh chóng.

Nhập lại ví dụ phản hồi JSON của chúng tôi:

  1. mkdir first-servers
3

Trong một thiết bị đầu cuối khác, hãy để Lừa thực hiện một yêu cầu Curl như trước:

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
2

Bạn sẽ thấy:

  1. mkdir first-servers
5

Bây giờ, hãy để thử một lệnh Curl khác:

  1. nano hello.js
2

Sau khi nhấn

  1. mkdir first-servers
03, bạn sẽ thấy kết quả tương tự:

  1. mkdir first-servers
5

Chúng tôi chưa xây dựng bất kỳ logic đặc biệt nào trong hàm

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 của chúng tôi để xử lý một yêu cầu có URL chứa
  1. mkdir first-servers
05, do đó Node.js trả về cùng một thông báo JSON theo mặc định.

Vì chúng tôi muốn xây dựng một máy chủ quản lý thư viện thu nhỏ, giờ đây chúng tôi sẽ tách loại dữ liệu mà Lừa trả lại dựa trên điểm cuối mà người dùng truy cập.

Đầu tiên, thoát khỏi máy chủ đang chạy với

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
08.

Bây giờ mở

  1. mkdir first-servers
07 trong trình soạn thảo văn bản của bạn:

  1. nano hello.js
4

Hãy bắt đầu bằng cách lưu trữ dữ liệu JSON của chúng tôi theo các biến trước hàm

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6:

first-servers/routes.js

  1. nano hello.js
5

Biến

  1. mkdir first-servers
09 là một chuỗi chứa JSON cho một mảng các đối tượng sách. Mỗi cuốn sách có một tiêu đề hoặc tên, một tác giả và năm nó được xuất bản.

Biến

  1. mkdir first-servers
10 là một chuỗi chứa JSON cho một mảng các đối tượng tác giả. Mỗi tác giả có một cái tên, một đất nước sinh và năm sinh của họ.

Bây giờ chúng tôi có dữ liệu, các phản hồi của chúng tôi sẽ quay lại, hãy để bắt đầu sửa đổi chức năng

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 để đưa chúng trở lại các tuyến chính xác.

Đầu tiên, chúng tôi sẽ đảm bảo rằng mọi phản hồi từ máy chủ của chúng tôi đều có tiêu đề

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
09 chính xác:

Máy chủ đầu tiên/ROUTES.js

  1. nano hello.js
6

Bây giờ, chúng tôi muốn trả về đúng JSON tùy thuộc vào đường dẫn URL mà người dùng truy cập. Hãy cùng tạo ra một câu lệnh

  1. mkdir first-servers
13 trên URL yêu cầu:

first-servers/routes.js

  1. nano hello.js
7

Để có được đường dẫn URL từ một đối tượng yêu cầu, chúng ta cần truy cập thuộc tính

  1. mkdir first-servers
14 của nó. Bây giờ chúng ta có thể thêm các trường hợp vào câu lệnh
  1. mkdir first-servers
13 để trả về JSON thích hợp.

Câu lệnh JavaScript từ

  1. mkdir first-servers
13 cung cấp một cách để kiểm soát mã nào được chạy tùy thuộc vào giá trị của một biểu thức đối tượng hoặc JavaScript (ví dụ: kết quả của các hoạt động toán học). Nếu bạn cần một bài học hoặc nhắc nhở về cách sử dụng chúng, hãy xem hướng dẫn của chúng tôi về cách sử dụng câu lệnh Switch trong JavaScript.

Hãy để tiếp tục bằng cách thêm

  1. mkdir first-servers
17 khi người dùng muốn lấy danh sách sách của chúng tôi:

first-servers/routes.js

  1. nano hello.js
8

Chúng tôi đặt mã trạng thái của chúng tôi thành

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
8 để cho biết yêu cầu là tốt và trả về JSON chứa danh sách các cuốn sách của chúng tôi. Bây giờ, hãy để thêm một
  1. mkdir first-servers
17 cho các tác giả của chúng tôi:

first-servers/routes.js

  1. nano hello.js
9

Giống như trước đây, mã trạng thái sẽ là

...

const requestListener = function (req, res) {
    res.writeHead(200);
    res.end("My first server!");
};
8 vì yêu cầu vẫn ổn. Lần này chúng tôi trả lại JSON chứa danh sách các tác giả của chúng tôi.

Chúng tôi muốn trả về một lỗi nếu người dùng cố gắng đi đến bất kỳ đường dẫn nào khác. Hãy để thêm trường hợp mặc định để làm điều này:

routes.js

const http = require("http");
0

Chúng tôi sử dụng từ khóa

  1. mkdir first-servers
21 trong câu lệnh
  1. mkdir first-servers
13 để nắm bắt tất cả các kịch bản khác không được ghi lại bởi các trường hợp trước đây của chúng tôi. Chúng tôi đặt mã trạng thái thành
  1. mkdir first-servers
23 để chỉ ra rằng URL họ đang tìm kiếm không được tìm thấy. Sau đó, chúng tôi đặt một đối tượng JSON chứa thông báo lỗi.

Hãy để thử nghiệm máy chủ của chúng tôi để xem nó có hoạt động như chúng tôi mong đợi không. Trong một thiết bị đầu cuối khác, trước tiên, hãy để chạy một lệnh để xem liệu chúng ta có lấy lại danh sách sách của mình không:

const http = require("http");
1

Nhấn

  1. mkdir first-servers
03 để xem đầu ra sau:

const http = require("http");
2

Càng xa càng tốt. Hãy để thử giống nhau cho

  1. mkdir first-servers
02. Nhập lệnh sau vào thiết bị đầu cuối:

const http = require("http");
3

Bạn sẽ thấy đầu ra sau khi lệnh hoàn tất:

const http = require("http");
4

Cuối cùng, hãy để thử một URL sai để đảm bảo rằng

...

const server = http.createServer(requestListener);
server.listen(port, host, () => {
    console.log(`Server is running on http://${host}:${port}`);
});
6 trả về phản hồi lỗi:

const http = require("http");
5

Nhập lệnh đó sẽ hiển thị thông báo này:

const http = require("http");
6

Bạn có thể thoát khỏi máy chủ đang chạy với

var request = require("request");

var options = { method: 'POST',
  url: 'http://blah:8000/blah/blah/blah/blah/[latitude_origin]/[longitude_origin]/',
  headers:
   { 'postman-token': 'blah',
     'cache-control': 'no-cache' },
  body: '{"query1":[latitude_dest,longitude_dest]}' };

request(options, function (error, response, body) {
  if (error) throw new Error(error);

  console.log(body);
});
08.

Bây giờ chúng tôi đã tạo ra các con đường khác nhau cho người dùng để có được dữ liệu khác nhau. Chúng tôi cũng đã thêm một phản hồi mặc định trả về lỗi HTTP nếu người dùng nhập URL mà chúng tôi không hỗ trợ.

Sự kết luận

Trong hướng dẫn này, bạn đã thực hiện một loạt các máy chủ HTTP của Node.js. Đầu tiên bạn trả lại một phản hồi văn bản cơ bản. Sau đó, bạn đã tiếp tục trả về nhiều loại dữ liệu khác nhau từ máy chủ của chúng tôi: JSON, CSV và HTML. Từ đó, bạn có thể kết hợp tải tệp với các phản hồi HTTP để trả về trang HTML từ máy chủ cho người dùng và để tạo API sử dụng thông tin về yêu cầu của người dùng để xác định dữ liệu nào sẽ được gửi trong phản hồi của nó.

Bây giờ bạn được trang bị để tạo các máy chủ web có thể xử lý nhiều yêu cầu và phản hồi khác nhau. Với kiến ​​thức này, bạn có thể tạo một máy chủ trả về nhiều trang HTML cho người dùng ở các điểm cuối khác nhau. Bạn cũng có thể tạo API của riêng bạn.

Để tìm hiểu về nhiều máy chủ Web HTTP hơn trong Node.js, bạn có thể đọc tài liệu Node.js trên mô -đun

const http = require("http");
7. Nếu bạn muốn tiếp tục học Node.js, bạn có thể quay lại trang Code to Code in Node.js Series.

Tôi có thể sử dụng nodejs với html không?

Chạy Nodemon để khởi động máy chủ. Bất cứ khi nào máy chủ đang chạy và truy cập tuyến http: // localhost: 3000/, nó sẽ xuất ra văn bản đơn giản Hello World! . Chúng ta có thể sử dụng cùng một máy chủ để hiển thị các phần tử HTML làm phản hồi của máy chủ thay vì gửi văn bản thuần túy. Dưới đây là danh sách một số yếu tố HTML.We can use the same server to render HTML elements as the server response instead of sending plain text. Here is a list of some HTML elements.

Làm thế nào gửi dữ liệu từ nút JS đến HTML?

JS đến tệp HTML của tôi.ứng dụng.get ('/main', function (req, res) {var name = 'hello'; res. Render (__ dirname + "/xem/bố cục/main ...
NPM Cài đặt - -Save Pug -Để thêm nó vào dự án và gói.Tệp JSON ..
ứng dụng.....
Tạo thư mục ./views và thêm đơn giản ..

Node JS có sử dụng HTML và CSS không?

Nút là JavaScript, nhưng không có tất cả các trình duyệt có, mỗi ngôn ngữ này đều có sự trừu tượng và supersets (như HAML cho HTML, SASS cho CSS, và TypeScript cho JavaScript, làm ví dụ), cũng như trình biên dịch và trình chuyển đổi và tất cả các loạiChuyển đổi chúng thành hình dạng này hoặc điều đó.Yes, each of these languages has abstractions and supersets (like HAML for HTML, Sass for CSS, and TypeScript for JavaScript, as examples), as well as compilers and transpilers and all kinds of things that transform them into this shape or that.

Bạn có thể chạy Node JS trên một trang web không?

Nó sẽ yêu cầu một máy ảo, máy chủ web, máy chủ ứng dụng, ứng dụng Node.js và trình quản lý quy trình.Điều này sẽ đảm bảo rằng ứng dụng có sẵn từ xa, có thể truy cập bởi nhiều người dùng cùng một lúc và luôn chạy trong nền. js application, and a process manager. This will ensure that the application is available remotely, accessible by many users at once, and always running in the background.