[MERN②]User API Routes & JWT Authentication #MongoDB

1. User Modelを作成

Modelフォルダ作成
Userモデルファイル作成

models/User.js

const mongoose = require('mongoose');

const UserSchema = new mongoose.Schema({
  name: {
    type: String,
    required: true,
  },
  email: {
    type: String,
    required: true,
    unique: true,
  },
  password: {
    type: String,
    required: true,
  },
  avatar: {
    type: String,
  },
  date: {
    type: Date,
    default: Date.now,
  },
});

module.exports = User = mongoose.model('user', UserSchema);

2. リクエスト & Bodyバリデーション

server.js

...
connectDB();

+ // Init Middleware
+ app.use(express.json({ extended: false }));

app.get('/', (req, res) => res.send('API Running'));
...

express-validator

routes/api/users.js

const express = require('express');
const router = express.Router();
const { body, validationResult } = require('express-validator');

+ // @route  POST api/users
// @desc   Register user
// @access Public
router.post(
  '/',
+   [
+     body('name', 'Name is required').not().isEmpty(),
+     body('email', 'Please include a valid email').isEmail(),
+     body(
+       'password',
+       'Please enter a password with 6 or more characters'
+     ).isLength({ min: 6 }),
+   ],
  (req, res) => {
+     const errors = validationResult(req);
+     if (!errors.isEmpty()) {
+       return res.status(400).json({ errors: errors.array() });
+     }

    res.send('User route');
  }
);

module.exports = router;

POSTMANによるチェック

（nameのみ入力の場合）-> "400 Bad Request"（失敗の返答）

（name、 email、６桁passすべて入力した場合）-> "200 OK"（成功の返答）

User Registration

-> gravatarを追加
-> bcryptを追加

routes/api/user.js

const express = require('express');
const router = express.Router();
+ const gravatar = require('gravatar');
+ const bcrypt = require('bcryptjs');
const { body, validationResult } = require('express-validator');

const User = require('../../models/User');

// @route  POST api/users
// @desc   Register user
// @access Public
router.post(
  '/',
  [
    body('name', 'Name is required').not().isEmpty(),
    body('email', 'Please include a valid email').isEmail(),
    body(
      'password',
      'Please enter a password with 6 or more characters'
    ).isLength({ min: 6 }),
  ],
  async (req, res) => {
    const errors = validationResult(req);
    if (!errors.isEmpty()) {
      return res.status(400).json({ errors: errors.array() });
    }

+     const { name, email, password } = req.body;
+     try {
+       let user = await User.findOne({ email });

+      if (user) {
+         // See if user exists
+         return res.status(400).json({ erros: [{ msg: 'User already exists' }] });
+       }
+       // Get users gravatar
+       const avatar = gravatar.url(email, {
+         s: '200',
+         r: 'pg',
+         d: 'm',
+       });
+       user = new User({ name, email, avatar, password });
+       // Encrypt password
+       const salt = await bcrypt.genSalt(10);
+       user.password = await bcrypt.hash(password, salt);
+       await user.save();
+       // Return jsonwebtoken
+       res.send('User registered');
+     } catch (err) {
+       console.error(err.message);
+       res.status(500).send('Server error');
+     }
+   }
);

module.exports = router;

POSTMANでPost

MongoDB Atlasに格納された！

登録した後、再度Postをすると

3. JWT (jsonWebToken)を実行

JWTの説明：https://github.com/auth0/node-jsonwebtoken
-> jwtを設置
-> configを設置

routes/api/users.js

...
const bcrypt = require('bcryptjs');
+ const jwt = require('jsonwebtoken');
+ const config = require('config');
const { body, validationResult } = require('express-validator');

...
      // Encrypt password
      const salt = await bcrypt.genSalt(10);
      user.password = await bcrypt.hash(password, salt);
      await user.save();

      // Return jsonwebtoken
+       const payload = {
+         user: {
+           id: user.id,
+         },
+       };

+       jwt.sign(
+         payload,
+         config.get('jwtSecret'),
+         { expiresIn: 360000 },
+         (err, token) => {
+           if (err) throw err;
+           res.json({ token });
+         }
      );
    } catch (err) {
      console.error(err.message);
      res.status(500).send('Server error');
...

mongoDB -> _id
mongoose -> id

config/default.json

{
  "mongoURI": "xxx",
+  "jwtSecret": "xxxxxtoken"
}

3. Authミドルウェアをカスタマイズ & JWT証明

middleware/auth.jsファイル作成

middleware/auth.js

const jwt = require('jsonwebtoken');
const config = require('config');

module.exports = function (req, res, next) {
  //Get token from header
  const token = req.header('x-auth-token');

  // Check if not token
  if (!token) {
    return res.status(401).json({ msg: 'No token, authorization denied' });
  }

  //Verify token
  try {
    const decoded = jwt.verify(token, config.get('jwtSecret'));

    req.user = decoded.user;
    next();
  } catch (err) {
    res.status(401).json({ msg: 'Token is not valid' });
  }
};

routes/api/auth.js

const express = require('express');
const router = express.Router();
+ const auth = require('../../middleware/auth');

+ const User = require('../../models/User');

// @route  GET api/auth
// @desc   Test route
// @access Public
+ router.get('/', auth, async (req, res) => {
+   try {
+     const user = await User.findById(req.user.id).select('-password'); //passwordは除くUserデータを取得
+     res.json(user);
+   } catch (err) {
+     console.error(err.message);
+     res.status(500).send('Server Error');
+   }
});

module.exports = router;

POSTMAN
Headersに
-> KEY: x-auth-token
-> VALUE: POST /api/usersした時にJWTでレスのあったTokenをペースト

4. ユーザー認証 & ログイン