Phoenix 1.5 with liveview in to AWS ECS/Fargate need insight

Phoenix Forum Questions / Help
, , ,
1

My POC
Step 1: I have generated a new phoenix 1.5 app along with the live view dashboard

Step 2: I have deployed that app into ECS Fargate. Current running in two containers with an Application load balancer.

My Docker File:

FROM bitwalker/alpine-elixir-phoenix:latest as releaser

WORKDIR /app

# Cache elixir deps
ADD mix.exs mix.lock ./
RUN MIX_ENV=prod mix do deps.get, deps.compile

# Same with npm deps
ADD assets/package.json assets/
RUN cd assets && \
    npm install

ADD . .

# Run frontend build, compile, and digest assets
RUN cd assets/ && \
    npm run deploy && \
    cd - && \
    mix do compile, phx.digest

# COPY rel rel
RUN MIX_ENV=prod mix release

RUN ls /app/_build/prod

########################################################################

FROM bitwalker/alpine-elixir-phoenix:latest

EXPOSE 4000
ENV PORT=4000 \
    MIX_ENV=prod

WORKDIR /app

COPY --from=releaser /app/_build/prod/rel/my_poc /app
COPY --from=releaser /app/priv/ /app/priv/
RUN ls /app/priv/static

ENTRYPOINT ["./bin/my_poc"]
CMD ["start"]

Now the application is running in ECS fargate. When I browse the normal controller pages of the app. It works perfectly.
But when I access the page with the liveview(websocket). The page keeps on refreshing. It throws the below error in console.

Screenshot from 2020-08-05 21-08-33
Screenshot from 2020-08-05 21-08-331853Ă—1053 155 KB

Can someone give me insight on what’s happening. ?
How to make Phoenix liveview work in a ECS cluster?

Are there any library which I need to use like Libcluster for this to work or any additional config settings?

Your help is greatly appreciated. Thanks

1 Like
2

So we are getting a 403 forbidden status code. My initial thought is that we might be failing the check_origin option for the websocket connection. What is that currently set to?

2 Likes
4

yes i set the “check_origin” now and it’s working. Thanks:-)

config :my_poc, MyPocWeb.Endpoint,
  http: [
    port: String.to_integer(System.get_env("PORT") || "4000"),
    transport_options: [socket_opts: [:inet6]]
  ],
  url: [host: "localhost", port: System.get_env("PORT")],
  cache_static_manifest: "priv/static/cache_manifest.json",
  server: true,
  root: ".",
  secret_key_base: secret_key_base,
  version: Application.spec(:phoenix_distillery, :vsn),
  check_origin: ["//production-ecs-cluster-alb-01010101.ap-south-1.elb.amazonaws.com", "//example.com"]