Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

The site can't be reached, localhost refused to connect, ERR_CONNECTION_REFUSED #80

Closed
IronBrotherz opened this issue Nov 7, 2018 · 4 comments

Comments

@IronBrotherz
Copy link

IronBrotherz commented Nov 7, 2018

The site can't be reached, localhost refused to connect, ERR_CONNECTION_REFUSED

This is the messsage Chrome displays when im clicking internal links to load local html pages. On OSX 10.3 everything loads fine. When I run this on Windows 10, I am getting these messages on different pages. I have disabled the firewall. I do not know what causes this issue. I dont have any funky networking settings.

These are all simple pages. Sometimes I can see when a click a link it says in the status bar "Connecting...." and then loads the page 2 seconds later or at many times it loads the error page.

Any way to troubleshoot this? Maybe I have the same issue as #54 and im thinking to just make this a single page

@ChrisKnott
Copy link
Collaborator

If you upload your code it will be much easier to see what is happening, difficult to say at the moment

@IronBrotherz
Copy link
Author

app.py

import eel
eel.init('web')
eel.start('index.html', size=(1024, 768))

index.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>kiosk</title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
    <link rel="stylesheet" href="css/bootstrap.min.css" crossorigin="anonymous">
    <link rel="stylesheet" href="css/fa-svg-with-js.css" crossorigin="anonymous">
    <script type="text/javascript" src="/eel.js"></script>
    <script type="text/javascript" src="js/jquery-3.3.1.min.js" crossorigin="anonymous"></script>
    <script type="text/javascript" src="js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
    <script type="text/javascript" src="js/fontawesome-all.min.js" crossorigin="anonymous"></script>
</head>

<body>
    <div class="container  page-index">
        <p class="page-title">Welcome to the Power Card Machine</p>
        <div class="row row-m-b-75">
            <div class="col-xl-2 col-lg-2"></div>
            <div class="col-xl-8 col-lg-8">
                <a href="buy_card.html" class="menu-btn-xl">buy new power card</a>
            </div>
            <div class="col-xl-2 col-lg-2"></div>
        </div>
        <div class="row row-m-b-75">
            <div class="col-xl-2 col-lg-2"></div>
            <div class="col-xl-8 col-lg-8">
                <a href="top_up.html" class="menu-btn-xl">top-up power card</a>
            </div>
            <div class="col-xl-2 col-lg-2"></div>
        </div>
    </div>
</body>

</html>

buy_card.html

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>kiosk</title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
    <link rel="stylesheet" href="css/bootstrap.min.css" crossorigin="anonymous">
    <link rel="stylesheet" href="css/fa-svg-with-js.css" crossorigin="anonymous">
    <script type="text/javascript" src="/eel.js"></script>
    <script type="text/javascript" src="js/jquery-3.3.1.min.js" crossorigin="anonymous"></script>
    <script type="text/javascript" src="js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
    <script type="text/javascript" src="js/fontawesome-all.min.js" crossorigin="anonymous"></script>
</head>

<body>
    <div class="container">
        <p class="page-title">Buy new Power Card</p>
        <div class="row row-m-b-75">
            <div class="col-xl-1 col-lg-1 col-md-1"></div>
            <div class="col-xl-5 col-lg-5 col-md-5"><a href="payment_choice.html?amount=150,000" class="menu-btn-lg">150,000</a></div>
            <div class="col-xl-5 col-lg-5 col-md-5"><a href="payment_choice.html?amount=200,000" class="menu-btn-lg">200,000</a></div>
            <div class="col-xl-1 col-lg-1 col-md-1"></div>
        </div>
        <div class="row row-m-b-75">
            <div class="col-xl-1 col-lg-1 col-md-1"></div>
            <div class="col-xl-5 col-lg-5 col-md-5"><a href="payment_choice.html?amount=250,000" class="menu-btn-lg">250,000</a></div>
            <div class="col-xl-5 col-lg-5 col-md-5"><a href="payment_choice.html?amount=300,000" class="menu-btn-lg">300,000</a></div>
            <div class="col-xl-1 col-lg-1 col-md-1"></div>
        </div>
        <div class="row">
            <div class="col-xl-3 col-lg-3 col-md-3"></div>
            <div class="col-xl-6 col-lg-6 col-md-6"><a href="index.html" class="menu-btn-md grey-btn"><i class="fas fa-undo"></i> start over</a></div>
            <div class="col-xl-3 col-lg-3 col-md-3"></div>
        </div>
    </div>
</body>

</html>

top_up.hml

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title>kiosk</title>
    <link rel="stylesheet" href="css/style.css" type="text/css">
    <link rel="stylesheet" href="css/bootstrap.min.css" crossorigin="anonymous">
    <link rel="stylesheet" href="css/fa-svg-with-js.css" crossorigin="anonymous">
    <script type="text/javascript" src="/eel.js"></script>
    <script type="text/javascript" src="js/jquery-3.3.1.min.js" crossorigin="anonymous"></script>
    <script type="text/javascript" src="js/bootstrap.bundle.min.js" crossorigin="anonymous"></script>
    <script type="text/javascript" src="js/fontawesome-all.min.js" crossorigin="anonymous"></script>
    <script type="text/javascript">
    $(function() {
        var sec = $(".top-up-countdown").text();
        var timer = setInterval(function() { 
           $(".top-up-countdown").text(--sec);
           if (sec == 0) {
              clearInterval(timer);
              $(".top-up-timer").fadeTo( "slow", 0.01 );
              $(".top-up-timer").text("Your session has expired!");
              $(".top-up-timer").fadeTo( "slow", 1, function(){
                $(".top-up-timer").fadeTo( "slow", 0.01, function(){
                    $(".top-up-timer").fadeTo( "slow", 1, function(){
                        window.location.href = "index.html";
                    });
                }); 
              });

           } 
        }, 1000);
    });
    </script>
</head>

<body>
    <div class="container">
        <p class="page-title">Top up your Power Card</p>
        <div class="row row-m-b-75">
            <div class="col-xl-5 col-lg-5 col-md-5"><a href="top_up_choice.html"><img src="images/game_card.png" class="game-card"></a></div>
            <div class="col-xl-7 col-lg-7 col-md-7">
                <p class="step-message">Insert your Power Card into the machine</p>
                <div class="line-sep"></div>
                <p class="top-up-timer">Time left: <span class="top-up-countdown pink-text">5</span> <span class="pink-text">seconds</span></p>
                <div class="line-sep"></div>
                <a href="index.html" class="menu-btn-md grey-btn"><i class="fas fa-undo"></i> start over</a>
            </div>
        </div>  
    </div>
</body>

</html>

@alphapk
Copy link

alphapk commented May 16, 2019

If you are using eel, then try using chrome flags

web_app_options = {
'mode': "chrome-app", #or "chrome"
'host': '127.0.0.1',
}

in the host name give the ipv4 address that shows in your cmd when entered ipconfig

if your behind a vpn or firewall then you can see two to three ipv4 addresses, try giving all

It worked for me!!!

Enjoy :)

@samuelhwilliams
Copy link
Collaborator

I'm closing this thread due to inactivity. If the problem still persists please feel free to open a new issue.

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
None yet
Projects
None yet
Development

No branches or pull requests

4 participants