Node.js 如何在服务器端重用Angular表单进行验证？

我想在Angular 4.4.5和NodeJS 7.10.1（Ubuntu repos的最新版本）中重用客户端和服务器端的同一组验证器。我相信这是可能的

我的基本想法是让HTTP端点在NodeJS和Express上工作，后者用Angular表单中的JSON数据接受POST请求，用接收到的数据创建相同的表单并进行检查

---

我的尝试没有成功，我不知道如何使用和Angular使用的相同版本的Typescript，以及如何使用表单导入组件。最好能看到一些简单的例子。我将很快与大家分享我的尝试。

到现在为止，我已经成功地用这种方式实例化了这个组件

创建

cli.ts

以测试角度组件的独立创建：

import 'reflect-metadata';
import { CuComponent } from './app/cu.component';

console.log(new CuComponent())

使用

tsconfig.json

中的一些设置运行

tsc

：

tsc -t es5 --lib es2016,dom --experimentalDecorators src/cli.ts

已获得输出：

CuComponent {
  registration: 
   FormGroup {
     validator: null,
     asyncValidator: null,
     _onCollectionChange: [Function],
     _pristine: true,
     _touched: false,
     _onDisabledChange: [],
     controls: { familyName: [Object], givenName: [Object], phone: [Object] },
     _valueChanges: 
      EventEmitter {
        _isScalar: false,
        observers: [],
        closed: false,
        isStopped: false,
        hasError: false,
        thrownError: null,
        __isAsync: false },
     _statusChanges: 
      EventEmitter {
        _isScalar: false,
        observers: [],
        closed: false,
        isStopped: false,
        hasError: false,
        thrownError: null,
        __isAsync: false },
     _status: 'VALID',
     _value: { familyName: null, givenName: null, phone: null },
     _errors: null } }

---

组件已创建。

经过长时间搜索，我找到了解决方案。Angular现在支持带有库的工作空间和使用Node和Express.js的服务器端表单呈现（ssr）。所以Angular 8+基本上已经具备了所需的一切

我所做的是将所有共享代码放在一个库中，这样我就可以在前端使用它，也可以在SSR应用程序上重用它（验证）。我不认为这是必要的，但是一个干净的结构是有帮助的

要创建结构，我刚刚使用了cli：

• 创建新的工作区
• 为共享代码生成库
• 为前端生成应用程序（普通ng应用程序）
• 为验证服务器生成应用程序并在其上运行

  ng add@nguniversal/express engine

您可以在教程中找到有关如何执行此操作的所有相关信息：

• SSR/通用：
• CLI：
• 反应形式：

现在，我使用生成的

server.ts

并删除了其中的大部分（示例处理程序）。 首先，我在JSON解析方面遇到了一些问题。但是主体解析器可以做到这一点

// ...
import * as bodyParser from "body-parser";
// ...
export function app() {
  const server = express();
  server.use(bodyParser.json());
  // ...

然后我添加了这个处理程序：

  server.post('/api/validate', (req, res) => {
    // createFormGroup is from my code, 
    // because I generate the form from TypeScript classes.
    // You can just use a FormBuilder in your component 
    // and export the function so you can use it here.
    const fg = createFormGroup();     
    fg.patchValue(req.body);
    res.status(200).send({
        "accepted" : "VALID" === fg.status
        // You can send additional information, like errors
      });
  });

调用

fg.updateValueAndValidity（）

似乎没有必要，因为

patchValue

已经完成了所有这一切

构建和启动服务器的时间。
不知何故，我现在遇到了一个问题，构建脚本不能与

--prod

一起工作。 但这是：

ng构建；ng运行验证：服务器：生产；npm运行服务：ssr

您应该得到：

Node Express服务器正在侦听http://localhost:4000

就这样。真的很容易

我使用curl进行测试：

curl.exe --data "@data.json" -H "Content-Type: application/json" -X POST http://localhost:4000/api/validate

我不知道如何调试这个，但是

console.log

工作正常。为了测试您在这个服务器上使用的代码，您应该使用单元测试（jasmine）。因此，尽管启动速度很慢，但我很高兴现在可以在服务器上验证代码

---

递归地比较

req.body

和

fg.value

是否相等可能是有意义的，以确保验证后数据仍然相同

有人有这样的工作实例吗？使用json数据并使用验证期间发现的错误进行回复的web服务？