Authorization not working

[forvy]

I'm trying https://jsreport.net/learn/authentication:

  "extensions": {
    "authentication": {
      "cookieSession": {
        "secret": "<your strong secret here>"
      },
      "admin": {
        "username": "admin",
        "password": "password"
      },
      "enabled": true
    },......

I've also read the following:

You need to add header to every request when is this extension enabled.

Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==

Where the hash is based on username and password: base64(username:password)

I tried using both QWxhZGRpbjpvcGVuIHNlc2FtZQ== and using https://www.motobit.com/util/base64-decoder-encoder.asp to encode: admin:password resulting: YWRtaW46cGFzc3dvcmQ= which doesn't seem to work.

(note that key in the following was either of the above I've tried)

I've tried placing on front-end call to jsreport API: return this.http.post(this.hosturl, parameter, { headers: 'Content-Type': 'application/json', 'Authorization': 'Basic ' + this.key }, responseType: 'blob' });

I've also tried placing on back-end to call jsreport API:

 var data = {
        headers: {
            "Authorization" : "Basic key" 
        },
        template: { "shortid": shortid },
        options: {
            preview: preview
        }
    }

Any idea why it always return unauthorized on front-end and prompting login on back-end?
PS: prompt of username: admin and password: password doesn't work for some reason.

Any idea is appreciated. Thanks for the great tools.

[BJR Matos]

hi! i think your Authorization header is not sent in the end, maybe there is some error in the way that you are using your http client, what are you using on the front-end and back-end to send the http requests?

[forvy]

I'm using angular as front-end and standard express as back-end when testing.

header response from console.log(JSON.stringify(req.headers));:

{"host":"localhost:8001","connection":"keep-alive","upgrade-insecure-requests":"1","user-agent":"Mozilla/5.0 (Windows NT
10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/75.0.3770.100 Safari/537.36","accept":"text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3","accept-encoding":"gzip, deflate, br","accept-language":"en-US,en;q=0.9,id;q=0.8","cookie":"session=LuZ4d6VYWvdONSpBe88IrQ.qsZ2o6qt5vehuV7yUmLQscMZC-LhDelJsvHNC7n_8_JeFHQ16DHkXdBvArmvlo0mNDzt-KgRMl3bhdDhFrynZA.1562739152085.315360000000.Hm_NxmSI5LQJ3u9jkAEARlIufg78kqLztQ_c4g2hJ-0; io=CEkb5h58EG5Y60NVAAAA"}

hi! i think your Authorization header is not sent in the end, maybe there is some error in the way that you are using your http client, what are you using on the front-end and back-end to send the http requests?

That's what I thought so, I tried moving the auth from header into the options:

    var options = {
        uri: 'http://localhost:5488/api/report',
        auth: { user: 'admin', password: 'password'},
        method: 'POST',
        json: data
    }

it enabled me to access the report with exact same headers.

Which brought me to the current questions:

From doc:

You need to add header to every request when is this extension enabled.

Authorization: Basic QWxhZGRpbjpvcGVuIHNlc2FtZQ==

Where the hash is based on username and password: base64(username:password)

• Where should I use them?

• How to pass auth info from angular front-end to access report with auth?

I tried passing the following param and it works as intended (note the comment I'm confused as how to implement them):

    this.parameter = {
      "template": { "shortid": this.shortid },
      "options": { "preview": this.show },
      // "authentication": {
      //   "admin": {
      //     "username": "admin",
      //     "password": "password"
      //   }
      // }
    };

then passed into service:

    fetchFilePdf(parameter) {
        // return this.http.post(this.hosturl, parameter, { headers: this.header, responseType: 'blob' });
        return this.http.post(this.hosturl, parameter, { responseType: 'blob' });
    }

which is quite equal to call the following method from backend if only auth wasn't involved:

   var data = {
        template: { "shortid": shortid },
        options: {
            preview: preview
        }
    }
   var options = {
        uri: 'http://localhost:5488/api/report',
        auth: { user: 'admin', password: 'password'},
        method: 'POST',
        json: data
    }
    request(options).pipe(res);

[forvy]

@bjrmatos I've added the repo for this case: front-end angular
and back-end express.

jsreport template is quite a standard one which I don't think relevant in this case. Since failure to auth prevent access either way.

---

Update:
Managed to resolved it. Not sure what's the problem first time around