Elm:
Odczytywanie pliku tekstowego

How to:

Elm aktualnie nie obsługuje bezpośredniego odczytu plików z dysku ze względów bezpieczeństwa i filozofii języka. Jednak możesz odczytać pliki tekstowe przesłane przez użytkownika przy użyciu File i FileReader API dostępnych w przeglądarce. Oto przykład:

module Main exposing (..)

import Browser
import Html exposing (..)
import Html.Events exposing (on, targetValue)
import Html.Attributes exposing (type')
import File exposing (File)
import File.Selector exposing (file)
import File.Reader exposing (readAsText)

type Msg
    = SelectFile (List File)
    | FileLoaded (Result FileReader.Error String)

main =
    Browser.sandbox { init = init, update = update, view = view }

init =
    { content = "" }

update msg model =
    case msg of
        SelectFile files ->
            case files of
                file :: _ ->
                    ( model, readAsText file FileLoaded )

                [] ->
                    ( model, Cmd.none )

        FileLoaded (Ok fileContent) ->
            { model | content = fileContent }

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

view model =
    div []
        [ input [ type' "file", on "change" (Json.Decode.map SelectFile targetValue |> file) ] []
        , pre [] [ text model.content ]
        ]

Sample output depends on the file content - it displays the content inside a pre element after selecting a file.

Deep Dive

Początkowo Elm został zaprojektowany tak, aby skupić się na front-endzie bez bezpośredniej interakcji z systemem plików. To część większej decyzji zapewnienia bezpiecznego, przewidywalnego środowiska do pisania aplikacji webowych. Alternatywy? Możesz użyć portów do komunikacji z JavaScriptem dla operacji po stronie serwera czy też użyć lokalnego przechowywania, jak localStorage do trzymania danych. Implementacja FileReader’a w Elm wykorzystuje pod spodem natywny mechanizm podobny do tego z JavaScriptu, ale zapakowany w bardziej funkcyjne i bezpieczne API.

See Also