Next.js和MONGODB JWT集成

寻找一个后端开发，可以简单地帮助我实现MONGODB与nextJS和目前的模式，我现在。我买了https://www.devias.io管理 Jmeter 板，只是想实现授权和数据库阅读与它。
只需要基本的auth设置。它已经在文件中设置，只是想知道如何根据devias指南正确配置它
以前有人这样做过吗？我找不到任何相关文档。目前它是使用模拟数据设置的
SRC/API/AUTH/index.js

import { createResourceId } from '../../utils/create-resource-id';
import { decode, JWT_EXPIRES_IN, JWT_SECRET, sign } from '../../utils/jwt';
import { wait } from '../../utils/wait';
import { users } from './data';

class AuthApi {
  async signIn(request) {
    const { email, password } = request;

    await wait(500);

    return new Promise((resolve, reject) => {
      try {
        // Find the user
        const user = users.find((user) => user.email === email);

        if (!user || (user.password !== password)) {
          reject(new Error('Please check your email and password'));
          return;
        }

        // Create the access token
        const accessToken = sign({ userId: user.id }, JWT_SECRET, { expiresIn: JWT_EXPIRES_IN });

        resolve({ accessToken });
      } catch (err) {
        console.error('[Auth Api]: ', err);
        reject(new Error('Internal server error'));
      }
    });
  }

  async signUp(request) {
    const { email, name, password } = request;

    await wait(1000);

    return new Promise((resolve, reject) => {
      try {
        // Check if a user already exists
        let user = users.find((user) => user.email === email);

        if (user) {
          reject(new Error('User already exists'));
          return;
        }

        user = {
          id: createResourceId(),
          avatar: undefined,
          email,
          name,
          password,
          plan: 'Standard'
        };

        users.push(user);

        const accessToken = sign({ userId: user.id }, JWT_SECRET, { expiresIn: JWT_EXPIRES_IN });

        resolve({ accessToken });
      } catch (err) {
        console.error('[Auth Api]: ', err);
        reject(new Error('Internal server error'));
      }
    });
  }

  me(request) {
    const { accessToken } = request;

    return new Promise((resolve, reject) => {
      try {
        // Decode access token
        const { userId } = decode(accessToken);

        // Find the user
        const user = users.find((user) => user.id === userId);

        if (!user) {
          reject(new Error('Invalid authorization token'));
          return;
        }

        resolve({
          id: user.id,
          avatar: user.avatar,
          email: user.email,
          name: user.name,
          plan: user.plan
        });
      } catch (err) {
        console.error('[Auth Api]: ', err);
        reject(new Error('Internal server error'));
      }
    });
  }
}

export const authApi = new AuthApi();

然后单击/SRC/API/授权/数据. js

export const users = [
  {
    id: '5e86809283e28b96d2d38537',
    avatar: '/assets/avatars/avatar-anika-visser.png',
    email: 'demo@devias.io',
    name: 'Anika Visser',
    password: 'Password123!',
    plan: 'Premium'
  }
];

这是关于它的文档

JSON Web令牌（JWT）

大多数auth提供商都在幕后使用这个策略来提供访问令牌，目前，这个应用程序并没有覆盖后端服务，而且这个服务是使用http客户端拦截器来模拟（伪造）的，实现是基本的，但足以给予你一个起点。

如何实施

由于令牌是在后端服务器上创建的，所以它们是用加密、编码和解码实用程序方法构建的，因为它们不打算在客户端上使用。这些实用程序可以在src/utils/jwt中找到。这些实用程序仅用于开发目的，您必须删除（或避免使用）它们。

如何使用JWT提供程序

应用程序随JWT提供程序一起交付，作为默认验证策略。如果您更改或删除了它，并且希望恢复它，只需执行以下步骤：

步骤1：导入提供程序

打开src/pages/_app.js文件，导入提供程序，并使用它 Package App组件。

// src/pages/_app.js
import { AuthConsumer, AuthProvider } from '../contexts/auth/jwt-context';

const App = (props) => {
  const { Component, pageProps } = props;
    
  return (
    <AuthProvider>
      <Component {...pageProps} />
    </AuthProvider>
  );
};

步骤2：设置钩子上下文

打开src/hooks/use-auth.js文件并将当前上下文替换为以下行：

import { AuthContext } from '../contexts/auth/jwt-context';

如何使用身份验证

检索用户配置文件

在下面的例子中，你可以看到如何在任何组件中使用它，而不仅仅是App。如果你想在任何其他组件中使用它，你必须导入useAuth钩子并根据需要使用它。

// src/pages/index.js
import { useAuth } from '../hooks/use-auth';

const Page = () => {
  const { user } = useAuth();

  return (
    <div>
      Email: {user.email}
    </div>
  );
};

身份验证方法/操作

为简单起见和空间限制，下面的代码仅用于举例说明，实际代码可以在组件中找到。

// src/pages/index.js
import { useAuth } from '../hooks/use-auth';

const Page = () => {
  const { login } = useAuth();
  
  const handleLogin = () => {
    // Email/username and password
    login('demo@devias.io', 'Password123!');
  };
s
  return (
    <div>
      <button onClick={handleLogin}>
        Login
      </button>
    </div>
  );
};

已实现的流程

目前，该应用程序仅涵盖主要流程：

注册
登录
注销

const mongoose = require('mongoose');
const jwt = require("jsonwebtoken");

// Connect to MongoDB
mongoose.connect('mongodb://localhost/yourdbname', {
    useNewUrlParser: true,
    useUnifiedTopology: true
});

const userSchema = new mongoose.Schema({
        id: {
            type: String,
            required: true,
            unique: true
        },
        email: {
            type: String,
            required: true
        },
        name: {
            type: String,
            required: true
        },
        password: {
            type: String,
            required: true
        },
        plan: {
            type: String,
        default:
            'Standard'
        },
        avatar: {
            type: String,
        default:
            null
        },
    });

const User = mongoose.model('User', userSchema);

const JWT_SECRET = process.env.JWT_SECRET;
const JWT_EXPIRES_IN = '7d';

class AuthApi {
    async signIn(request) {
        const {
            email,
            password
        } = request;

        const user = await User.findOne({
                email
            });
        if (!user || (user.password !== password)) {
            throw new Error('Please check your email and password');
        }

        const accessToken = jwt.sign({
                userId: user.id
            }, JWT_SECRET, {
                expiresIn: JWT_EXPIRES_IN
            });

        return {
            accessToken
        };
    }

    async signUp(request) {
        const {
            email,
            name,
            password
        } = request;

        const existingUser = await User.findOne({
                email
            });
        if (existingUser) {
            throw new Error('User already exists');
        }

        const newUser = new User({
                id: mongoose.Types.ObjectId(),
                email,
                name,
                password,
                plan: 'Standard',
                avatar: null,
            });

        await newUser.save();

        const accessToken = jwt.sign({
                userId: newUser.id
            }, JWT_SECRET, {
                expiresIn: JWT_EXPIRES_IN
            });

        return {
            accessToken
        };
    }

    async me(request) {
        const {
            accessToken
        } = request;

        const decoded = jwt.verify(accessToken, JWT_SECRET);
        const {
            userId
        } = decoded;

        const user = await User.findById(userId);
        if (!user) {
            throw new Error('Invalid authorization token');
        }

        return {
            id: user.id,
            avatar: user.avatar,
            email: user.email,
            name: user.name,
            plan: user.plan
        };
    }
}

export const authApi = new AuthApi();

Next.js和MONGODB JWT集成

JSON Web令牌（JWT）

如何实施

如何使用JWT提供程序

如何使用身份验证

检索用户配置文件

身份验证方法/操作

已实现的流程

1条答案

相关问题

热门标签

最新问答