Typescript爬虫实战(2) ---- 使用表单的形式对接口进行保护

在完成了爬取数据的借口之后，遇到了一些问题：

接口没有做保护，可能会被人恶意一直请求，导致一直爬取数据导致内存溢出

使用表单提交的方式

只有在密码输入正确的前提下，才可以成功请求。

定义表单

router.get('/',(req:Request,res:Response)=>{
  const formHtml = `
  <body>
    <form method='POST' action='/getData'>
      <input type='password' name='password'>
      <button>Submit</button>
    </form>
  </body>
  `
  res.send(formHtml)
})

但在提交了之后，缺抛出这样的错：

image.png

原因是虽然数据已经在request.body里了，但express并没有对其进行有效地解析。

借助body-parser这个中间件帮忙进行解析：
安装：npm install body-parser
表单提交使用：app.use(bodyParser.urlencoded({ extended: false }))

配置了之后就可以了。
但引入了两个ts下的express问题：

为什么body.password是undefined, ts却没有抛出任何的错
原因：在express的类型注解文件中，Response是any

image.png
对req的改变只是改变了值，并没有改变其对应的类型。

为了解决上述的两个问题，需要对express的类型描述文件进行扩展

对express的类型描述文件进行拓展

补充定义

//对body下的属性进行拓展
interface RequestWithForm extends Request{
 body:{
   password:string | undefined
   //[key:string]:string || undefined
 }
}

2.增加描述文件来拓展类型
可以借鉴import * as core from "express-serve-static-core";这一个文件


declare namespace Express {
      // These open interfaces may be extended in an application-specific manner via declaration merging.
      // See for example method-override.d.ts (https://github.com/DefinitelyTyped/DefinitelyTyped/blob/master/types/method-override/index.d.ts)
  interface Request {
    username:string
  }
  interface Response { }
  interface Application { }
}

ts的特性，可以使用类型融合对request，response进行拓展。