在浏览器网络中出现故障 Http.error 显示响应

Question

我正在探索 ELM 并尝试访问网络 api。我关注了这个 link.

我能够访问我的服务并获得响应（显示在浏览器网络选项卡中），但故障代码部分是从 elm 更新执行的。

实施

---Model 
type alias Model =
    { 
      message : String,
    }

model:Model
model = {
    message = "Hello"
    }


--update


postRequest : Http.Request
postRequest =
    { verb = "POST"
    , headers =
        [("Content-Type", "application/json")
        ]
    , url = "http://xyz/events/list"
    , body = Http.string """{ "domainId": 1 }"""
    }

getEventList: Cmd Msg
getEventList = 
      Task.perform Messages.FetchFail Messages.FetchSucceed (Http.fromJson decodeString (Http.send Http.defaultSettings postRequest))



update : Msg -> Model -> ( Model, Cmd Msg )
update msg model =
    case msg of
        Messages.NoOp ->
            ( model, Cmd.none )
        Messages.FetchSucceed xy->
            ({model| message = "success"},Cmd.none)
        Messages.FetchFail _->
            ({model |message = "fail"} ,Cmd.none)

API 回复：

{   "message": "",   "data": [
    {
      "eventId": 104,
      "title": "private Events",
      "description": "abc",
      "businessId": 51,
      "businessTitle": "VampireDA_Adda",
      "startDate": "2016-07-08" 
    },
    {
      "eventId": 107,
      "title": "Event weekly Midnight",
      "description": "xyz",
      "businessId": 44,
      "businessTitle": "Spanish Scotch",
      "startDate": "2016-07-08"          

    }] }

如果我实施有任何错误，请帮助我。

还有我如何解码 json 来建模（用响应 json 填充模型）？

Answer 1

您收到错误消息的原因可能是解码失败。但首先尝试习惯管道

Http.send Http.defaultSettings postRequest
|> Http.fromJson decodeString
|> Task.perform Messages.FetchFail Messages.FetchSucceed

要解码你需要一个 Elm 记录

type alias DataItem = 
    { eventId: Int
    , title: String
    , description : String
    , businessId : Int
    , businessTitle : String
    , startDate: String
    }

解码器看起来像

dataDecoder = 
    object6 DataItem
    ("eventId" := int)
    ("title" := string)
    ("description" := string)
    ("businessId" := int)
    ("businessTitle" := string)
    ("startDate" := string)

decoder = at ["data"] (list dataDecoder)

解码器需要一点时间来适应，所以我创建了一个网站来帮助您练习：http://simonh1000.github.io/decoder/

在浏览器网络中出现故障 Http.error 显示响应

getting failure Http.error while in browser network shows response

elm