关于node接口和token各种信息

Express是一个基于 Node.js 平台，快速、开放、极简的 web 开发框架，还有koa等框架，后续补充（node学习—CORS跨域和中间件）。

一  安装并搭建服务器

1.下载node到环境下，并创建一个写服务器的目录（PRO），编辑器打开并进入（大家都会）

2.通过 npm init 命令为你的应用创建一个 package.json 文件

3.安装express      npm install express --save

4.搭建Express服务器

进入PRO目录，新建app.js（其他名字都可），这是当前应用的入口文件，写如下代码

//1 导入 express 模块

const express = require('express')

//2 创建 express 的服务器实例/应用

const app = express()

// 导入 cors 中间件

const cors = require('cors')

// 不传参默认允许简单跨域和预检跨域

app.use(cors())

// body-parser是Express一个常用中间件作用是对post请求的请求体进行解析

const bodyParser=require('body-parser')

// 配置解析 application/x-www-form-urlencoded post请求格式的表单数据

app.use(bodyParser.urlencoded({extended:false}))

//处理json格式参数

app.use(bodyParser.json())

//可选为了测试加的下面客户端响应步骤

//设置路由 调用 res.send() 向客户端响应

app.get('/', function (req, res) {

  res.send('Hello World!');

})

//3 调用 app.listen 方法，指定端口号并启动web服务器

app.listen(8888, function () {

console.log('api server running at http://127.0.0.1:8888')

})

上面的代码启动一个服务并监听从 8888 端口进入的所有连接请求。他将对所有 (/) URL 或 路由 响应 “Hello World!” 字符串。对于其他所有路径全部返回 404 Not Found。

5.通过如下命令启动此应用： node app.js（因为每次改动代码都得启动服务器，所以下载npm nodemon插件（install nodemon -g）自动同步更新）

在浏览器中打开 http://localhost:8888/ 并查看输出结果 

二 服务器和mysql数据库连接，并写服务器路由操作

1.npm install mysql

2.新建config目录，并创建db.js用于创建数据库连接

// 导入 mysql 模块

const mysql = require('mysql')

// 创建数据库连接对象

const db = mysql.createConnection({

host: '127.0.0.1',

user: 'root',

password: 'root',

database: 'system',

})

//连接

db.connect()

// 向外共享 db 数据库连接对象

module.exports = db

3.在config文件夹下创建router.js 用于定义服务器路由，如下代码

//导入数据库连接

const conn=require('./db')

// 导入express模块

const express=require('express')

// Express专门提供了路由功能用来封装请求

const router=express.Router()

//查询数据

router.get('/search',(req,res)=>{

  let sqlStr='select * from login'

  conn.query(sqlStr,(err,results)=>{

    if(err){

      res.json({status:500,mes:'获取数据失败'})

    }else{

      res.json({status:200,usermsg:results})

    }

  })

})

// 添加数据

router.get('/insert',(req,res)=>{

  conn.query('insert into login set ?',req.body,(err,results)=>{

    if(err){

      res.json({status:500,mes:'添加数据失败'})    

    }else{

      res.json({status:200,mes:'插入数据成功'})

    }

  })

})

// 删除数据

router.get('/delete',(req,res)=>{

  conn.query('delete from login where userId= ?',req.query.userId,(err,results)=>{

    if(err){

      res.json({status:500,mes:'删除数据失败'})

    }else{

      res.json({status:200,mes:'删除数据成功'})

    }

  })

})

// 导出路由

module.exports=router

4.在入口文件app.js添加router.js模块路由

由于采用nodemon app.js一直监听端口，结果如下，表示成功

三  axios二次封装
为什么要对axios进行二次封装？
答：主要是要用到请求拦截器和响应拦截器，还可以进行api统一管理，不管接口有多少，所有的接口都可以非常清晰，容易维护。

请求拦截器：可以在发请求之前可以处理一些业务
响应拦截器：当服务器数据返回以后，可以处理一些事情
通常来说在项目开发中有三个阶段：
1、开发环境
2、测试环境
3、生产环境
不同环境访问接口的域名等或许是不同的，封装可以直接修改域名，这就是封装请求的原因。

建立request文件夹，写入index.js如下代码

import axios from 'axios'

 const service=axios.create({

  baseURL:'http://localhost:3000',

  timeout:5000,

  headers:{

    "Content-Type":"application/json;charset=utf-8"

  }

 })

//  请求拦截

service.interceptors.request.use(config=>{

  // 发送请求前的处理

  config.headers=config.headers||{}

  if(localStorage.getItem('token')){

    config.headers.token=localStorage.getItem('token')||""

  }

  return config

},err=>{

  //请求错误处理

  console.log(error)

  return Promise.reject(err)

})

//响应拦截

service.interceptors.response.use(res=>{

  const code=res.data.status

  if(code!=200){

    return Promise.reject(res.data)

  }

  return res.data

},err=>{

  console.log(err)

})

export default service

在request建立文件夹api.js，进行请求

// 此文件用于对axios请求进行封装 在该发起请求的时候 直接导入调用就好

import service from '@/request/index'

export function login(loginData){

export function search(){

  return service({

    url:'/search',

    method:'get',

  })

}

访问端口运行结果如下

为了测试插入，删除，我暂时将请求换成了get，如下

 

 当然 我们可以在vue页面直接调用，简单建立一个login.vue，点击登录按钮 发起search请求（使用接口前 要导入噢）

其他的大家自己测试噢