模拟项目一些问题

总结

• 弹窗插件

  • toastr

• 拦截器业务错误处理

  • 发送请求前，判断token密钥存在并且添加到本地
  • 判断状态码和业务码各自不相同的业务
    • 企业内的业务码code各不相同，如果业务码出现错误，可以调用toastr弹窗提示，将业务码出错的原因message展示给用户
    • 状态码status出错，例如本项目中的401错误，表示用户还没登录没有token密钥，需要强制退回login.html，提醒用户登录
  • 业务码和状态码判断
    • 状态码正确业务码未必正确

• 验证表单插件

  • 案例中，表单验证使用的是 bootstrapValidator 插件。
  • 网上有很多关于它的介绍，这里 和 这里。

• HTML页面跳转路径

  • css：引入图片，使用相对路径，参照物是当前css文件
  • js：跳转其他的HTML页面，使用相对路径，参照物是以运行这个js文件所在的html页面为参照物

• JWT身份认证：企业99%会用到，贯穿整个项目的token加密身份码

• iframe页中页（企业不常用）

• 表单提交默认刷新页面**(常用)**

  const form=doument.querySelector("form")
  form.addEventlistener("form",function(e){
  	e.preventDefault()
  })
  // 无论表单里是什么按钮都不会默认刷新了
  

• 禁止表单自动填写**(常用)**

  <form autocomplete="off"></form>
  

• 获取dom元素中的子元素

  <div>
  	<a href="javascript:;"></a>
  </div>
  	<a href="javascript:;"></a>
  <script>
    const div=document.querySelector("div")
    const a=div.querySelector("a")
  </script>
  

• axios基地址

  1. 实际项目开发过程：至少存在两个接口服务器

  2. 开发阶段用假数据的接口服务器

  3. 生产阶段用真实数据的接口服务器

  4. axios可以设置一个基地址

  5. 作用：后续写发送请求的代码可以不带上基地址，只写最关键的接口部分地址即可

     // 设置基地址，开发时只需要写关键接口即可
     axios.defaults.baseURL = "http://www.itcbc.com:8000";