หนังสือ
Elm
บทที่ 11. HTML และเว็บ
ส่งคำขอ HTTP

Elm:
ส่งคำขอ HTTP

วิธีการ:

โอเค, ถึงเวลาโค้ดแล้ว Elm ใช้โมดูล Http ในการส่งคำขอ HTTP นี่คือตัวอย่างเพื่อดึง JSON บางส่วน:

import Http
import Json.Decode as Decode

type alias User =
    { id : Int
    , username : String
    }

userDecoder : Decode.Decoder User
userDecoder =
    Decode.map2 User
        (Decode.field "id" Decode.int)
        (Decode.field "username" Decode.string)

fetchUser : Cmd Msg
fetchUser =
    Http.get
        { url = "https://api.example.com/user/1"
        , decoder = userDecoder
        }
        |> Http.send UserFetched

type Msg
    = UserFetched (Result Http.Error User)

update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
    case msg of
        UserFetched (Ok user) ->
            ({ model | user = Just user }, Cmd.none)

        UserFetched (Err _) ->
            (model, Cmd.none)

ตัวอย่างข้อมูลเมื่อ UserFetched เป็น Ok user:

{ id = 1, username = "ElmerFudd" }

ดำดิ่งลึก

การส่งคำขอ HTTP ไม่ใช่เรื่องใหม่; มันเป็นหลักสูตรหลังการสื่อสารเว็บตั้งแต่ยุค 90’s Elm ห่อความซับซ้อนนี้ไว้ในโมดูล Http ที่ใช้งานง่าย, โฟกัสที่ความปลอดภัยและความง่ายดาย ไม่เหมือนกับยุคแรกๆ, Elm แยกส่วนที่ยุ่งยากเช่น XMLHttprequest และการแปลง JSON Alternatives เช่นการใช้ Fetch API ของ JavaScript หรือ XMLHttpRequest โดยตรงเป็นไปได้ด้วย ports, แต่วิธีที่มีอยู่ใน Elm รักษาโค้ดของคุณให้ปลอดภัยและบริสุทธิ์ มันจัดการกับผลข้างเคียงผ่านสถาปัตยกรรมที่ทรงพลังโดยไม่ทำลายความน่าเชื่อถือของแอปพลิเคชันของคุณ

ดูเพิ่มเติม

สำหรับคำอธิบายและการแก้ไขปัญหาที่ละเอียดยิ่งขึ้น ดูที่ทรัพยากรเหล่านี้:

การวิเคราะห์ HTMLการส่งคำขอ HTTP ด้วยการตรวจสอบสิทธิ์พื้นฐาน