我应该将前端代码放在我的后端项目中的啥位置以及如何/何时运行它？

Posted 2023-02-22

【中文标题】我应该将前端代码放在我的后端项目中的啥位置以及如何/何时运行它？

【英文标题】：Where do I put front-end code in my backend project and how/when to run it?我应该将前端代码放在我的后端项目中的什么位置以及如何/何时运行它？

【发布时间】：2018-05-20 16:19:48

【问题描述】：

问题是，假设我使用 Python 编写了一个后端 REST 服务，然后其他人用 Angular JS 编写了一些前端代码。典型的工作流程是否将它们放入两个单独的文件夹并分别运行？所以这个过程将如下所示

python manage.py runserver 

在 Python 中更冷，然后可能

# in the angular2 folder
npm start

或者我应该把所有的 JS 代码放到某个 assets 文件夹中，当我启动我的服务器时，所有的 JS 代码都会自动运行？如果是这样，我应该怎么做？

另一个相关的问题是，所有的 JS 代码是什么时候发送到用户的浏览器的？如果应用程序是客户端渲染应用程序，代码是否在服务器第一次请求时发送到浏览器？服务器如何知道它应该打包你的 JS 代码并发送它？

【问题讨论】：

你需要提供一个带有<script>标签的html页面。

@SLaks 你是说我应该指向我在每个后端 HTML 模板中编写的 Angular JS 代码吗？

这不是 SPA 的工作方式。您需要一个仅加载 SPA 的 HTML 文件。

【参考方案1】：

Q)问题是，假设我使用 Python 编写了一个后端 REST 服务，然后其他人用 Angular JS 编写了一些前端代码。典型的工作流程是否将它们放入两个单独的文件夹并分别运行？

Angular 和 Python 可以以不同方式运行，也可以同时运行。 您可以选择将 Angular 文件（符合所有实际用途的公共文件）放在公共（或相关文件夹）中，具体取决于您使用的框架 - Django、Flask、Web2py 等。

您还可以选择将它们作为独立应用程序独立运行。

取决于您的要求。老实说，有很多方法可以回答这个问题。

Q)或者我应该把所有的 JS 代码放到某个 assets 文件夹中，当我启动我的服务器时，所有的 JS 代码都会自动运行？如果是这样，我应该怎么做？ 如果您将所有内容都放在 assets 文件夹中，那么一旦主路由或任何其他路由发出 [from a browser] 的请求，公用文件夹就会传递给浏览器。 虽然我不确定服务器端渲染是否属于这种情况。 如果您使用的是 Angular 1，我认为它不适合服务器端渲染，尽管您可以使用一些库。

Q)另一个相关的问题是，所有的 JS 代码是什么时候发送到用户的浏览器的？如果应用程序是客户端渲染应用程序，代码是否在服务器第一次请求时发送到浏览器？服务器如何知道它应该打包你的 JS 代码并发送它？ 服务器上 PUBLIC 文件夹中的所有文件都可以通过浏览器访问。

您的所有问题似乎本质上都是在问同一个问题。

【讨论】：

非常感谢您的回答！那么如果我决定将 Angular JS 和 Python 代码作为两个独立的应用程序运行，那么浏览器什么时候获取 JS 代码呢？

浏览器从 Angular 应用获取 js 代码。它向 python 服务器（用作您的 API/后端）发出请求。这种情况下的服务器通常不服务js。

【参考方案2】：

有很多方法可以解决这个问题。

如果基础架构管理对您来说很困难，那么将它们放在同一台服务器上可能会更容易。您可以创建另一个目录并将您的 html 与您的 javascript 代码一起提供给浏览器。

如果您有一个良好的管道（我认为它可以自己付费），那么拥有另一个为您的应用程序提供服务的服务器会更好。您可以在不影响服务的情况下做更多事情，例如缓存等。运行服务的服务器也不会忙于服务资产。

我有一个案例，我们运行一个节点服务器，它为我们的用户提供 html 和 javascript，因为这样我们就可以进行服务器端渲染。enter link description here

代码执行的流程是这样的：一旦你的用户的浏览器访问了提供 html 和 assets 的服务器，它会在本地下载它并开始执行 JavaScript（解析、编译和执行）。您的 JavaScript 应用可能会在初始化时执行一些 API 调用，也可能不会，但只有在前端发出请求时才会执行您的服务。

至于CORS，你如何为他们服务无关紧要，因为你可以让他们始终在同一个域中。