Looking for samples executing async web calls in Elmish

General
#1

Hi All,

Does anyone know of any samples that show how to make HTTP requests and handle responses in Elmish applications?

I’m currently porting an application I’ve made in elm to elmish and this is hopefully the last piece of the puzzle to get it working.

If possible I’m looking for anything that minics Elm’s way of handling async i.e. requests are made as a commands and the responses are handled as message in the application but I’m willing to accept anything at this point.

Thanks, Rix

#2

I use http://fable.io/fable-powerpack/fetch.html.

A helper function:

open Fable.Core
open Fable.Core.JsInterop
open Fable.Import
open Fable.PowerPack
open Fable.PowerPack.Fetch

[<PassGenerics>]
let httpGet<'a> (url: string) : JS.Promise<'a> =
    promise {
        let! resp =
            fetch
                url
                [ RequestProperties.Method HttpMethod.GET
                  requestHeaders [ContentType "application/json"]
                  RequestProperties.Credentials RequestCredentials.Sameorigin
                ]
        let! text = resp.text()
        return ofJson<'a> text
    }

and use it like this:

let update (msg: Msg) (model: Model) : Model * Cmd<Msg> =
    match msg with
    | Msg.GetAudit ->
        model,
        Cmd.ofPromise
            (fun () -> httpGet<Shared.AuditResponse> (sprintf "/api/audit/%d/%d" (model.CurrentPage * model.PageSize) model.PageSize))
            ()
            (fun audit -> Msg.GotAudit (Ok audit))
            (fun e -> Msg.GotAudit (Error e.Message))

    | Msg.GotAudit response ->
        { model with Response = response },
        []
    
...
1 Like
#3

Hi Vaskir,

That’s perfect, I really appreciate it : )

Thanks, Richard