无法获取res.render进行渲染

如何解决无法获取res.render进行渲染

希望一切都很好。我正在尝试创建一个对用户进行身份验证的登录系统，然后将其重定向到其仪表板。我正在使用Expressjs和HBS创建此文件，并将数据存储在MongoDB数据库中。

到目前为止我已经完成的事情：
当用户提交表单时，我使用POST从‘/admin/login’提取请求，该请求从客户端获取用户输入（电子邮件和密码）。在服务器端，该数据用于在数据库中查找用户并生成令牌。然后，该令牌在响应中发送回客户端，然后在获取请求的标头中使用回送给服务器的‘/admin/me’，使用GET使用令牌来验证用户是否已登录。一切似乎都按计划进行。

我被困的地方：
用户通过身份验证后，我想使用HBS渲染仪表板（不同的html页面）。我可以使用‘/admin/me’从res.send()发送回客户端响应，但是我想使用res.render()来渲染hbs模板。即使我不使用.then()来处理‘/admin/me’返回的诺言，也无法得到res.render()来渲染要渲染的.hbs文件。我在做什么错了？

这是我第一次尝试这样做，我以为自己对自己的所作所为有所了解，但是我觉得自己的逻辑上有漏洞，而且我缺少一些东西。也许我只是不明白-__-。不过没有错误代码，这很酷。

谢谢您的时间，这对我来说意义重大。我期待着您的答复。有一个好吧。

我的文件结构：

/config  
=dev.env  
/dist  
=/css  
==style.css  
=/js  
==bundle.js  
=/views  
==/pages  
===admin.hbs  
===index.hbs  
/node_modules  
/src  
=/db  
==mongoose.js  
=/middleware  
==admin_auth.js  
=/models  
==admin.js  
=/routers  
==admin.js  
=app.js  
=dom_elem.js  
=hbs_config.js  
=index.js  
=server.js  
=/scss  
=/views  
==/pages  
===admin.js  
===index.hbs  
package.json  
webpack.config.js  

html格式：
/dist/views/pages/index.hbs

<form class="form--login" id="form-login-admin"
    <div class="login-form-group"
        <label for="email-admin"><h4>e-mail:</h4></label
        <input type="email" name="email-admin" id="email-admin"
    </div
    <div class="login-form-group"
        <label for="password-admin"><h4>password:</h4></label
        <input type="password" name="password-admin" id="password-admin"
    </div
    <button class="btn-login" id="btn-login-admin" type="submit">Login</button
</form>

hbs配置：
/src/js/hbs_config.js

const path = require( 'path' ); // include path module 

// define path for views
const views_path = path.join( __dirname,'../../dist/views/pages' ); 
// define path for partials
const partials_path = path.join( __dirname,'../../dist/views/partials' );

module.exports = {
    views_path,partials_path
}

其中设置了快速应用程序的地方：
/src/js/app.js

const path = require( 'path' ); // include path module 
const express = require( 'express' ); // include express js module 
const bodyParser = require( 'body-parser' ); // include json body parser
require( './db/mongoose' ); // import mongoose db
const { views_path,partials_path } =require( './hbs_config' )
const hbs = require( 'hbs' ); // import hbs module
const adminRouter = require( './routers/admin' );


// define public path for server
const public_path = path.join( __dirname,'../../dist' );

// create application/json parser
const jsonParser = bodyParser.json();


// create express application
const app = express();

// set the view engine
app.set( 'view engine','hbs' );
// set directory for views
app.set( 'views',views_path );
// set directory for partials
hbs.registerPartials( partials_path );


// parse data objects from request payloads into json objects
app.use( express.json() );

app.use(bodyParser.json());

// use public path
app.use( express.static( public_path ) );

app.use( adminRouter );

// export application
module.exports = app;

服务器启动的位置：
/src/js/server.js

const app = require( './app' ); // imnport application 

app.get( '/',( req,res ) => {
    res.render('index.hbs'); // <-this works just fine 
} );

// set PORT
const port = process.env.PORT;

// start server
app.listen( port,() => {
    console.log( `server is running on port: ${port}` );
} );

验证用户身份的功能：
/scr/js/middleware/admin_auth.js

const jwt = require( 'jsonwebtoken' ); // import json web token module
const Admin = require( '../models/admin' ); // import Model for 'admin'

// function to authenticate the admin
const admin_auth = async ( req,res,next ) => {
    try {
        // grab token from http request header
        const token = req.header( 'Authorization' ).replace( 'Bearer ','' );
        // decode the hashed token 
        const decoded = jwt.verify( token,process.env.JWT_SECRET );
        // get admin by id and token 
        const admin = await Admin.findOne( { _id: decoded._id,'tokens.token': token } );

        // if admin is undefined...
        if ( !admin ) {
            // ...throw error
            throw new Error();
        }

        // store token in request
        req.token = token;
        // store admin in request
        req.admin = admin;
        // end async/await 
        next();
    } catch ( err ) { // catch errors
        console.log(err);
        // response with error status and error message
        res.status( 401 ).send( { error: 'Authentication required.' } );
    }   
};

// export admin authentication functions
module.exports = admin_auth;

路线：
/src/js/routers/admin.js

const express = require( 'express' ); // import express js module
const bodyParser = require( 'body-parser' );
const router = new express.Router(); // instantiate express js router 
const Admin = require( '../models/admin' ); // import model for admin 
const adminAuth = require( '../middleware/admin_auth' ); // import authentication function for admin

// post request to login admin
router.post( '/admin/login',async ( req,res ) => {
    try {
        const admin = await Admin.findByCredentials( req.body.email,req.body.password );
        const token = await admin.generateAuthToken();
        res.status(200).send({"token": token});
    } catch ( e ) {
        res.status( 400 ).send( {"message": e.message} );
    }
} );

// get request to render admin page
router.get( '/admin/me',adminAuth,res ) => {
    // res.render( 'admin.hbs' ); <-doesn’t render the template :(
    // return res.render( ‘admin.hbs’ ) // I tried returning res.render() 
    res.send({"message": "hello from /admin/me"} ); // <-sends the response back
} );

客户端的javascript：
/src/js/index.js

const elements = require( './dom_elem' );

// if the form is in the DOM
if( elements.admin_login_form ) {
    // when the user clicks ‘login’
    elements.admin_login_form.addEventListener( 'submit',( e ) => {
        e.preventDefault();
        console.log( 'user clicked submit' );


        // input from DOM
        const email = elements.admin_login_email;
        const password = elements.admin_login_password;
    
        // fetch request using POST sending the email and password
        fetch('/admin/login',{
            method: 'POST',headers: {
                'Content-Type': 'application/json','Accept': 'applicaiton/json'
            },body: JSON.stringify({email: email.value,password: password.value})
        })
        .then(response => {
            return response.json();
        })
        .then( data => { // responds back with a token
           console.log('token from \'/admin/login\’: ',data);

          // fetch /admin/me GET request with token in header
            fetch( '/admin/me',{
                headers: {
                    'Authorization' : `Bearer ${data.token}`,‘Accept’: ’text/html’ // i’ve tried leaving the ‘Accept’ header blank and with ‘application/json’
                }
            } )
            .then( response => { // even when I don’t handle the promise res.render() doesn’t work
                return response.json(); // I’ve tried ‘return response;’ and not handling the data 
            } )
            .then( data => {
                console.log( 'result: ',data.message ); // <- I get the response from the ‘/admin/me’ endpoint 
            } )   
            .catch( e => {
                console.log( 'error from \'/admin/me\': ',e.message ) 
            } )      
        } )
        .catch( e => {
            console.log('error from \'/admin/login\': ',e.message
);
        } )
        closeAdminLogin();
        email.value = '';
        password.value = '';
    } );

结果的屏幕截图： screenshot_of_results