More concrete example. Assume, you develop an AngularJS web app with custom directives. Maybe you're quickly testing some AngularJS features without any web server. AngularJS loads HTML files of custom directives on page initial load. All files are loaded by AJAX from your PC, so that you will see an error message such as "XMLHttpRequest cannot load file:///C:/somefolder/somefile.html". I had e.g. these messages in the browser console:
This is because your browser doesn't allow AJAX requests for file:/// Obviously, you need to serve all files over HTTP. The simplest solution would be to install a web server for Chrome. It serves web pages from a local folder over the network, using HTTP and comes exactly to rescue. After installing this small server app from the Google Web Store, you will see a Web Server icon. I have e.g. something like
Open the web server for Chrome and choose a directory to serve static content. In our case, this is the main folder of your project.
It is now able to stream large files and handle range requests. It also sets mime types correctly. Navigate to http://127.0.0.1:8887 You will see all content of you project. Assume, the main file is called myapp.html. After choosing this file, you will see the URL http://127.0.0.1:8887/myapp.html The web app is fine now because all separate files for AngularJS's includes or directives are streamed down by AJAX over HTTP. Changes in files are visible on-the-fly without any restarts or redeployments.
Have fun!
Testing web applications is routine work in web development. your post is quite helpful for chrome users.
ReplyDeleteit's helpful for web application testing. Thanks for sharing. Web Development Company India
ReplyDeleteI found this post really healpfull ! I tend to use express server on the top of node js ... I did not know this Google web server ! I will take a look into it.
ReplyDeleteThank you for this post.its very informative...Yatiken Software
ReplyDelete