I have a locally hosted web application that works fine on my local browser, however, when I test it on LT, it gives error, “Invalid Host Header”.
While testing an application hosted on your local machine, you may receive an “Invalid Host Header” error message when testing on LambdaTest using a local connection. This error is most commonly caused by a misconfiguration of the application server that causes it to reject non-local connections or reject requests directed at hostnames other than localhost(or any custom one set)
Since, web applications are now built with various different kinds of frameworks like angular, react etc; In order to test it using tunnel the command used to run your web app needs to modified in your project manifest file i.e. “package.json”
Angular Framework Project: For Angular framework based web app, ideally you might be using “ng serve” or “npm start” to run your web application or your package.json file configuration would be set as “ng serve” in order to start your web app and as usual, it would be working fine on local browser. However, this might throw an “Invalid Host Header”error or error something related to the invalid host in a Real Time Test.To resolve this, here is the quick small solution for you. While running your application, you can either use command ng serve --host 0.0.0.0 --disable-host-check or set your start configuration in package.json file as “ng serve --host 0.0.0.0 --disable-host-check” instead of changing your running command.
React Framework Project: For React framework based web app, you need to create an env file in which you have to add the hostname,syntax: HOST=< hostname >, once you are done with it, now you can add your localhost IP along with your hostname in your system hosts file. Example: 127.0.0.1 < hostname > This would help you avoiding “Invalid Host Header” error.