Why Live Server is not opening the browser or loading - html

I am new to VSCode and Web Designing. I downloaded live server to load my websites directly, but when i click on golive then nothing happens. No browser opens up and even if I open it manually then click on go live nothing happens. I have auto save turned on to 1000ms so then it must work right? I am using latest stable version of VSCode and latest version of live server(OS Windows 8). Please help me if you can I am trying to open it in Google Chrome. Here is my settings.json -
{
"editor.suggestSelection": "first",
"vsintellicode.modify.editor.suggestSelection": "automaticallyOverrodeDefaultValue",
"files.autoSave": "afterDelay",
"liveServer.settings.donotShowInfoMsg": true,
"liveServer.settings.AdvanceCustomBrowserCmdLine": ""
}

I encounter the same problem but when I go to the live server setting. at the Live Server › Settings: Https I changed the value of enable to false. Then it works fine with chrome. Otherwise you have to change the https to http because others browser use http for the link
PS: make sure you install live-server extension in chrome also

It is because you have added insufficient paths in your Environmental variables.
First you can do is close the vs code
Go to the properties of My Pc
Click on Advanced Settings
click on Environmental Variables
from there you can add path clicking the path variables in the table shown there
6 . Add a new line to the path and copy paste the path of your system 32
C:\Windows\System32
hope this solution works in your case

this is happening to me, and It opens the tab but won't load even after 24+ hours. You have to close VS and the browser tab, then open VS again and wait to open live server. However long you have to wait is dependent on how good your computer is.

Related

SSLKEYLOGFILE environment variable doesn't populate any text file

My operating system is Windows 10 64 bits. I use the latest versions of Firefox and Chrome.
I want to save the pre-master keys in order to use them with WireShark.
For this, I have found many tutorials that all recommend using the SSLKEYLOGFILE environment variable.
However, no matter the path I put in this variable, no file is being created by Firefox (normal and developer editions) or Chrome. This is true even when I restart those browsers or the operating system. This is also true when I clear the cache on the browsers.
I found an alternative way of setting the SSLKEYLOGFILE variable with Chrome by launching the browser with the following argument:
--ssl-key-log-file=PATH
And while this argument does create a log file, it is never populated. It remains completely empty.
What makes this problem even more annoying is that I don't know if there's any debug log that would at least let me know what's happening.
Anyone have ideas on how to solve this issue?
Verified in both Chrome and Firefox
Windows 10 64bit [Version 10.0.17763.379]
I would not use the --ssl-key-log-file flag with Chrome. In my testing, it does not have an effect.
Steps to get SSL keylog file
Change your directory to one that you or your programs have access to. I am using the Desktop folder.
C:\> cd $HOME\Desktop
Set the SSLKEYLOGFILE variable. This sets it for the user (HKCU). To set it for the machine (HKLM), add the /m flag to the end of the command.
PS C:\Users\rj\Desktop> SetX SSLKEYLOGFILE "$(get-location)\ssl.log"
Verify that the variable has been set in a separate powershell window (SetX does not apply to the current window).
PS C:\Users\rj\Desktop> Get-ChildItem ENV: | findstr SSLKEYLOGFILE
SSLKEYLOGFILE C:\Users\rj\Desktop\ssl.log
You can also verify that SSLKEYLOGFILE is a user variable by going to the Control Panel > System and Security > System > Advanced System Settings > Advanced tab > Environment Variables > User Variables. You should see a listing like the powershell example where the value is a directory.
Open Chrome/Firefox and go to an https website like https://stackoverflow.com.
You should see an ssl.log show up on your desktop.
Image of end result
Further Reading
2018-12-07, F5, Decrypting SSL traffic: Great article on doing the above, but cross-platform
2019-03-18, Mozilla, NSS Key Log Format
: The SSLKEYLOGFILE format
2018-08-17, Wireshark Bugzilla, Add TLS 1.3 support: Has good test pcap/SSLKEYLOGFILE contents for TLS1.3 (See Comment 83)
You mentioned that you are using Wireshark. If you using it to export a file from a TLS-encrypted stream in a capture, this article may help you.
One thing I ran into is: Chrome doesn't always fully close when you close the window. Sometimes it stays open in the background. Use the Windows Process Explorer to list all the processes and make cure Chrome is closed. Also, after restarting Chrome, you can double click on it in Process Explorer and select the Environment tab to list all the variables set in it's environment. Make sure SSLKEYLOGFILE is shown in that list. Then Chrome will be sending keys to the specified file.
First off all the problem is that the browsers are protected better and that flaw is patched, thats why you cant capture no ssl. I dont know the details. But chrome with --no-sandbox(linux) option on ,when running will enable you to capture ssl/tls key without any issues from the first try, so you can play with decription of packets. Never tried on windows btw..
This worked for me...
set the SSKEYLOG env: variable as normal in Linux.
just point it to your pefererd save location of the sslkey.log
windows system/advance/env vars/user variables.
add SSLKEYLOGfile with the path to your preferred save location C:/user/sslkey.log
close and your done here.
NSS_ALLOW_SSLKEYLOG=1 is what's missing from the Booleans in Firefox's advanced options.
its been also removed from the general release but is still in the dev ops version. just not listed.
download and install the dev ops version of Firefox
open a terminal start it from its exe if on Linux.
windows just open it from the icon.
go to the about:config
create a new Boolean with NSS_ALLOW_SSLKEYLOG=1 and set it to true.
quit
now create a new symbolic/icon link to the new dev version fire fox version
when you run Firefox from the terminal in Linux the sskeylog should be created and start populating.
run it from the task bar icon in Linux and it doesn't make or update the keylog (just in case you dont want it populating every time you open the browser).
in windows, you will have to disable the env var or it will keep populating every time you open any browser that supports sslkey logging.
on that note opera and vivaldi should work with no changes to the advanced option.
lastly.. open wireshark go to
edit/preferences/protocols/tls
and put the path to the sslkey.log in the pre master secret log box.
click ok.
close everything..
start Wireshark
start your browser (from terminal in linux).
you should start seeing sslkeylog start populating and see extra options for decryption in the tabs of Wireshark.
have fun :)
1st solution:
Restart Chrome
2nd solution:
Use Firefox

Node inspector not showing source files

Since last week (March 25th), I am unable debug using node inspect. I have been using node 8.11.4, and have not updated node version.
After I run node --inspect filename.js I was able to go to chrome://inspect/#devices and click on Open dedicated DevTools for Node, and this used to attach the debugger and load the file.
Now it doesn't show anything in the inspect window.
However, it does show file in Remote Target, but only those files are shown that I had opened previously. I still don't see any files in Sidebar. And Reveal in Sidebar does not show me the current file.
I am using Chrome Version 73.0.3683.86.
This is a bug in chrome:
https://bugs.chromium.org/p/chromium/issues/detail?id=941608#c15
The fix is due for release in the next version (22nd April). In the meantime, either use NiM (chrome extension) or download the google chrome beta. I can confirm that it is working again using chrome beta.
https://www.google.com/chrome/beta/

XAMPP is not updating .html/.js files on reload

I recently installed XAMPP on a windows machine(Windows 10) just to get a local server up and running so that I could make API calls and not run into any CORS issues and it was working fine.
Now what is happening is that whenever I make any changes in the .html or .js files it won't update the page, I have cleared all the browser history , temp files, restarted XAMPP, closed and reopened the browser (in the root folder there is only a single .html file so no clash there) but still it won't update.
Is it something related to XAMPP(v3.2.2) or any local settings that I have to configure.
Browser: Chrome 65, though it is the same issue with firefox and IE.
It can be due to serve caches. You need to clear those caches. Go to browsing history and clear there or you can just right click on the reload button on chrome and click hard reload and cache clear.
When this happens to me I usually do (if you're using Mac) SHIFT + Cmd + R and if that doesn't work i close the tab (Chrome) and open a new one.

Capture Downloads in the Network Tab of Google Chrome Developer Tools

The Network tab in the Google Chrome Developer Tools window shows almost all http requests made, but does not seem to capture anything when the http request results in a file being downloaded.
How can I capture download requests in Google Chrome?
I am sure that your file download is happening by opening a new window. Network tab of developer tools only captures the request of current tab.
For example, following link will download the file but it will not appear in the network tab.
Click Here to Download file
Similar type of things can be done using javascript using (window.open, dynamic hyperlink/iframe), which will not appear in the network tab.
Various Javascript approach you can check here
I have observed similar behaviour in my past.
You cane check the chrome://net-internals in older version of chrome and chrome://net-export/ in the newer version of chrome to monitor any type of request being made by any instance/tab of chrome.
Note: You can check the internal events of chrome by typing chrome://net-export/ in the url box of chrome.
I have faced similar issue, and here's how I solved it.
Issue:
Debug an anchor link that download file upon clicking it.
Debugging Process:
Steps
Go to chrome://settings/content/automaticDownloads?search=download and disable auto download
Open chrome dev tools, Settings -> Global -> Auto-open DevTools for popup
Open chrome dev tools, Settings -> Console -> Preserve log upon navigation
I hope that helps.
This works without changing any settings of Chrome for a single download-request. It however does not automatically display all download-requests triggered in a different tab or window.
Trigger the download in the GUI.
Open Chrome's download history (chrome://downloads/).
Right-click your download and Copy link address.
Open DevTools, paste the link into the address bar of the corresopnding Chrome tab and execute it.
The download-request shows in the DevTools.
You can use Fiddler for a more grainy look into your network traffic:
https://www.telerik.com/fiddler
*I don't work for fiddler
What do you mean by capture?
If you meant that nothing showed up in preview tab or in response tab, it's because the response is the actual file being downloaded.
I've recently tried downloading Oracle JDK 11 with dev-tools open in network tab and here is what I got:
I have no particular configuration in this version of Chrome (Versione 71.0.3578.98 (Build ufficiale) (a 64 bit))
As #jlvaquero said, if you're trying to get as much details as possibile, try WireShark on your own local pc.
I can see it in my case by downloading a document from google drive and limit download speed to 3G.
First step : Open with f12 the programmer toolbar.
Step Two : Go to the networking tab and locate the video in question. To help filter by clicking on media.
Step Three : If the video has no protection you can right click, click open on a new tab and download with crtl + s. If this does not work is because the video has parameters to prevent it from doing so. In that case right click again, go to the COPY session and then click copy as cURL.
Step Four : Go to your linux terminal (If you use windows turn around), if you don't have curl installed type sudo apt install curl and then paste the copied CURL command from the developer bar.
Step 5 : Before executing the command you need to add at the end of it --output video.mp4 --insecure as it is a binary. The insecure parameter is if you have problem with certificate. Wait for the download to complete and be happy!
Obs: This link can help you: https://www.hanselman.com/blog/HowToDownloadEmbeddedVideosWithF12ToolsInYourBrowser.aspx
Google Chrome has been updated to support downloads in the Network Tab
This question was asked in February of 2018, and at the time Google Chrome did not support downloads in the Network tab.
I have verified this by downloading the 64.0.3282.140 build of Google Chrome.
And then attempted to download Spotify as an example and found no event appear in the network tab.
Any Google Chrome version released in 2019 or later will capture all download requests in the Network tab.

Localhost not working in Chrome, 127.0.0.1 does work

I'm trying to run a local node server, but for whatever reason localhost:3000 does not work. The error page states This webpage is not available ERR_CONNECTION_CLOSED However, 127.0.0.1:3000 does work. I have tried making changes to my hosts file, but to no avail. Does anyone have any idea what's causing the problem?
Chrome version is 46.0.2490.80 m
Here are the steps I took to make this work correctly:
Edited my hosts file so 127.0.0.1 localhost. was present, and saved the file
Cleared my Chrome cache, specifically cookies and cached files
Cleared host cache in chrome://net-internals/#dns
Restarted chrome
Alternatively, this also works:
Navigate to chrome://net-internals/#hsts
Under "Delete domain", type localhost and delete
Unbeknownst to me, my project had an HSTS middleware that set an HSTS cookie
For me (I had HTTP and HTTPs dev server on same port)
Chrome Dev tools F12
Application tab
Clear storage sub-tab
"Clear site data" button
I ran into a similar issue on my MacBook but none of the existing answers worked. I even tried the nuclear option and did a factory reset on my computer.
The issue turned out to be coming from the AirPlay receiver listening on Ports 5000 and 7000, which was creating the 403 error when I tried to serve something at localhost:5000.
The solution, as detailed here, was to uncheck AirPlay Receiver in System Preferences > Sharing
I solved my problem by:
opening the developer console F12
Going to network tab
Check Disable Cache
Browse locahost
What you can do is go to Chrome setting > Privacy and Settings > See all the cookies and site data, search for localhost and delete it. Then refresh your site it will be working.
Regards
if you're using a proxy there's a checkbox to bypass it for local addresses.
follow these steps.
open chrome
go to setting
Privacy and security
Clear browsing data
check cookies and other site data
click clear data.
I had same issue and I cleared cookies and cache and it worked
Go to Setting/clearBrowserData and just check all of history, cookies and cached files.
For me, Browse in Private (Ctrl + Shift + N) was enough.
Finally I have solved this problem
For those who have tried the clearing the cache from the browser and still facing the same issue follow these steps
search for live server(ctrl+shift+x) you will find a settings icon. click on Extension
settings
you can find Live server>Settings:Chrome Debugging Attachment click on edit in Settings.json
just add this (if there are multiple lines make sure to add comma[,])
"liveServer.settings.port": 0
Doing This It will randomly pick an opened port each time.