Elixir- phoenix server side rendering react using std_json_io and react-stdio

613 views Asked by At

I followed the tutorial from https://medium.com/@chvanikoff/phoenix-react-love-story-reph-1-c68512cfe18 and developed an application but with different versions.

elixir - 1.3.4
phoenix - 1.2.1
poison - 2.0
distillery - 0.10
std_json_io - 0.1

The application ran successfully when running locally. Bur when created a mix release(MIX_ENV=prod mix release --env=prod --verbose) and ran rel/utopia/bin/utopia console(the otp application name was :utopia), I ran into error

Interactive Elixir (1.3.4) - press Ctrl+C to exit (type h() ENTER for help)
14:18:21.857 request_id=idqhtoim2nb3lfeguq22627a92jqoal6 [info] GET /
panic: write |1: broken pipe


                            goroutine 3 [running]:
                                                  runtime.panic(0x4a49e0, 0xc21001f480)
                                                                                        /usr/local/Cellar/go/1.2.2/libexec/src/pkg/runtime/panic.c:266 +0xb6
                                  log.(*Logger).Panicf(0xc210020190, 0x4de060, 0x3, 0x7f0924c84e38, 0x1, ...)
                                                                                                                /usr/local/Cellar/go/1.2.2/libexec/src/pkg/log/log.go:200 +0xbd
                                                     main.fatal_if(0x4c2680, 0xc210039ab0)
                                                                                            /Users/alco/extra/goworkspace/src/goon/util.go:38 +0x17e
                              main.inLoop2(0x7f0924e0c388, 0xc2100396f0, 0xc2100213c0, 0x7f0924e0c310, 0xc210000000, ...)
                                                                                                                         /Users/alco/extra/goworkspace/src/goon/io.go:100 +0x5ce
                                                      created by main.wrapStdin2
                                                                                    /Users/alco/extra/goworkspace/src/goon/io.go:25 +0x15a

                    goroutine 1 [chan receive]:
                                               main.proto_2_0(0x7ffce6670101, 0x4e3e20, 0x3, 0x4de5a0, 0x1, ...)
                                                                                                                    /Users/alco/extra/goworkspace/src/goon/proto_2_0.go:58 +0x3a3
                                                           main.main()
                                                                        /Users/alco/extra/goworkspace/src/goon/main.go:51 +0x3b6
      14:18:21.858 request_id=idqhtoim2nb3lfeguq22627a92jqoal6 [info] Sent 500 in 1ms
14:18:21.859 [error] #PID<0.1493.0> running Utopia.Endpoint terminated
Server: 127.0.0.1:8080 (http)
Request: GET /
** (exit) an exception was raised:
    ** (Protocol.UndefinedError) protocol String.Chars not implemented for {#PID<0.1467.0>, :result, %Porcelain.Result{err: nil, out: {:send, #PID<0.1466.0>}, status: 2}}
        (elixir) lib/string/chars.ex:3: String.Chars.impl_for!/1
        (elixir) lib/string/chars.ex:17: String.Chars.to_string/1
        (utopia) lib/utopia/react_io.ex:2: Utopia.ReactIO.json_call!/2
        (utopia) web/controllers/page_controller.ex:12: Utopia.PageController.index/2
        (utopia) web/controllers/page_controller.ex:1: Utopia.PageController.action/2
        (utopia) web/controllers/page_controller.ex:1: Utopia.PageController.phoenix_controller_pipeline/2
        (utopia) lib/utopia/endpoint.ex:1: Utopia.Endpoint.instrument/4
        (utopia) lib/phoenix/router.ex:261: Utopia.Router.dispatch/2

goon got panicked and hence the porcelain. Someone please provide a solution.

Related issues: https://github.com/alco/porcelain/issues/13

EDIT: My page_controller.ex

defmodule Utopia.PageController do
  use Utopia.Web, :controller

  def index(conn, _params) do
    visitors = Utopia.Tracking.Visitors.state
    initial_state = %{"visitors" => visitors}
    props = %{
      "location" => conn.request_path,
      "initial_state" => initial_state
    }

    result = Utopia.ReactIO.json_call!(%{
      component: "./priv/static/server/js/utopia.js",
      props: props
    })

    render(conn, "index.html", html: result["html"], props: initial_state)
  end
end
0

There are 0 answers