Bad Request on Login

stormforce133

Hi there!
I'm having a issue trying to login to my both production and staging servers, I get a "Bad Request" response after I click on Login button..
This is my heroku log:
Aug 19 05:16:22 estetica-backend heroku/router: at=info method=POST path="/reportes/login?returnUrl=%2Freportes" host=estetica-backend.herokuapp.com request_id=e137fd30-40a5-45cd-b1bc-a438907476da fwd="181.10.26.2" dyno=web.1 connect=4ms service=4ms status=400 bytes=573 protocol=https

Aug 19 05:16:22 estetica-backend app/web.1: SyntaxError: Unexpected token u Aug 19 05:16:22 estetica-backend app/web.1: at parse (/app/node_modules/body-parser/lib/types/json.js:83:15) Aug 19 05:16:22 estetica-backend app/web.1: at /app/node_modules/body-parser/lib/read.js:116:18 Aug 19 05:16:22 estetica-backend app/web.1: at invokeCallback (/app/node_modules/raw-body/index.js:262:16) Aug 19 05:16:22 estetica-backend app/web.1: at done (/app/node_modules/raw-body/index.js:251:7) Aug 19 05:16:22 estetica-backend app/web.1: at IncomingMessage.onEnd (/app/node_modules/raw-body/index.js:307:7) Aug 19 05:16:22 estetica-backend app/web.1: at emitNone (events.js:86:13) Aug 19 05:16:22 estetica-backend app/web.1: at IncomingMessage.emit (events.js:185:7) Aug 19 05:16:22 estetica-backend app/web.1: at endReadableNT (_stream_readable.js:974:12) Aug 19 05:16:22 estetica-backend app/web.1: at _combinedTickCallback (internal/process/next_tick.js:80:11) Aug 19 05:16:22 estetica-backend app/web.1: at process._tickCallback (internal/process/next_tick.js:104:9)

I'm running jsreport from my backend like this:

const jsreport = require('jsreport')({
    express: { app: reportingApp, server: server },
    appPath: "/reportes",
    connectionString: {
        name: "mongodb",
        uri: process.env.MONGODB_URI
    },
    blobStorage: "gridFS",
    authentication: {
        cookieSession: {
            "secret": "asdasdasdasdasd"
        },
        admin: {
            "username": "admin",
            "password": process.env.JSREPORT_PASS
        }
    }
});
jsreport.use(require('jsreport-authentication')({}));

I don't know when this started to happen but I've ever changed any jsreport settings in months. And I don't have any conflicting routes that overlaps the jsreport /reportes route

Does someone have the same issue?

Thanks in advance!

jan_blaha

Hm, I haven't notice such error yet. It seems that the error comes from body parser json middleware where the login request is form url encoded. Maybe you have some middlewares running in the reportingApp before jsreport. Can you try to remove them? The best would be if you simplify your problem and create a repository where we can check it out.

stormforce133

I'm using body-parser for JSON and urlencoded... I also use express-fileupload which uses multipart... maybe that is the issue

app.use(bodyParser.json({'type': '*/*', limit: '20mb'}));
app.use(bodyParser.urlencoded({
    extended: true
}));
app.use(fileUpload());

I can't remove file-upload as my backend stores some images... is there some workaround?
Thanks in advance!

jan_blaha

If you initialize the jsreport sub express application like on the following example, it doesn't share the middleware of the root application. So there should be no issue.

var express = require('express');
var app = express();

app.get('/', function (req, res) {
  res.send('Hello from the main application');
});

var reportingApp = express();
app.use('/reporting', reportingApp);

var server = app.listen(3000);

var jsreport = require('jsreport')({
  express: { app :reportingApp, server: server },
  appPath: "/reporting"
});

jsreport.init().catch(function (e) {
  console.error(e);
});

source https://jsreport.net/learn/adapting-jsreport#attach-to-existing-express-app

stormforce133

I have the same initialization but the issue persists... here is my backend code:

let express = require('express');
let app = express();
let bodyParser = require('body-parser');
const fileUpload = require('express-fileupload');
const pgp = require("pg-promise")();

const db = pgp(process.env.DATABASE_URL);

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, x-access-token");
    res.header("Access-Control-Allow-Methods", "POST, PUT, DELETE, GET, OPTIONS");
    next();
});

app.use(bodyParser.json({'type': '*/*', limit: '20mb'}));
app.use(bodyParser.urlencoded({
    extended: true
}));
app.use(fileUpload());
app.set('port', (process.env.PORT || 5000));

app.get('/api', function(req, res) {
    res.json({
        mensaje: "Backend del sistema!!"
    })
});

const server = app.listen(app.get('port'), function() {
    console.log('Backend escuchando en puerto ', app.get('port'));
});

const reportingApp = express();
app.use('/reportes', reportingApp);

const jsreport = require('jsreport')({
    express: { app: reportingApp, server: server },
    appPath: "/reportes",
    connectionString: {
        name: "mongodb",
        uri: process.env.MONGODB_URI
    },
    blobStorage: "gridFS",
    authentication: {
        cookieSession: {
            "secret": "dasd321as56d1sd5s61vdv32"
        },
        admin: {
            "username": "admin",
            "password": process.env.JSREPORT_PASS
        }
    }
});
jsreport.use(require('jsreport-authentication')({}));

jsreport.init().catch(function(e) {
    console.error(e);
});

Am I doing something wrong?

Thanks in advance!

bjrmatos

maybe it is a good idea to initialize the jsreport first and use your middlewares after, with that jsreport's request will not go through your other middlewares.

something like this:

let express = require('express');
let app = express();
const reportingApp = express();
let bodyParser = require('body-parser');
const fileUpload = require('express-fileupload');
const pgp = require("pg-promise")();

const db = pgp(process.env.DATABASE_URL);

app.set('port', (process.env.PORT || 5000));

app.use('/reportes', reportingApp);

app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept, x-access-token");
    res.header("Access-Control-Allow-Methods", "POST, PUT, DELETE, GET, OPTIONS");
    next();
});

app.use(bodyParser.json({'type': '*/*', limit: '20mb'}));
app.use(bodyParser.urlencoded({
    extended: true
}));
app.use(fileUpload());

app.get('/api', function(req, res) {
    res.json({
        mensaje: "Backend del sistema!!"
    })
});

const jsreport = require('jsreport')({
    express: { app: reportingApp, server: server },
    appPath: "/reportes",
    connectionString: {
        name: "mongodb",
        uri: process.env.MONGODB_URI
    },
    blobStorage: "gridFS",
    authentication: {
        cookieSession: {
            "secret": "dasd321as56d1sd5s61vdv32"
        },
        admin: {
            "username": "admin",
            "password": process.env.JSREPORT_PASS
        }
    }
});
jsreport.use(require('jsreport-authentication')({}));

jsreport.init().then(function () {
  const server = app.listen(app.get('port'), function() {
    console.log('Backend escuchando en puerto ', app.get('port'));
  })
}).catch(function(e) {
    console.error(e);
});

jsreport.use(require('jsreport-authentication')({}));

any reason to use the authentication plugin manually? this plugin is installed by default along with jsreport, so no need to initialize it by yourself if you are not using any option

stormforce133

I can't believe it was so easy to fix... thank you so much!