Skip to content

Latest commit

 

History

History
270 lines (210 loc) · 17.7 KB

call-your-api.md

File metadata and controls

270 lines (210 loc) · 17.7 KB
Raw
description
😑 สร้าง AI ของแท้เป็น Web Service ละ แต่มันเรียกใช้ยังไงหว่า

ลองเรียกใช้ AI ของเรากัน

หลังจากที่เราได้เห็นตัวอย่างการสร้าง AI ตั้งแต่ขั้นเริ่มต้น จนกระทั่งเราสามารถ train model ที่มีความแม่นยำในระดับที่เราพอใจออกมาแล้ว ... ดังนั้นในรอบนี้เราจะมาลองเรียกใช้ตัว AI ที่เราสร้างกันดูบ้าง

{% hint style="success" %} แนะนำให้อ่าน
บทความนี้เป็นหนึ่งในซีรี่ Machine Learning ดังนั้นถ้าเพื่อนสนใจของสนุกๆ เช่นการสร้าง AI เพื่อ ทำนายราคารถยนต์ วิเคราะห์ว่าควรอนุมัติบัตรเครดิตหรือเปล่า ทำนายว่าฝนจะตกหรือไม่ และอื่นๆ สามารถดูเนื้อหาทั้งหมดได้จาก Side menu ในหมวดของ Machine Learning Studio ครับ ซึ่งถ้ามีบทความเกี่ยวกับ machine learning ก็จะมาลงในหมวดนี้เรื่อยๆ แต่ถ้าอยากรู้ว่า AI สำเร็จรูปของ Microsoft Azure มีอะไรน่าเล่นบ้าง ไปอ่านกันได้จากลิงค์นี้เลยครัช 👶 Azure Cognitive Services เชื่อผมเต๊อะ AI ไม่ได้ยากแบบที่คิด {% endhint %}

ในการที่เราจะไปเรียกใช้ AI ที่เราทำไว้เป็น Web API เรียบร้อยแล้วนั้น โดยปรกติเราก็จะเขียนโปรแกรมไปทำงานกับ REST API นั่นเอง แต่ในรอบนี้ผมจะพาเพื่อนๆลองทำผ่าน Visual Studio Code ธรรมดากันดูบ้าง เพื่อให้เพื่อนๆที่ไม่ได้ถนัดในการเขียนโปรแกรมได้เข้าใจและทำตามได้นั่นเองครับ

🔥 Visual Studio Code

ให้ทำการเปิดโปรแกรม Visual Studio Code ขึ้นมา แล้วที่ด้านซ้ายให้เลือกเมนู Extension ครับ ตามรูปด้านล่างเลย

{% hint style="info" %} Visual Studio Code
สำหรับใครที่ยังไม่ได้ลง Visual Studio Code ก็สามารถไปดาวโหลดมาติดตั้งได้จากลิงค์ด้านล่างนี้ครับ

🔥 Rest Client

หลังจากนั้นในช่องค้นหาให้พิมพ์ลงไปว่า Rest Client แล้วทำการกดที่ปุ่ม Install เพื่อทำการติดตั้ง extension ตัวนี้ได้เลย

{% hint style="info" %} Rest Client
เป็นตัวช่วยให้เราสามารถทำงานกับ Rest API ได้แบบง่ายๆ ซึ่งมันก็จะคล้ายๆกับพวก Postman, Fiddler ที่ความสามารถน้อยกว่าประมาณนั้น {% endhint %}

หลังจากที่ติดตั้งเรียบร้อยแล้ว ให้เราทำการสร้างไฟล์ใหม่ขึ้นมา โดยการกดที่เมนูด้านบน File > New File ตามรูปเลย

หลังจากนั้นให้ทำการบันทึกไฟล์นี้ทันที ซึ่งจะตั้งชื่อหรือเอาไว้ที่ไหนก็ได้ แต่จะต้องใส่นามสกุลของมันเป็น .http ด้วยนะ

🔥 เรียกใช้ AI

ถัดมาเราก็จะเริ่มมาเรียกใช้ AI ของเรากัน ซึ่งจากตัวอย่างที่ผ่านมา (ถ้ายังไม่ได้อ่านกดตรงนี้เพื่อกลับไปลองทำตามดูนะ - มาสร้าง AI ของแท้ตัวแรกของเรากัน) ในขั้นตอนสุดท้ายเราจะทำสิ่งที่เรียกว่า SET UP WEB SERVICE เพื่อให้ได้ไฟล์ Excel มานั่นเอง ซึ่งเจ้าไฟล์ที่เราได้มันจะมีหน้าตาประมาณนี้

ซึ่งไฟล์ตัวนี้มีส่วนสำคัญ 3 อย่างคือ

  1. Web Service URL - คือ URL ที่มีไว้ให้เราเรียกใช้งานตัว AI ที่เราเขียนไว้ใน Azure Machine Learning Studio นั่นเอง
  2. Access Key - คือรหัสลับในการเรียกใช้งานตัว AI ของเรา ซึ่งปรกติเราจะไม่แจกตัวนี้ให้ใครมั่วซั่ว เพราะไม่อย่างนั้นคนที่รู้รหัสลับนี้ก็อาจจะมาใช้งานตัว AI ของเราเล่น และสุดท้ายตอนสิ้นเดือนเราก็อาจจะโดนเรียกเก็บเงินในส่วนที่เราไม่ได้เป็นคนใช้นั่นเอง
  3. Schema - คือรูปแบบของข้อมูลที่เราจะส่งให้ AI ไปทำการวิเคราะห์

คราวนี้เราจะเริ่มมาทำความเข้าใจมันทีละตัวกันละ

Web Service URL

อย่างที่บอกไว้ว่ามันคือช่องทางให้เราเรียกใช้ AI ของเราผ่านสิ่งที่เรียกว่า Rest API ได้นั่นเอง ซึ่งเราสามารถเข้าไปดูตัวที่เราเตรียมไว้ได้จากลิงค์นี้

พอเราเปิดเข้าไปปุ๊ปเราก็จะเจอรายละเอียดในการใช้งานตัว Rest API นั่นเอง ซึ่งในส่วนแรกให้เรา Copy ในโซนแดงๆของรูปด้านล่างนี้เอาไปใส่ใน Visual Studio Code ที่เปิดค้างไว้ได้เลย

เจ้าสีแดงที่ Copy มานี่แหละคือ Web Service URL ที่เราจะทำการเรียกไปหาตัว AI ของเรา ซึ่งตัวที่ Copy มานี้จะมีรายละเอียดที่เยอะกว่าในไฟล์ Excel แล้วเมื่อเราเอามันมาวางไว้ใน Visual Studio Code เราจะได้ผลลัพท์แบบรูปด้านล่างนี้

จากรูปด้านบนเราจะเห็นปุ่ม Send Request ให้เราลองกดปุ่มนั้นได้เลย มันจะทำการเรียก Rest API ไปหาตัว AI ของเรานั่นเอง ซึ่งเมื่อกดแล้วเราน่าจะได้ผลลัพท์ประมาณนี้

จากรูปด้านบนเขาจะบอกว่าเราไม่มีสิทธิ์ในการเข้าใช้งานนั่นเอง Unauthorized เพราะอย่างที่บอกว่า ใครก็แล้วแต่จะเรียกใช้งาน AI ของเราเขาจะต้องส่งของ 2 อย่างเข้ามาด้วยนั่นคือ Access Key และ Data ที่จะให้ตัว AI ทำการประมวลผลนั่นเอง

Request Header

จากตรงนี้เราก็จะกลับไปที่เว็บที่เราเปิดค้างไว้ แล้วลองเลื่อนลงมาด้านล่างเราจะพบว่า ถ้าใครก็ตามที่ต้องการเรียกใช้งาน API ตัวนี้ จะต้องส่งข้อมูลไปให้เขาอย่างน้อย 3 อย่างคือ Authorization, Content-Length, Content-Type ตามรูปด้านล่างเลย

ดังนั้นจากตรงนี้เราก็จะทำการแนบ Header ไปให้ตามที่เขาขอมา ซึ่งเพื่อนๆสามารถ Copy โค้ดด้านล่างนี้ไปใส่ใน Visual Studio Code ต่อได้เลย

Authorization: Bearer YOUR_ACCESS_KEY
Content-Type: application/json

หมายเหตุ
จากโค้ดด้านบนให้เพื่อนๆเอา Access Key ที่อยู่ในไฟล์ Excel ของตัวเองไปทับ YOUR_ACCESS_KEY เอานะ ส่วน Content-Length ไม่ต้องใส่ก็ได้ เพราะว่าตัว Rest Client จะเป็นคนเติมให้เอานั่นเอง

ซึ่งหลังจากที่เอามาวางแล้วจะได้หน้าตาประมาณนี้

Request Body

คราวนี้ก็มาถึงส่วนสุดท้ายนั่นคือ Request Body หรือ Data ที่เราจะต้องส่งไปให้กับ AI เพื่อให้มันทำการเดาราคารถยนต์กลับมาให้เรานั่นเอง ซึ่งให้เรากลับไปดูที่เว็บตัวเดิมจะเห็นในโซนด้านล่างประมาณนี้

ขอตัดมาแค่นี้นะมันยาวม๊วกอยู่

ซึ่งเจ้าตัว Request Body นี้เราสามารถดูได้จากไฟล์ Excel ของเราก็ได้ ที่อยู่ใน Schema นั่นเอง (ลอง copy ไปวางใน web browser ก็ได้นะ) แต่ในไฟล์ Excel ของเรามันจะแสดงเป็นคนละ format กันเฉยๆ แต่ถ้าดูดีๆก็จะพบว่าจริงๆมันก็คล้ายๆกันนั่นแหละ

ซึ่งจากตรงนี้เพื่อนๆสามารถ Copy โค้ดด้านล่างไปวางใน Visual Studio Code ได้เช่นเคย

{
  "Inputs": {
    "input1": {
      "ColumnNames": [
        "symboling",
        "normalized-losses",
        "make",
        "fuel-type",
        "aspiration",
        "num-of-doors",
        "body-style",
        "drive-wheels",
        "engine-location",
        "wheel-base",
        "length",
        "width",
        "height",
        "curb-weight",
        "engine-type",
        "num-of-cylinders",
        "engine-size",
        "fuel-system",
        "bore",
        "stroke",
        "compression-ratio",
        "horsepower",
        "peak-rpm",
        "city-mpg",
        "highway-mpg",
        "price"
      ],
      "Values": [
        [
        3,
        1,
        "alfa-romero",
        "gas",
        "std",
        "two",
        "convertible",
        "rwd",
        "front",
        88.6,
        168.8,
        64.1,
        48.8,
        2548,
        "dohc",
        "four",
        130,
        "mpfi",
        3.47,
        2.68,
        9,
        111,
        5000,
        21,
        27,
        13495
        ]
      ]
    }
  }
}

ซึ่งเจ้าโค้ดยาวๆด้านบนคือ ข้อมูลรถยนต์ 1 คัน ที่ประกอบไปด้วย จำนวนล้อในการขับเคลื่อน ปีที่ผลิต สีรถ แรงม้า บลาๆ ซึ่งเป็นสิ่งที่จำเป็นในการนำไปทำนายราคารถยนต์นั่นเอง

ซึ่งจากตรงนี้เราก็ลองกด Send Request ได้เลย

ซึ่งผลลัพท์ที่เราได้รับกลับมาก็จะออกมาราวๆนี้

HTTP/1.1 200 OK
Content-Length: 366
Content-Type: application/json; charset=utf-8
ETag: "d244b129899446c49c57a026dc985673"
Server: Microsoft-HTTPAPI/2.0
x-ms-request-duration: 00:00:00.0274519
x-ms-request-id: f3e6d29d-8b59-4fb1-a13f-32ca1cab3538
Date: Tue, 03 Dec 2019 10:35:51 GMT
Connection: close

{
  "Results": {
    "output1": {
      "type": "table",
      "value": {
        "ColumnNames": [
          "make",
          "body-style",
          "wheel-base",
          "engine-size",
          "horsepower",
          "peak-rpm",
          "highway-mpg",
          "price",
          "Scored Labels"
        ],
        "ColumnTypes": [
          "String",
          "String",
          "Double",
          "Int32",
          "Int32",
          "Int32",
          "Int32",
          "Int32",
          "Double"
        ],
        "Values": [
          [
            "alfa-romero",
            "convertible",
            "88.6",
            "130",
            "111",
            "5000",
            "27",
            "13495",
            "13498.1280337231"
          ]
        ]
      }
    }
  }
}

แม้ว่าจะยาวไปหน่อย แต่ใจความสำคัญของมันคือตรงนี้

"Values": 
[
    [
        "alfa-romero",
        "convertible",
        "88.6",
        "130",
        "111",
        "5000",
        "27",
        "13495",
        "13498.1280337231"
    ]
]

จะเห็นเลข 13495 กับ 13498.1280337231 ซึ่งเจ้าเลข 2 ตัวนี้คือ ราคารถจริงๆที่เรากำหนดไว้ และ ราคารถยนต์ที่ตัว AI มันทายให้เรานั่นเอง

🔥 เขียนโค้ดเรียก Rest API

สำหรับเพื่อนๆที่เป็นโปรแกรมเมอร์แล้วคันมือ อยากลองเขียนโค้ดไปเรียก REST API แล้วดูผลลัพท์ก็สามารถทำได้เลย โดยลองดูที่เว็บตัวเดิม แล้วเลื่อนลงไปด้านล่างสุด เราจะเห็นโค้ดตัวอย่างในการเรียกใช้งาน API ด้วยภาษาต่างๆอยู่ ซึ่งเพื่อนๆสามารถ Copy ภาษาที่ตัวเองถนัดแล้วลองเล่นดูได้เลยนะครับ (มันจะให้เราใส่ Access Key ไปลงในโค้ดด้วยนะลองหาดู)