正文

现在，前后端分离的概念深入人心，前端、后端应用从代码仓库到发布到运行，完全都是独立的两套系统，互不影响，带来了良好的独立性。然而，我觉得在某些条件下，前后端不分离，也不失为一种很好的解决方案，在软件开发中，没有什么万金油方案，都是要因地制宜。

一般一些中小系统，尤其是管理后台，就比较适合前后端不分离的开发方式，或者是前端同学，意向学习 go 语言，通过这种前后端不分离的方式快速开发和学习；或者是后端同学，独立开发包含前端的项目。

较于前后端分离，用 Go 语言开发前后端不分离的项目有如下优点：

  • 前后端代码最后都打包到一个二进制文件，无论是做容器，还是单独运行，都非常省事。
  • 后端可以利用 go 的模板技术，在不深入学习前端知识的情况下，也能做出效果尚可的设计。
  • 前端用 vue、react、甚至直接写 jQuery 都行，对技术无限制。
  • 静态语言高性能，由于 go 直接编译成机器码，相较于 PHP、Java的 JSP这些也可以做前后端不分离技术的语言，性能会稍微好点。

接下来，以一个实际项目为例，介绍前后端不分离项目的开发过程：

Sail 后端使用 Gin 框架，前端使用 LayUI（基于 jQuery），用到了模板技术。

1. 项目结构

前端代码都存在于 ui 文件夹，后端代码都存在于 internal 文件夹，其它文件是一些容器打包命令之类。

2. 前端项目

在 ui 文件夹中，static 存着一些 js 库、css 样式、图片之类，template 目录下是 html 模板。这就是 Layui 所需的全部了。我对比过 vue、react 和 layui，最后还是觉得 layui 更适合后端程序员开发前端网页，比较返璞归真，HTML+CSS+JQuery网上的资料也很多，可以专注于开发逻辑，不至于陷入学习知识的漫长过程中。

publicdist

3. 后端项目

后端项目与一个 gin 的标准示例框架没什么不同，前端来访问也是当成一个正常的接口访问，只是有一点不同的是，由于前后端不分离，前端访问接口无需带域名（或者 ip），毕竟部署也是部署在一起的，直接访问 url 就行。

4. 结合在一起

关键是在前端项目根目录中增加一个.go文件，内部引用前端页面：

TemplateFSStaticFS//go:embed././templateui/templateui/staticTemplateFSStaticFSFSFileSystem

在 go 程序编译时，编译器监测到文件内的 go:embed 注释，则会读取这些文件，把它们标记好，在最后生成可执行文件时，把文件内容打到 embed.FS 中。所以这个技术不能支持太大的文件，不然内存容量都可能不够。

接下来，在后端 go 程序的代码，运行 gin 时基本上是这样写法：

RunHTTPHandler
/static/xxxxx.css
SetHTMLTemplate
/ui/index

这就是 Go 开发前后端不分离项目的全部流程，其中一些代码细节，可以去 Sail 这个项目查看，也可以基于这个项目，打造自己的前后端不分离项目。

如果想使用 vue、react 等前端框架技术，也可以看看 parca，它使用了 HTTP 后端、GRPC 后端、React 前端、Yarn 打包等如今比较热门的技术，可以作为参考。