如何在elm中使用带header和body的http post

在 Elm 中使用带有 header 和 body 的 HTTP POST 请求，可以通过使用 Elm 的 Http 模块来实现。下面是一个完整的示例代码：

import Browser
import Html exposing (text)
import Http
import Json.Encode as Json

type alias Model =
    { response : String }

type Msg
    = Submit

init : Model
init =
    { response = "" }

update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        Submit ->
            let
                body =
                    Json.object
                        [ ( "key1", Json.string "value1" )
                        , ( "key2", Json.string "value2" )
                        ]
                
                headers =
                    [ ( "Content-Type", "application/json" )
                    , ( "Authorization", "Bearer your_token" )
                    ]
                
                request =
                    { method = "POST"
                    , headers = headers
                    , url = "https://example.com/api/endpoint"
                    , body = Http.jsonBody body
                    , expect = Http.expectString GotResponse
                    , timeout = Nothing
                    , withCredentials = False
                    }
            in
            ( model, Http.send GotResponse (Http.request request) )

GotResponse : Result Http.Error String -> Msg
GotResponse result =
    case result of
        Ok response ->
            -- 处理成功响应
            GotResponseText response

        Err error ->
            -- 处理错误响应
            GotResponseText (Http.errorToString error)

GotResponseText : String -> Msg
GotResponseText response =
    -- 更新模型，显示响应结果
    ( { model | response = response }, Cmd.none )

view : Model -> Html Msg
view model =
    div []
        [ button [ onClick Submit ] [ text "发送请求" ]
        , div [] [ text model.response ]
        ]

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

在这个示例中，我们定义了一个 Model 类型来存储响应结果，以及一个 Msg 类型来表示用户操作。init 函数初始化了模型，update 函数根据用户操作更新模型，并发送 HTTP 请求。view 函数用于渲染用户界面。

在 update 函数中，当用户点击按钮时，我们创建了一个包含请求信息的 request 对象，并使用 Http.send 函数发送请求。请求的方法是 POST，请求头包含了 Content-Type 和 Authorization，请求体是一个 JSON 对象。expect 字段指定了期望的响应类型为字符串。

当收到响应时，GotResponse 消息将被触发，我们根据响应结果更新模型，并显示在界面上。

请注意，这只是一个简单的示例，实际应用中可能需要根据具体情况进行适当的修改。另外，为了使代码更加简洁，示例中省略了错误处理和其他细节。