和server 說說話

我們直接使用官方的 example
來說明好了。這是一個很簡單的app, 你按一個鈕後，會隨機產生一個random的貓咪圖。

array vs list

在開始之前呢？我先回答我自己先前的問題，Elm裡面有沒有 array 答案是 有的
。 你可以用
Array.fromList 。把list 變成array就可以做一些list做不到的事情，譬如：

> import Array exposing (..)

> get 0 (fromList [1,2,3])
Just 1 : Maybe.Maybe number

> set 1 "hello" (fromList ["world", "wide", "web"])
Array.fromList ["world","hello","web"] : Array.Array String

set 和 get 都不是原本可以list可以做的。

Http 套件

如果你自己有elm-repl的話，可以先在命令列下： elm-package install elm-lang/http
就會在global裡安裝 http 的套件。

> import Http

> Http.getString "http://google.com"
Request { method = "GET", headers = [], url = "http://google.com", body = EmptyBody, expect = { responseType = "text", responseToResult = <function> }, timeout = Nothing, withCredentials = False }
    : Http.Request String

如果你仔細看http 套件的doc:

type alias Request a = 
    Request a

getString : String -> Request String

getString 會回傳一個 Request String 的 type。我們這裡的 String 就是 {method = "GET"...} 這一串。

還有一個get

getString : String -> Request String
Http.getString url

get : String -> Decoder a -> Request a
Http.get url someDecoder 

看得出來哪裡不一樣嗎？ get 通常是用來get json，之後，再用一個decoder把json變成你要的； getSting
單純就得到你要的string而已。

再回到這個貓咪的例子：

完整版的code請看官方的http 的例子

type Msg
  = MorePlease
  | NewGif (Result Http.Error String)

update : Msg -> Model -> (Model, Cmd Msg)
update msg model =
  case msg of
    MorePlease ->
      (model, getRandomGif model.topic)

    NewGif (Ok newUrl) ->
      (Model model.topic newUrl, Cmd.none)

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

-- other code here

getRandomGif : String -> Cmd Msg
getRandomGif topic =
  let
    url =
      "https://api.giphy.com/v1/gifs/random?api_key=dc6zaTOxFJmzC&tag=" ++ topic
  in
    Http.send NewGif (Http.get url decodeGifUrl)


decodeGifUrl : Decode.Decoder String
decodeGifUrl =
  Decode.at ["data", "image_url"] Decode.string

現在來說明這個code，按了鈕之後，會產生 MSG ，這時候 Elm runtime 就會通知 update update 解析
這個 MorePlease 的message，裡有個 getRandomGif 我們之前說過 Http.get ,
它會用我們自己編的 decorder，如果成功就會是 (Ok, url) ，失敗就是 (Err, something) 。我們透過 Http.send , 把這個結果用 Cmd msg 傳給 Elm runtime 。
Result type :

type Result error value = Ok value | Err error

不論是Ok 或Err 都會帶有一個值，後面的就是我們要的。我們透過Elm 內建的 Http 就可以和server
溝通了。可以去官方看Http的doc，裡頭會把send 和get 的type說明，還有一個是
Request a 這個type。就可以讓人瞭解了。