node.js - 如何将 Reagent 添加到 Node JS API

Question

我有一个简单的 Node JS 应用程序，它提供 API。我可以 node main.js 来运行服务器，并调用 localhost:3000/api/names 来成功获取名称列表。我想在此基础上使用 Reagent/Cljs。

我可以在 localhost:3030 上运行一个 Reagent 应用程序。我的问题是，如何从 Reagent 应用程序对 Node 应用程序进行 API 调用？或者我的架构全错了？我应该合并这两个应用程序吗？如果是，该怎么做？

我尝试过将它们组合起来，但 Reagent 希望在 Ring 上运行，而 Node 应用程序希望在 Node 服务器上运行。所以两人之间至今还没有任何交流。我尝试过 the Quick Start指南，但这并不是完全相同的情况。我还给了this approach一去无果。将这些部分组合在一起以便我可以将 API 响应数据从 Node 应用程序带到 Reagent 应用程序的最简单方法是什么？或者有没有办法从我缺少的试剂应用程序中进行 API 调用？

Answer 1

是的，您需要在浏览器中运行的代码和服务器上运行的代码之间进行通信。

基本方法是使用 XHR。客户端应该做这样的事情:

(ns foo
  (:require [goog.net.XhrIo :as xhr]))

(xhr/send "/api/names"
          (fn [e]
            (prn (.. e -target getResponseText))))

或者还有一个使用非常广泛的库 cljs-http

 (ns foo
  (:require
    [cljs.core.async :refer [<!]]
    [cljs-http.client :as http])
  (:require-macros
    [cljs.core.async.macros :refer [go]]))

(go (let [response (<! (http/get "data.edn"))]
      (prn (:status response))
      (prn (:body response))))

它使用 core.async 通过 channel 将结果返回给您。不过，您实际上不需要关心它来使用它，除了要注意 go block 中的事情将在“稍后”发生。

对于高级用法，您可以使用 sente 创建 websockets

网页的一个重要考虑因素是它们只能在为页面提供服务的同一端口上的同一主机上执行 XHR。因此，如果您将 API 托管在 localhost:3030，则必须从 localhost:3030 提供该页面，以便您能够与其通信。 (这称为同源策略)。

您在问题中指出，您的 API 位于端口 3000 上，而 Reagent 应用程序由 3030 提供服务。由于同源策略，这将不起作用。有一个名为 CORS 跨源资源共享的标准，从技术上讲您可以使用该标准，但实际上不要这样做。相反，从与 API 相同的服务器提供 HTML/Javascript。

这对您来说意味着您需要确保在构建 Reagent 应用程序时，包含最终 JavaScript 的 HTML 页面需要由为您的 API 提供服务的同一台服务器提供服务。通常，这是将 HTML 和 JavaScript 放入服务器上的资源文件夹中的问题。