PureScript Halogen 和 websockets [英] PureScript Halogen and websockets

问题描述

我正在尝试将 purescript-halogen 与 websockets 结合使用，但经过多次尝试后，我无法让它们协同工作.

I'm trying to use purescript-halogen in combination with websockets, but after several attempts I'm unable to make them work together.

我看过关于Thermite 和websockets 的这个问题 以及Phil 对驱动程序功能.Halogen 也有一个Driver 函数，但是我需要运行Driver 函数和Aff 效果，而purescript-websockets-simple 使用 Eff 效果.

I've seen this question on Thermite and websockets and Phil's answer regarding the Driver function. Halogen also has a Driver function, but I need to run the Driver function with the Aff effect, while purescript-websockets-simple uses the Eff effect.

我不知道如何将 websocket 包的同步回调转换为在 Aff monad 中运行的异步代码.我需要使用 AVar 吗?我需要 purescript-coroutines-aff 吗?如果是这样，我如何将这些部分连接在一起?

I've no idea how to transform the synchronous callbacks of the websocket package to asynchronous code running in the Aff monad. Do I need to use an AVar? Do I need purescript-coroutines-aff? If so, how do I hook up these parts together?

预先感谢您提供正确方向的任何指示！

Thanks in advance for any pointers in the right direction!

推荐答案

在这种情况下，您确实希望使用 purescript-aff-coroutines.这将为您提供一个协程 Producer，然后您可以将其连接到一个 Consumer 将消息推送到驱动程序中:

In this case you would indeed want to use purescript-aff-coroutines. That will get you a coroutine Producer that you can then hook up to a Consumer that pushes messages into the driver:

module Main where

import Prelude

import Control.Coroutine (Producer, Consumer, consumer, runProcess, ($$))
import Control.Coroutine.Aff (produce)
import Control.Monad.Aff (Aff)
import Control.Monad.Aff.AVar (AVAR)
import Control.Monad.Eff (Eff)
import Control.Monad.Eff.Exception (EXCEPTION)
import Control.Monad.Eff.Var (($=))

import Data.Array as Array
import Data.Either (Either(..))
import Data.Maybe (Maybe(..))

import Halogen as H
import Halogen.HTML.Indexed as HH
import Halogen.Util (runHalogenAff, awaitBody)

import WebSocket (WEBSOCKET, Connection(..), Message(..), URL(..), runMessageEvent, runMessage, newWebSocket)

----------------------------------------------------------------------------
-- Halogen component. This just displays a list of messages and has a query
-- to accept new messages.
----------------------------------------------------------------------------

type State = { messages :: Array String }

initialState :: State
initialState = { messages: [] }

data Query a = AddMessage String a

ui :: forall g. H.Component State Query g
ui = H.component { render, eval }
  where
  render :: State -> H.ComponentHTML Query
  render state =
    HH.ol_ $ map (\msg -> HH.li_ [ HH.text msg ]) state.messages

  eval :: Query ~> H.ComponentDSL State Query g
  eval (AddMessage msg next) = do
    H.modify \st -> { messages: st.messages `Array.snoc` msg }
    pure next

----------------------------------------------------------------------------
-- Websocket coroutine producer. This uses `purescript-aff-coroutines` to
-- create a producer of messages from a websocket.
----------------------------------------------------------------------------

wsProducer :: forall eff. Producer String (Aff (avar :: AVAR, err :: EXCEPTION, ws :: WEBSOCKET | eff)) Unit
wsProducer = produce \emit -> do
  Connection socket <- newWebSocket (URL "ws://echo.websocket.org") []

  -- This part is probably unnecessary in the real world, but it gives us 
  -- some messages to consume when using the echo service
  socket.onopen $= \event -> do
    socket.send (Message "hello")
    socket.send (Message "something")
    socket.send (Message "goodbye")

  socket.onmessage $= \event -> do
    emit $ Left $ runMessage (runMessageEvent event)

----------------------------------------------------------------------------
-- Coroutine consumer. This accepts a Halogen driver function and sends
-- `AddMessage` queries in when the coroutine consumes an input.
----------------------------------------------------------------------------

wsConsumer
  :: forall eff
   . (Query ~> Aff (H.HalogenEffects (ws :: WEBSOCKET | eff)))
  -> Consumer String (Aff (H.HalogenEffects (ws :: WEBSOCKET | eff))) Unit
wsConsumer driver = consumer \msg -> do
  driver $ H.action $ AddMessage msg
  pure Nothing

----------------------------------------------------------------------------
-- Normal Halogen-style `main`, the only addition is a use of `runProcess`
-- to connect the producer and consumer and start sending messages to the
-- Halogen component.
----------------------------------------------------------------------------

main :: forall eff. Eff (H.HalogenEffects (ws :: WEBSOCKET | eff)) Unit
main = runHalogenAff do
  body <- awaitBody
  driver <- H.runUI ui initialState body
  runProcess (wsProducer $$ wsConsumer driver)
  pure unit

这应该会给你一个几乎立即打印的页面:

This should give you a page that almost immediately prints:

1. 你好
2. 东西
3. 再见

但它正在做你需要的一切，老实说！如果您使用带有真实"来源的生产者，您将获得更符合您需要的东西.

But it is doing everything you need, honest! If you use the producer with a "real" source you'll get something more like what you need.

这篇关于PureScript Halogen 和 websockets的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！