docs(faq): add raw body option usage

Author: tolgap

content/faq/raw-body.md

@@ -0,0 +1,61 @@
+### Raw body
+
+Nest applications have an option to provide the raw contents of the request body. It is disabled by default.
+
+One of the most common use-case for having access to the raw request body is performing webhook signature verifications. Usually to perform webhook signature validations the unserialized request body is required to calculate an HMAC hash.
+
+#### Use with Express
+
+First enable the option when creating your Nest Express application:
+
+```typescript
+const app = await NestFactory.create(AppModule, {
+  rawBody: true,
+});
+await app.listen(3000);
+```
+
+To access the raw request body in a controller, a convenience interface `RawBodyRequest` is provided to expose a `rawBody` field on the request: use the interface `RawBodyRequest` type:
+
+```typescript
+import { Controller, Post, RawBodyRequest, Req } from '@nestjs/common';
+import { Request } from 'express';
+
+@Controller('cats')
+class CatsController {
+  @Post()
+  create(@Req() req: RawBodyRequest<Request>) {
+    const raw = req.rawBody; // returns a `Buffer`.
+  }
+}
+```
+
+#### Use with Fastify
+
+First enable the option when creating your Nest Fastify application:
+
+```typescript
+const app = await NestFactory.create<NestFastifyApplication>(
+  AppModule,
+  new FastifyAdapter()
+  {
+    rawBody: true,
+  }
+);
+await app.listen(3000);
+```
+
+To access the raw request body in a controller, a convenience interface `RawBodyRequest` is provided to expose a `rawBody` field on the request: use the interface `RawBodyRequest` type:
+
+```typescript
+import { Controller, Post, RawBodyRequest, Req } from '@nestjs/common';
+import { FastifyRequest } from 'fastify';
+
+@Controller('cats')
+class CatsController {
+  @Post()
+  create(@Req() req: RawBodyRequest<FastifyRequest>) {
+    const raw = req.rawBody; // returns a `Buffer`.
+  }
+}
+```

src/app/homepage/menu/menu.component.ts

@@ -248,6 +248,7 @@ export class MenuComponent implements OnInit {
         { title: 'Serverless', path: '/faq/serverless' },
         { title: 'HTTP adapter', path: '/faq/http-adapter' },
         { title: 'Global path prefix', path: '/faq/global-prefix' },
+        { title: 'Raw body', path: '/faq/raw-body' },
         { title: 'Hybrid application', path: '/faq/hybrid-application' },
         { title: 'HTTPS & multiple servers', path: '/faq/multiple-servers' },
         { title: 'Request lifecycle', path: '/faq/request-lifecycle' },

src/app/homepage/pages/faq/faq.module.ts

@@ -7,6 +7,7 @@ import { GlobalPrefixComponent } from './global-prefix/global-prefix.component';
 import { HttpAdapterComponent } from './http-adapter/http-adapter.component';
 import { HybridApplicationComponent } from './hybrid-application/hybrid-application.component';
 import { MultipleServersComponent } from './multiple-servers/multiple-servers.component';
+import { RawBodyComponent } from './raw-body/raw-body.component';
 import { RequestLifecycleComponent } from './request-lifecycle/request-lifecycle.component';
 import { ServerlessComponent } from './serverless/serverless.component';
 
@@ -31,6 +32,11 @@ const routes: Routes = [
     component: HttpAdapterComponent,
     data: { title: 'HTTP adapter - FAQ' },
   },
+  {
+    path: 'raw-body',
+    component: RawBodyComponent,
+    data: { title: 'Raw Body' },
+  },
   {
     path: 'request-lifecycle',
     component: RequestLifecycleComponent,

src/app/homepage/pages/faq/raw-body/raw-body.component.ts

@@ -0,0 +1,9 @@
+import { ChangeDetectionStrategy, Component } from '@angular/core';
+import { BasePageComponent } from '../../page/page.component';
+
+@Component({
+  selector: 'app-raw-body',
+  templateUrl: './raw-body.component.html',
+  changeDetection: ChangeDetectionStrategy.OnPush,
+})
+export class RawBodyComponent extends BasePageComponent {}