如何以良好的格式显示 express-validator 生成的错误消息

Question

Express-Validator error handing is a bit raw and produces not too aesthetical results

    return res.status(422).json({ error: error.array() });

The above will simple do the equal of document.write() and leave nothing but the following message on the screen. "{"error":["invalid email address","your password should have min and max length between 8-15","your password should have at least one number","your password should have at least one sepcial character"]} "

The console returns the error object like this:

 {
 error: [
'your password should have min and max length between 8-15',
'your password should have at least one number',
'your password should have at least one sepcial character'
]
}

I have tried

// const failMsg = JSON.parse("{ error: error.array() }");
if (hasError) {
//req.session.error = `{failMsg}`;

Does not work. I would rather embed the error message within

or a

element via express templating. like

 <% if(err) { %> <p id="errorAlert" style="color: red;"><%= err %></p> <%} %>

Or simply, how can I that error object as plain text?

Answer 1

After spending some time in the console......I found a solution, maybe some other poor soul will try to find this in the docs to no avail, so might be useful to share the answer, because what is out there on the web or in the docs cannot possibly be deployed to production.

const error = validationResult(req).formatWith(({ msg }) => msg);
// check for errors
const hasError = !error.isEmpty();

if (hasError) {
/// if error object is not empty
var failMsg = { error: error.array() }; // this is what is returned by validator
var arrOfErrors = failMsg.error;  // the errors will be in this array
var errors2display = [];           // init array for errors to be displayed to user
for(let i = 0; i < arrOfErrors.length ; i++){
errors2display.push(arrOfErrors[i] + "💩") }    // loop through and push whatever is there

 var oneStep = errors2display;
 req.session.error = `${oneStep}`;  // this is the express-session middleware but it does not matter.
 return res.redirect("/register");   

 }

And in the view

        <% if(err) { %>
        <p id="errorAlert" style="color: red;"><%= err %></p>
        <%} %>

This with some nice CSS modal + a keyframe animation and it look pretty decent, certainly better than the original document.write kinda behavior