express - 无法在中间件中获取标头令牌

Question

当我注册用户时，标题会在/signup路由中设置。 标头令牌设置成功

但是当我尝试访问/路由上的标题时。授权失败，因为在 auth.js 中，获取带有const token = req.header('curToken')返回的标头undefined。在网络日志中，我可以看到已设置 ( curToken) 的标头为空或不存在，但被允许。 无法获取 Header 令牌

// index.js
const express = require('express')
require('./db/mongoose')
const userRouter = require('./routers/user')

const app = express()
const port = process.env.PORT || 3000
const cors = require('cors')

app.options('*', cors())
app.use(cors())

app.use(express.json())
app.use(userRouter)

app.listen(port, () => {
    console.log(`Server is running on port ${port}`)
})

// user.js (express route)
const express = require('express')
const User = require('../models/user')
const auth = require('../middleware/auth')
const router = new express.Router()

// signup
router.post('/signup', async (req, res) => {
    const user = new User(req.body)
    
    try {   
        await user.save()
        const token = await user.generateAuthToken()
        res.set('curToken', token) // set header

        console.log('registered')
        res.send({ user, token })
    } catch(err) {
        res.status(400).send(err)
    }

})

// test if token header is accesible
router.get('', auth, async (req, res) => {
    try {
        // const users = await User.find({})
        res.send("logged in.")
    } catch(err) {
        res.send(err)
    }
})


module.exports = router

// auth.js middleware
const jwt = require('jsonwebtoken')
const User = require('../models/user')

const auth = async (req, res, next) => {
    res.header('Access-Control-Expose-Headers', 'curToken')
    try {
        const token = req.header('curToken') // get header
        console.log('auth token:', token) // header returns undefined
        const decoded = jwt.verify(token, 'thisismysecretcode')
        const user = await User.findOne({ _id: decoded._id, 'tokens.token': token })
        
        if (!user) {
            throw new Error()
        }

        req.token = token
        req.user = user
        next()
    } catch(err) {
        res.status(401).send({error: 'Please authenticate.'})
    }
}

module.exports = auth

// Sign Up
<template>
<div>
  SignUp
  <form @submit="sendRegData" @submit.prevent>
      <input type="text" v-model="firstName" name="firstName" placeholder="First name"><br>
      <input type="text" v-model="lastName" name="lastName" placeholder="Last name"><br>
      <input type="text" v-model="email" name="email" placeholder="Email"><br>
      <input type="text" v-model="password" name="password" placeholder="Password"><br>
      <input type="submit" value="Send">
    </form>
</div>
</template> 

<script>
import axios from 'axios';

export default {
  name: "SignUp",
  data() {
    return {
      firstName: null,
      lastName: null,
      email: null,
      password: null
    }
  }, 
  methods: {
    async sendRegData() {
      try {
        await axios.post('http://localhost:3000/signup', {
            firstName: this.firstName,
            lastName: this.lastName,
            email: this.email,
            password: this.password
        }).then((res) => {
            let token = res.data.token
            // console.log('token res received in front:', token)
            // localStorage.setItem("currentToken", token)
            // console.log('curToken:', localStorage.getItem("currentToken"))
        })   
      } catch(err) {
        console.log(err)
      }
    }
  }
};
</script>

// login
<template>
  <div class="home">
    <!-- <h1>{{ User.firstName }}</h1> -->
  </div>
</template>

<script>
import axios from 'axios';

export default {
  name: "Page",
  
  data() {
    return {
      Users: {},
      dataFetched: false
    }
  },
  async mounted() {
    try {
      this.Users = await axios.get('http://localhost:3000/')
      console.log(this.Users)
      // this.User = this.User.data[0] // transform first object from array
      // this.dataFetched = true
    } catch(err) {
        console.error(err)
    }
    
  }
};
</script>

标签： express