I try to authenticate my users through my socketio v4 nativescript - nodejs
Setup
"#angular/core": "~8.2.0",
"#triniwiz/nativescript-socketio": "^5.0.0",
"nativescript-angular": "~8.21.0",
Client side
I wrote this app.module.ts
SocketIOModule.forRoot('http://10.0.2.2:3000', {
debug: true,
log: true,
extraHeaders: {
'authorization': `Bearer ${getString('ACCESS_TOKEN')}`
},
}),
And simply this.socketIO.connect();
Problem
The problem is that my server does not receive my extraheaders at all. I can't authenticate properly.
My research
Using Chrome Dev Tool to debug, my websocket requests are not logged at all.
Chrome Dev Tools
By adding console.log('url', args); at line 73 of index.android.js (nativescript-socketio lib).
Above this.socket = io.socket.client.IO.socket(args[0], opts.build());
The headers are correctly present
By inspecting what the server receives.
{
accept: '*/*',
host: '10.0.2.2:3000',
connection: 'Keep-Alive',
'accept-encoding': 'gzip',
'user-agent': 'okhttp/3.12.12'
}
With another tools : SocketIO Online Client Tool
The server receives the headers correctly
{
host: 'localhost:3000',
'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:88.0) Gecko/20100101 Firefox/88.0',
accept: '*/*',
'accept-language': 'fr,fr-FR;q=0.8,en-US;q=0.5,en;q=0.3',
'accept-encoding': 'gzip, deflate',
authorization: 'Bearer eyJhbGciOiJIU............V4MKGQ',
origin: 'https://amritb.github.io',
connection: 'keep-alive',
'sec-gpc': '1'
}
Finally, I thought it was a CORS problem (which I think is unlikely because there are no errors). My server socket uses the following options. As mentioned in the documentation
{
cors: {
origin: '*',
allowedHeaders: ['authorization']
}
}
}
I have found similar issues, but their solution doesn't change anything.
Has anyone ever faced this problem? Do you have any other ideas? I am out of ideas.
Thanks for helping
Did you try, if it only affects the Authorization header?
And can you try to use withCredentials = true
Related
I am deploying a MERN app on AWS EC2. Frontend is rendered perfectly on aws. While calling API(axios.post) empty body is received in backend when called through react frontend. But, when called through postman, the body is received correctly.
I am sharing the details of the request body as received on backend(I printed this for debugging purposes):
POSTMAN method:
Method: POST
Path: /api/auth
Body: { email_id: 'comiiii#gmail.com',
password: 'comiiii#123',
user_type: 'type_com' }
Headers: { host: '64.1.75.248',
'x-real-ip': '113.103.59.237',
'x-forwarded-for': '113.103.59.237',
'x-forwarded-host': 'ec2-64-1-75-248.ap-south-1.compute.amazonaws.com',
'content-type': 'application/json;charset=UTF-8',
connection: 'close',
'content-length': '94',
'user-agent': 'PostmanRuntime/7.26.8',
accept: '*/*',
'postman-token': 'a6ef6f75-716b-4843-a773-8b46d1f28427',
'accept-encoding': 'gzip, deflate, br' }
REACT FRONTEND:
Method: POST
Path: /api/auth
Body: {}
Headers: { host: '64.1.75.248',
'x-real-ip': '213.235.108.12',
'x-forwarded-for': '213.235.108.12',
'x-forwarded-host': 'ec2-64-1-75-248.ap-south-1.compute.amazonaws.com',
'content-type': 'application/json;charset=UTF-8',
connection: 'close',
accept: '*/*',
'access-control-request-method': 'POST',
'access-control-request-headers': 'access-control-allow-origin,content-type',
origin: 'http://ec2-64-1-75-248.ap-south-1.compute.amazonaws.com',
'user-agent':
'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.146 Safari/537.36',
'sec-fetch-mode': 'cors',
referer: 'http://ec2-64-1-75-248.ap-south-1.compute.amazonaws.com/',
'accept-encoding': 'gzip, deflate',
'accept-language': 'en-GB,en-US;q=0.9,en;q=0.8' }
I saw the difference between the two and realised that the headers which are different are part of forbidden ones. (Refer : https://developer.mozilla.org/en-US/docs/Glossary/Forbidden_header_name)
How to solve this?
I'm facing an issue trying to connect an flutter application with my nodejs backend with express-session. In postman the response header includes a "Set-Cookie"-Header, but the flutter headers with http.post(...) do not: headers: {content-length: 113, content-type: application/json; charset=utf-8}.
I need a cookie to keep the authenticated session with passport. Any ideas how to fix it?
Flutter headers:
host: '127.0.0.1:3000', connection: 'keep-alive', 'content-length': '57', 'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/86.0.4240.75 Safari/537.36', 'content-type': 'application/json; charset=utf-8', accept: '*/*', origin: 'http://localhost:51879', 'sec-fetch-site': 'cross-site', 'sec-fetch-mode': 'cors', 'sec-fetch-dest': 'empty', referer: 'http://localhost:51879/', 'accept-encoding': 'gzip, deflate, br', 'accept-language': 'de-DE,de;q=0.9,en-US;q=0.8,en;q=0.7'
Postman Headers: 'content-type': 'application/json', accept: '*/*', 'postman-token': '7c79280d-****-****-a985-c01395e50e08', host: 'localhost:3000', 'accept-encoding': 'gzip, deflate, br', connection: 'keep-alive', 'content-length': '66'
Recommend you to use dio library for HTTP calls.
import 'package:dio/dio.dart';
class ApiProvider {
Dio _dio;
String aToken = '';
final BaseOptions options = new BaseOptions(
// base url to backend server
baseUrl: 'http://a.b.c.d:port/',
connectTimeout: 15000,
receiveTimeout: 13000,
);
static final ApiProvider _instance = ApiProvider._internal();
factory ApiProvider() => _instance;
ApiProvider._internal() {
_dio = Dio(options);
_dio.interceptors.add(InterceptorsWrapper(
onRequest:(Options options) async {
// to prevent other request enter this interceptor,
// use a new Dio(to avoid dead lock) instance to request token.
_dio.interceptors.requestLock.lock();
// set the cookie to headers
options.headers["cookie"] = aToken;
_dio.interceptors.requestLock.unlock();
return options; // continue
}
));
}
Future login() async {
final request = {
"userName": "",
"password": "",
"token": ""
};
final response = await _dio.post('/login', data: request, options: Options(
followRedirects: false,
validateStatus: (status) { return status < 500; }
));
//get cooking from response
final cookies = response.headers.map['set-cookie'];
if (cookies.isNotEmpty && cookies.length == 2) {
// it depends on how your server sending cookie
aToken = cookies[1].split(';')[0];
}
}
/// if we call this function without cookie then it will throw 500 err.
Future getSomething() async {
final response = await _dio.post('/something');
}
}
I need to access axios header authorization token in server side(Node), showing undefined. Please help..
Client side(React) request:
var config = {
headers: {
'cache-control':'no-cache',
'content-type': 'application/x-www-form-urlencoded',
'authorization' :'bearer '+Auth.getToken()
}
};
axios.get(ApiConfig.API_BASE+'api/admin/profile/', config).then(function(response) {
this.setState({status:'success', profile: response.data.data});
}).catch(function(response) {
console.log(response);
});
Server side(Node):
module.exports = (req, res, next) => {
console.log(req.headers.authorization);
if(!req.headers.authorization) {
return res.status(401).end();
}
};
Log showing undefined. I also console the entire header, but their output is:
{ host: 'localhost:8027',
'user-agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64; rv:55.0) Gecko/20100101 Firefox/55.0',
accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8',
'accept-language': 'en-US,en;q=0.5',
'accept-encoding': 'gzip, deflate',
'access-control-request-method': 'GET',
'access-control-request-headers': 'authorization,cache-control',
origin: 'http://localhost:3001',
connection: 'keep-alive' }
How do I retrieve the authorization token value?
Thank you.
I'm assuming you are using express. If so, instead of getting the header value as req.headers.authorization, try req.get('authorization').
http://expressjs.com/en/api.html#req.get
If you are making a cross-origin HTTP request, please make sure CORS has been enabled in your server. If you are using express cors middleware can be used.
I guess your problem here is that since CORS has not been enabled, your server will receive a OPTIONS request first, so the entire header you console is from the OPTIONS request not the GET request as you desired. You can use console.log(req.method) to verify. BTW req.headers.authorization is ok to receive the header.
Using node http-proxy module, I have no issues when proxying to a host with GET. But when I use POST and proxy to the same host, I get Status Code:400 Bad Request with HTTP message contains illegal headers.
I checked out the proxyReq headers and they look good, the same exact headers used on successful gets.
_headers:
{ 'x-forwarded-proto': 'http',
'x-forwarded-port': '9000',
'x-forwarded-for': '::ffff:10.3.117.47',
'accept-language': 'en-US,en;q=0.8',
'accept-encoding': 'gzip,deflate,sdch',
'user-agent': 'Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/38.0.2125.101 Safari/537.36',
accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,*/*;q=0.8',
'cache-control': 'no-cache',
pragma: 'no-cache',
connection: 'close',
host: '10.1.1.1:9000',
'x-auth-token': 'tokenStuff'
}
On a side note, if I make the same api call out directly to the proxied host without using the proxy, I don't get this message. Same post and json payload and headers
Answer: It was the http-proxy option xfwd: true that was causing this.
I have written a node.js proxy server ( its here on github )
The problem is that the connect.bodyParser doesn't work very well.
For this probject I've written my own bodyParser (see the file 'server'), but now I was testing again with connect.bodyParser. In short, I have now something like:
app.use(connect.bodyParser())
.use(connect.query())
.use(serveFromDB)
.use(actAsProxyServer)
.use(cacheContent)
.use(function(err, req, res, next) {
console.log("ERROR: " + JSON.stringify(err)) ;
console.log("URL=" + req.url) ;
console.dir(req.headers) ;
res.setHeader('Content-Type', 'application/json');
res.end(JSON.stringify(err));
}) ;
Here is output from the error function:
ERROR: {"status":400}
URL=/Client/rest/cache/Clients/user123/X7X1
{ host: 'localhost:8000',
connection: 'keep-alive',
'x-requested-with': 'XMLHttpRequest',
'user-agent': 'Mozilla/5.0 (Macintosh; Intel Mac OS X 10_7_5) AppleWebKit/537.11 (KHTML, like Gecko) Chrome/23.0.1271.64 Safari/537.11',
'content-type': 'application/json; charset=utf-8',
accept: 'application/json, text/javascript, */*; q=0.01',
referer: 'http://localhost:8000/Client/index.jsp?cache=true',
'accept-encoding': 'gzip,deflate,sdch',
'accept-language': 'en-US,en;q=0.8',
'accept-charset': 'ISO-8859-1,utf-8;q=0.7,*;q=0.3',
cookie: 'JSESSIONID=d1cbd411e30bcfb759e29585ee23' }
The only thing this GET request does is calling that url (without any parameters)
Any suggestions why the bodyParser throws an error on this GET request ?
Cheers
UPDATE: I found the code of bodyParser here. In json.js it finaly throws the error because its trying to turn an empty string (because there is no body) into json. I though bodyParser is only for POST request!!
UPDATE1: found the problem: https://github.com/documentcloud/backbone/pull/267 I think I have a content-type in my GET request
Have a look at B2MSolutions / gzip-bodyparser