How to Fix "Localhost Refused To Connect in Chrome" Browser & VS Code For HTML CSS & JS Web Apps
20 views
Jun 3, 2025
Get the full source code of application here: Watch My Visual Studio Code IDE Setup Video For Fonts,Themes & Extensions https://youtu.be/Bon8Pm1gbX8 Hi Join the official discord server to resolve doubts here: https://discord.gg/cRnjhk6nzW Visit my Online Free Media Tool Website https://freemediatools.com/ Buy Premium Scripts and Apps Here: https://procodestore.com/
View Video Transcript
0:00
uh hello guys uh welcome to this video
0:02
so in this video I will show you how to
0:04
fix this problem uh whenever you type
0:06
localhost inside your chrome browser or
0:09
any sort of browser uh this uh error
0:13
that you see this site can't be reached
0:16
so localhost if you type in the browser
0:19
window you will see this window so I
0:21
will fix it so I will show you how to
0:24
run website
0:26
locally if you type local host so first
0:29
of all you need to open this
0:33
URL just go to your browser simply type
0:36
here
0:37
chrome
0:39
col//net dash
0:43
intervals /
0:46
DNS so simply go to the browser type
0:49
this address so it allows you to flush
0:52
the DNS
0:57
just copy the paste the address so here
1:02
this is the address here simply open it
1:04
inside your Chrome browser and here you
1:06
need to simply type this domain
1:10
localhost so this will actually flush
1:13
all the DNS catch which is
1:16
there so this is actually the local host
1:20
uh IP address which is there inside your
1:22
computer here so just hit this button
1:26
here clear host cache so it will
1:28
actually clear everything this is the
1:31
first step and if the error still is
1:34
there you just need to see if you are
1:38
not running any sort of uh previous
1:40
application which is running so just
1:42
close all the applications if you're
1:44
running the next thing that you can do
1:46
is actually go to the host file so go to
1:50
the C drive and just go to the Windows
1:53
directory and inside this directory we
1:56
have the system 32
2:00
folder so this is actually the system 32
2:03
folder and then we have actually the
2:05
folder which is drivers this is actually
2:09
the
2:10
folder inside this we have the folder of
2:13
etc and uh inside this we have this file
2:18
which is the
2:20
host host file here simply open this
2:25
file inside uh visual studio so just
2:30
make sure that you uncommented this line
2:32
here uh which is uh
2:38
uh if you just see right
2:43
here
2:45
127.0.0.1 like
2:49
this so here you can actually map all
2:52
your domains in this uh etc host file so
2:56
this is your local host here here you
2:58
can match any sort of domain that you
3:01
want to so inside
3:04
here we can actually write uh local
3:09
host yeah so yeah instead of this we can
3:13
just write local host so this actually
3:16
maps all your domain names this is your
3:19
local host
3:20
address so just make this change just
3:24
write
3:25
this and uh simply save this
3:29
and now if you try to
3:34
refresh and after doing that you just
3:36
need to actually open your application
3:39
uh so I have this simple index html file
3:43
right here so for this in VS code if
3:45
you're working with you can install
3:47
extension which is called as uh live
3:50
server which will start your application
3:53
locally inside your system so this is a
3:55
very popular extension in VS code almost
3:57
having 1 billion installs so just enable
4:00
that go to the settings and right here
4:04
in the port number just replace the port
4:06
number which is
4:10
80 so I have already replaced it 80 is
4:14
the default port number for local host
4:16
just make sure that you put 80 here and
4:18
now if you open with live server open
4:21
with five server you will see this will
4:24
open your application and if you see now
4:26
the application is running on localhost
4:31
127.0.0.1 you can even write local host
4:34
as it is instead of that port number and
4:37
now you can see on local host your
4:39
application is running so in this easy
4:42
way you can
4:44
actually deploy your applications
4:47
locally test it out locally and fix that
4:50
error
4:53
message just follow all the steps that I
4:56
showed
4:59
you so if you make any sort of change
5:01
here let's suppose
5:06
I and you will see it will automatically
5:11
refresh uh if you don't want to use this
5:14
extension there is another popular
5:16
extension which is XAMP Apache
5:21
server which you can install inside your
5:23
system uh which comes with the PHP
5:26
Apache server MySQL database so I've
5:28
already downloaded this so this
5:30
available for Windows Linux Mac so once
5:33
it is installed you can start this
5:34
Apache server so click on start and this
5:39
will start this application so just make
5:42
sure you
5:46
have so this is running on that port
5:49
number so I will simply stop this first
5:51
of all just make sure that you stop
5:55
this yeah so we already stopped it now
5:59
click on start this Apache server will
6:01
start on this you can see it will start
6:04
on port
6:05
80 so again if you type local host it
6:08
will redirect it will start this server
6:11
here so these are the two extensions
6:13
first of all in VS code if you want to
6:15
test out locally you can install this
6:17
extension uh live server or you can use
6:20
this software exam control panel so in
6:23
this way you can fix this problem of
6:27
having if you type local host that error
6:30
message you can fix these problem I
6:33
showed you step by step and uh if you if
6:36
your problem is solved then please
6:38
comment on this video and also hit the
6:40
like button and also check out my
6:42
website freemediatools.com which
6:44
contains thousands of tools regarding
6:46
audio video and image
#Scripting Languages