前置框架day5

1.token

  作用:访问权限的令牌。只有登录之后，才可以访问页面。

   过程：

             1.在auth.js(专门保存访问权限的文件)，判断有无token令牌，若没有就跳转到登录页面，                   修改herf内容。

                                

                //从localstorage中获取token的值的，那么存token的时候就要存在这里！！！！！

                //并且取得是token这个参数，因此存的时候也要存入到token这个变量里。

                 const token = localStorage.getItem('token')

                    if (! token) {

                          location.href= '../login/index.html'  

                               }

            2.若登录成功，保存token令牌字符串到本地，再跳转到首页。              

              只有登录成功之后，才会把token存入。因此这个存入token的js操作就要写在登录页面中                的判断登陆成功的then()函数里面。

                   localStorage.setItem('token', result.data.data.token)

                   //存储名.setitem（‘键名’， ‘值’）会把键值对存入存储地中。

                ps:对于前端来说，只能是拿到token判断有无，和在登录时候存入token到本地中。判断                  之后实行跳转页面。

           2.设置个人昵称

       过程：登录时把自己的token（类似于身份证号）一并传给后台，后台可以解析出你的相关信息。在axios中  axios: ({

                                            headers:{  Authorization: `Bearer ${localStorage.getitem('token')}`}

                                  })

但是每个人都登录都要传自己token，因此可以封装一下子。

利用axios请求拦截器：发起请求之前，触发配置函数，对请求参数进行额外的配置。

会把这个请求拦截器中配置函数加到头部里传给后台来表明自己身份。

   axios.interceptors.request.use(function(config) 

       const token = location.getitem('token') //先取出token

         token && config.header.Authorization = Bearer ${token} //若有token，则将传入参数config的头部的authorization的值修改为 ： 形式为 bearer ${token}  这个形式时接口文档里面要求的形式。

           return config

})

axios响应拦截器，在chtch和then之前进行统一处理

   注意：响应的得到的response是返回对象的所有数据内容

  直接response.data替代了result.data.data.response

3.node.js

    1.fs模块-读写的文件

      先引入fs模块：

                            const fs = require('fs')

    再利用模块中写方法：

                          fs.writefile('文件路径'，‘写入内容’，() => {   //写入之后回调函数，可以判断是否                    写 入成功且可以返回值})

  读取文件内容：

                    fs.readfile('文件路径', (error,data) => {})

                      返回的data是buffer字节流（16进制的），利用data.tostring（）转为字符。

 2.路径问题：

    目的：在node.js中要要用绝对路径，无论在那个文件下都可以区找到其他文件的内容。

    方法：

             引入path模块

                                  const path = require('path')

            利用path.join()和_ _.dirname组合成绝对路径

                                  fa.readfile(path.join(__.dirname, ' 从当前的目录到文件的相对路径'),                                                        (err,data) => {} )

3.压缩前端html：

  把回车符和换行符去掉，并且把压缩的html写入写的文件中

      1.读取源html文件内容

      2.在读出后的函数体内进行：①用正则替换字符串 内容名.replace(/[\r\n]/g, ' ')

                                                     ②再写到新的文件中

4.url端口号

    url用于访问服务器的资源。

   端口号：标记服务器里不同功能的服务程序。

5.http模块

  引入http模块： const http = require('http')

 创建web服务对象: const server = http.createserve()

 .on是添加监听事件，当有人请求时则执行函数：

                   serve.on('request', (req, res) => {

                          res.setHeader('Content-type', 'text/plain;charset=utf-8') //只要有汉字就加上这个

                            res.end('欢迎使用')     // 当有人请求后，req接收传入参数，res是对请求做出的                                                                     回应，回应是以打印欢迎使用为结束。

                             })

wbe对象进行监听，如果有访问端口号为3000的则会后台输出成功，并且执行监听事件

                         serve.listen(3000, () => {

                           console.log('成功')

                               })

最后控制台结束是 ctrl+c

测试端口是否可以使用： http：//localhost:3000

6.node.js模块化

  一个文件就是一个模块。提高每个文件模块的复用，按需加载，独立作用域。

1.导入和导出：

导入：require('路径和模块名')    若是js内部模块直接用，若是自定义的要导入相对地址

导出： module.exports={

                            导出名：值   // 导出名是指把这个值（内容）导出后，别人调用时直接用导出名                                                     就可以调用这个值了

                              array : sum

                                  }

调用导出的内容：

                        const obj = require('路径')

                        要调用sum的值则 const res = obj.array //若sum是函数要传参则用 obj.array(参数)

 2.ECMAScript标准的默认导入导出：

     导出：

             export defalut { 导出名：值}

     导入： 

            import 变量名 from ‘模块名或路径’

3.node.js默认是commonjs标准，若要变成ECMAScript:

   在当前文件夹下建立一个文件名为：  package.json

   并在文件中输入：   {

                            “type” = module

                                   }

4.ECMAScript命名导入导出：（按需加载）

   导入

  export  const url = 'http://.....'  在正常变量前加个export，表示把这个变量导出了

  import {要导出的变量名} from '模块化和路径'

7.包：

         1.把模块（文件），代码，其他都汇聚成一个文件夹就是一个包

          2.包内文件夹下必须要有一个package.json和一个index.js(用来统一对外暴漏接口)

         3.在index.js里面存的是其他文件中的接口：

                       每个文件的最后都会导出接口，index.js就会导入所有接口（require），再把所有                           接口暴漏出去。

         4.导入一个包，默认导入index.js文件，如果没有就会导入package.json中的main文件。

8.npm-软件包管理器：

    1.在一个文件中，首先看是否有package.json，若无则在该文件夹下打开执行：npm init -y 会            生成一个package.json （会记录下载的包的版本等信息）

    2.下载包： npm i 软件包名  （下载的包会存入node_modules中）

    3.使用软件包： 用require('包名') 

【如果运行别人的项目，如果没有node_modules就不知道包有那些，就用 npm i 就可以下载所有      的包了】

9.npm-全局软件包nodemon:

本地软件包：是在当前项目使用，封装的是属性和方法，存在于node_modules

全局软件包： 是本机所有项目使用，封装的是命令和工具，存在于系统中设定的位置。

 先安装：npm i nodemonm -g 

运行：nodemon js文件