• หน้าแรก
  • หลักสูตร
  • บทความ
  • ร้านค้า
  • ติดต่อเรา
    มีคำถามเกี่ยวกับ odoo ?
    (02) 4302475
    info@odoothaidev.com
    Login
    Odoothaidev - We are Odoo professional in Thailand
    • หน้าแรก
    • หลักสูตร
    • บทความ
    • ร้านค้า
    • ติดต่อเรา

      Express

      • บ้าน
      • บล็อก
      • Express
      • สร้าง API ง่ายๆ ด้วย Node.js และ Express

      สร้าง API ง่ายๆ ด้วย Node.js และ Express

      • โพสโดย admin
      • หมวดหมู่ Express, NodeJS
      • วันที่ กรกฎาคม 26, 2019
      • ความคิดเห็น 0 ความคิดเห็น
      • แท็ก

      บทความนี้เราจะมาพูดถึงการทำ RESTFul API ด้วย Node.js และ Express กันนะครับ โดยผมจะขอไม่พูดถึงรายละเอียดเชิงลึกหรือทฤษฎีอะไรมากมาย แต่จะขอเน้นไปที่การนำเสนอตัวอย่างและวิธีการทำจากประสบการณ์ที่ผมได้ทำมาเท่านั้น ซึ่งผมเองก็ยังเพิ่มเริ่มศึกษาอยู่ หากมีส่วนไหนผิดพลาด ก็ต้องขออภัยด้วยนะครับ

      Step 1 : ติดตั้ง Node.js

      อย่างแรกเลยให้เราติดตั้ง Node.js ก่อนครับ สำหรับวิธีการติดตั้ง Node.js และรายละเอียดอื่นๆ สามารถอ่านได้ตามด้านล่างนี้เลยนะครับ

      • สอนวิธีใช้ Node.js เบื้องต้น

      Step 2 : ติดตั้ง Express

      ก่อนอื่นให้เราสร้างไฟล์ package.json ขึ้นมาโดยใช้คำสั่ง npm init ให้เรากรอกรายละเอียดให้เรียบร้อย เราก็จะได้ไฟล์ package.json หน้าตาประมาณนี้

      1
      2
      3
      4
      5
      6
      {
          “name”: “devahoy-nodejs”,
          “version”: “0.0.1”,
          “description”: “Devahoy Node.js with Express 4 Tutorial”,
          “main”: “index.js”
      }

      package.json เป็นเสมือนบัตรประจำตัวของโปรเจ็คนั้นๆ ที่จะระบุว่า โปรเจ็คนั้นชื่อว่าอะไร มีเวอร์ชันที่เท่าไหร่  ต้องใช้ Dependencies อะไรบ้าง รวมไปถึงรายละเอียดปลีกย่อยอื่นๆ

      ต่อมาให้เราติดตั้ง Express ซึ่งเป็น framework สำหรับเขียน Node.js ด้วยคำสั่งด้านล่างนี้ครับ (หากติด permission ให้เติม sudo เข้าไปข้างหน้า)

      1
      npm install express —save

      --save คือการบอกว่านอกจากจะให้ติดตั้ง package นั้นแล้ว ก็ให้เซฟชื่อ package นั้นเอาไว้ใน package.json ด้วย เวลาที่เราย้ายโฟลเดอร์ เราก็จะสามารถติดตั้ง dependencies ทั้งหมดได้ง่ายๆ ด้วยคำสั่ง npm install จะได้ไม่ต้องมา npm install xxxx ไล่ไปทีละ package ให้ยุ่งยากและเสียเวลา

      Step 3 : สร้างไฟล์ index.js

      เมื่อติดตั้ง Express เสร็จเรียบร้อย ก็ให้เราสร้างไฟล์ index.js ขึ้นมา เพื่อใช้เป็นไฟล์หลักที่ใช้เขียนโค้ด โครงสร้างของโปรเจ็คก็จะหน้าตาประมาณนี้ครับ

      1
      2
      3
      4
      ├── index.js
      ├── node_modules
      │ └── express
      └── package.json

      ที่ไฟล์ index.js ให้เราลองเพิ่มโค้ดด้านล่างนี้ลงไปครับ

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      /* โหลด Express มาใช้งาน */
      var app = require(‘express’)();
      /* ใช้ port 7777 หรือจะส่งเข้ามาตอนรัน app ก็ได้ */
      var port = process.env.PORT || 7777;
      /* Routing */
      app.get(‘/’, function (req, res) {
          res.send(‘<h1>Hello Node.js</h1>’);
      });
      app.get(‘/index’, function (req, res) {
          res.send(‘<h1>This is index page</h1>’);
      });
      /* สั่งให้ server ทำการรัน Web Server ด้วย port ที่เรากำหนด */
      app.listen(port, function() {
          console.log(‘Starting node.js on port ‘ + port);
      });

      เสร็จแล้วให้เราลองสั่งให้ Node.js รันโค้ดนี้ ด้วยคำสั่ง node ชื่อไฟล์ แบบนี้

      1
      node index.js

      หากเรามีการแก้โค้ดใดๆ เราจะต้องรัน app ใหม่เสมอ ถึงจะเห็นการเปลี่ยนแปลง

      ทีนี้ให้เราเปิด web browser ขึ้นมาสักอัน แล้วลองเข้า http://localhost:7777 และ http://localhost:7777/index ลองดูผลลัพธ์เทียบกันดูครับ

      Step 4 : ลองทำ RESTFul API แบบง่ายๆ

      จากตัวอย่างก่อนหน้านี้ เราสามารถเขียนโค้ดดัก url แล้วส่งผลลัพธ์กลับไปด้วยข้อความที่แตกต่างกันได้แล้ว ทีนี้เราจะลองมาทำ api ง่ายๆ กันดูบ้าง โดยความต้องการของ api มีดังนี้

      • GET localhost:7777/ให้แสดงข้อความต้อนรับ
      • GET localhost:7777/userให้แสดงรายชื่อ user ทั้งหมดในระบบ
      • GET localhost:7777/user/:idให้แสดงข้อมูลของ user ที่ระบุ โดย :id คือ id ของ user ที่ต้องการจะดูข้อมูล
      • POST localhost:7777/newuserให้เพิ่มข้อมูล user ตามข้อมูลที่ส่งไป

      เริ่มแรกให้เราสร้างไฟล์ users.js ขึ้นมาก่อน โดยไฟล์นี้ผมจะเอาไว้สำหรับเป็นข้อมูลของ user (ในส่วนนี้ผมขอกำหนดขึ้นมาเองแบบมั่วๆ ซึ่งจริงๆ แล้วเราจะต้องดึงข้อมูลมาจากฐานข้อมูล)

      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
      44
      45
      /* ลองใส่ข้อมูลเล่นๆ เพื่อเอาไว้เทส */
      var users = [
      {
          “id”: 1,
          “username”: “goldroger”,
          “name”: “Gol D. Roger”,
          “position”: “Pirate King”
      },
      {
          “id”: 2,
          “username”: “mrzero”,
          “name”: “Sir Crocodile”,
          “position”: “Former-Shichibukai”
      },
      {
          “id”: 3,
          “username”: “luffy”,
          “name”: “Monkey D. Luffy”,
          “position”: “Captain”
      },
      {
          “id”: 4,
          “username”: “kuzan”,
          “name”: “Aokiji”,
          “position”: “Former Marine Admiral”
      },
      {
          “id”: 5,
          “username”: “shanks”,
          “name”: “‘Red-Haired’ Shanks”,
          “position”: “The 4 Emperors”
      }
      ];
      /* ฟังก์ชันสำหรับหา user ทั้งหมดในระบบ ในส่วนนี้ผมจะให้ส่งค่า users ทั้งหมดกลับไปเลย */
      exports.findAll = function() {
          return users;
      };
      /* ฟังก์ชันสำหรับหา user จาก id ในส่วนนี้เราจะวน loop หา users ที่มี id ตามที่ระบุแล้วส่งกลับไป */
      exports.findById = function (id) {
          for (var i = 0; i < users.length; i++) {
              if (users[i].id == id) return users[i];
          }
      };

      จะเห็นว่าทั้ง 2 ฟังก์ชันนั้นต่างก็เป็น method ของ exports ซึ่งเป็นความสามารถของ Node.js ที่จะทำให้เราสามารถนำฟังก์ชันเหล่านั้นไปใช้กับไฟล์อื่นได้ครับ

      ต่อมาให้เราเปิดไฟล์ index.js ขึ้นมา แล้วเพิ่ม require('./users') เข้าไป เพื่อให้ index.js สามารถเรียกใช้ฟังก์ชันที่อยู่ใน users.js ได้ ให้เราใส่เอาไว้บนสุดของไฟล์เลย แบบนี้

      1
      var users = require(‘./users’);

      จะเห็นว่าเราไม่จำเป็นต้องใส่ นามสกุลของไฟล์ เช่น .js ลงไปด้วย เพียงแค่ระบุชื่อไฟล์และ path ให้ถูก Node.js มันฉลาดพอที่จะรู้ว่าเรา require ไฟล์ไหน

      ต่อมาให้เราลองเพิ่ม route แต่ละอันเข้าไป

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      13
      14
      15
      16
      17
      18
      19
      20
      21
      app.get(‘/’, function (req, res) {
          res.send(‘<h1>Hello Node.js</h1>’);
      });
      app.get(‘/user’, function (req, res) {
          res.json(users.findAll());
      });
      app.get(‘/user/:id’, function (req, res) {
          var id = req.params.id;
          res.json(users.findById(id));
      });
      app.post(‘/newuser’, function (req, res) {
          var json = req.body;
          res.send(‘Add new ‘ + json.name + ‘ Completed!’);
      });
      app.listen(port, function() {
          console.log(‘Starting node.js on port ‘ + port);
      });

      จาก route ด้านบน จะได้ว่า

      • /แสดงข้อความว่า “Hello Node.js”
      • /userเรียกใช้ฟังก์ชัน users.findAll() แล้วส่งผลลัพธ์กลับไปในรูปแบบของ JSON
      • /user/:idเรียกใช้ฟังก์ชัน users.findById(id) โดยค่าของ id นั้นจะดึงมาจาก url ผ่าน req.params.id เมื่อได้ผลลัพธ์แล้วก็ส่งกลับไปในรูปแบบของ JSON
      • /newuserรับ req.body ซึ่งเราจะ POST ค่าเป็น JSON ไป แล้วนำค่านั้นมาแสดงผล (โดยปกติแล้ว เราก็จะนำค่าที่ POST มา ไปเซฟลงในฐานข้อมูล แต่สำหรับบทความนี้ผมขอแค่เอาค่านั้นมาแสดงบนหน้าเว็บเท่านั้นครับ

      เราสามารถดึง :id ใน route ได้จาก req.params.id

      ทีนี้ให้เราลองทดสอบ GET ผ่านหน้าเว็บดูได้เลยครับ แต่ในส่วนของ POST เราจะต้องทดสอบผ่าน cURL หรือว่าจะใช้ Chrome Plugin ที่ชื่อว่า Postman ก็ได้ครับ

      Step 5 : ทดสอบ POST ด้วย Postman

      ให้เราติดตั้ง Postman จากลิงค์นี้เลย Postman – REST Client

      postman

      จากนั้นให้เราเปิด Postman แล้วลองทดสอบการ POST โดยการเลือก method ให้เป็น POSTจากนั้นก็เลือกข้อมูลเป็นแบบ raw แล้วลองใส่ค่าของ user ที่เราต้องการจะเพิ่มเข้าไปในรูปแบบของ JSON เช่น

      1
      2
      3
      4
      {
          “name”: “Roronoa Zoro”,
          “position”: “Swordman”
      }

      จากนั้นลองกด Send ดู

      RESTFul_without_body_parser

      เราจะพบว่ามันขึ้น Error แบบนี้ครับ

      1
      TypeError: Cannot read property ‘name’ of undefined

      ทั้งนี้เป็นเพราะว่ามันไม่สามารถอ่านค่าจาก body ได้ วิธีแก้คือให้เราติดตั้ง body-parser เข้ามาอีกตัว

      1
      npm install body–parser —save

      จากนั้นให้เราตั้งค่า Body Parser ในไฟล์ index.js แบบนี้ เราก็จะสามารถอ่านค่า JSON ได้แล้ว

      1
      2
      3
      4
      5
      6
      7
      8
      9
      10
      11
      12
      var users = require(‘./users’);
      var app = require(‘express’)();
      var bodyParser = require(‘body-parser’);
      var port = process.env.PORT || 7777;
      // parse application/json
      app.use(bodyParser.json());
      app.use(bodyParser.urlencoded({
          extended: true
      }));

      ให้เรารัน app ใหม่ แล้วลองทดสอบดูอีกครั้ง

      RESTFul_with_body_parser

      เรียบร้อย! ได้ผลลัพธ์ตามที่ต้องการ จะเห็นว่าในบทความนี้ ผมจะเน้นเรื่องการใช้งาน Node.js และ Express เบื้องต้นซะมากกว่าครับ ให้รู้ว่ามันใช้งาน Route ยังไง มี GET, POST รับส่ง request, response แบบฉบับย่อๆ ไม่ได้ลงรายละเอียดมากนัก รวมถึงยังไม่ได้พูดถึงการเชื่อมต่อกับฐานข้อมูลเลย แต่ใช้การจำลองข้อมูลแบบเกรียนๆ นี้แหละ สุดท้ายนี้ก็หวังว่าบทความนี้จะมีประโยชน์กับเพื่อนๆ ไม่มากก็น้อยนะครับ

      Source Code : RESTFul API with Node.js and Express

      http://www.siamhtml.com/restful-api-with-node-js-and-express/

      • Share:
      อวตารของผู้เขียน
      admin

      โพสต์ก่อนหน้า

      Node.js คืออะไร ? + สอนวิธีใช้
      กรกฎาคม 26, 2019

      โพสต์ถัดไป

      สร้างแอพ Chat ด้วย Node.js และ Socket.IO
      กรกฎาคม 26, 2019

      คุณอาจชอบ

      อัพเดท NodeJS ง่ายเกินไป…บน Ubuntu
      8 ตุลาคม, 2022

      พอดีว่าจะอัพเดท Ghost blog แล้วมันให้เรา …

      เข้าใจ NodeJS ง่ายๆ สำหรับคนทำเว็บ
      26 กรกฎาคม, 2019

      และ JavaScript ไม่ได้อยู่บนหน้าเว็บอีกต่ …

      [Beginner] Node.js คืออะไร
      26 กรกฎาคม, 2019

      สวัสดีครับ วันนี้ก็ถึงเวลาที่มีโอกาสได้เ …

      ทิ้งคำตอบไว้

      อีเมลของคุณจะไม่แสดงให้คนอื่นเห็น ช่องข้อมูลจำเป็นถูกทำเครื่องหมาย *

      ค้นหาบทความ

      หมวดหมู่

      หมวดหมู่

      • Accounting
      • Adobe XD
      • API
      • Blog
      • Business
      • Buttons
      • CRM
      • Custom Fields
      • Design / Branding
      • Django
      • Ecommerce
      • ERP
      • ERP Flow
      • Express
      • Flectra
      • Form View
      • Frontend
      • Github
      • Github
      • Grant Chart
      • Header
      • iReport
      • Jasper Server & Server
      • Jaspersoft Studio
      • Java
      • JSON-RPC
      • Lazada
      • Linux
      • MLM
      • MRP
      • Nignx Proxy
      • NodeJS
      • Odoo 10
      • Odoo 12 Module
      • Odoo 13
      • Odoo 14 Development
      • Odoo 16
      • Odoo 8
      • Odoo 9
      • Odoo API
      • Odoo Certification
      • Odoo Developer
      • Odoo Ebook
      • Odoo Enterprise
      • Odoo ERP
      • Odoo Event
      • Odoo Implement
      • Odoo Inventory
      • Odoo Report
      • Odoo V15
      • Open Source
      • Open-office
      • OpenERP 7.0
      • PhantomJS
      • Postgres SQL
      • Programming Language
      • Project Management
      • Python
      • Python3
      • Qweb
      • Reporting ระบบรายงาน
      • RML Report
      • Search View and Filters
      • Social Network
      • Statusbar
      • Ubuntu
      • Uncategorized
      • Voip & Call Center
      • Warehouse Management
      • WMS
      • Woocommerce
      • Workflow
      • XML-RPC
      • การ Implement
      • การเก็บข้อมูล Pre-Requirement
      • การเตรียมตัวเพื่อใช้งาน erp
      • ความรู้ด้านการตลาด CRM
      • ธีมเว็บไซต์ Odoo
      • ธุรกิจบริการ
      • ธุรกิจประเภทจัดอบรมสัมมนา
      • ธุรกิจสิ่งพิมพ์
      • นักพัฒนา
      • ประเภทธุรกิจที่เหมาะกับ Odoo
      • ระบบบัญชี
      • ระบบเคลม
      • ลิขสิทธิ์ – License
      Introduction LearnPress – LMS plugin

      Introduction LearnPress – LMS plugin

      Free
      From Zero to Hero with Nodejs

      From Zero to Hero with Nodejs

      Free
      Learn Python – Interactive Python

      Learn Python – Interactive Python

      $69.00

      บทความล่าสุด

      V16 Planned Date of Tasks are invisible.
      12ก.พ.2023
      Odoo Implement Methodology
      29พ.ย.2022
      Odoo Enterprise Subscription Agreement
      29พ.ย.2022
      (02) 430-2475
      info@odoothaidev.com
      Facebook Twitter Google-plus Pinterest

      Odoothaidev by OdooTeaM.

      • Privacy
      • Terms
      • Sitemap
      • Purchase

      เข้าสู่ระบบด้วยบัญชีเว็บไซต์ของคุณ

      ลืมรหัสผ่าน?

      Click to Copy