javascript - 用于连接到 Phoenix channel 的简约 html/javascript 包

Question

我正在寻找一种方法来为前端开发人员创建一个极简主义的演示包，以便他们可以轻松地集成 Elixir/Phoenix api 服务器和移动 HTML5 应用程序或非 Phoenix 提供的(旧版)web 应用程序之间的 channel 。

注意:Javascript 从来都不是我的 friend ......

我正在使用 --no-brunch 生成的 Phoenix 应用程序进行测试。 app.js 和phoenix.js 都位于priv/static/js/。

app.js 包含:

var socket = null
// Responds to a click on a "Connect" button on the GUI
function doConnect() {
    socket = new Socket("/socket", {params: {token: "abc"}})

    socket.connect()
    let channel = socket.channel("user:anonymous", {})
    channel.join()
    .receive("ok", resp => { console.log("Joined successfully", resp) })
    .receive("error", resp => { console.log("Unable to join", resp) })
}
...
// some other GUI callbacks

当我放入 .html 文件时:

<script src="<%= static_path(@conn, "/js/phoenix.js") %>"></script
<script src="<%= static_path(@conn, "/js/app.js") %>"></script>

我进入控制台

ReferenceError: Socket is not defined

另一方面，如果我从 .html 中删除 phoenix.js 并将其放入 app.js使用 import "./phoenix.js"，我在控制台中得到 SyntaxError: import declarations may only appear at top level of a module。

那么 .js 文件应该放在哪里，以及如何包含它们以获得有效的东西？

也许相关的问题是:如何在没有早午餐的情况下使用 channel ？

Answer 1

我从Elixir Forum得到了答案.对 Socket 构造函数的调用不应该是 socket = new Socket("/socket", {params: {token: "abc"}}) 而是 socket = new Phoenix.Socket("/socket", {params: {token: "abc"}}).

一旦这个就位，一切都很好。