Question

我的cordova应用程序（and hence a white screen）出现控制台错误，因为在某处寻找favicon.ico，并抛出404。我不知道为什么，因为我没有在任何地方引用它在html或css文件中。

* {
    -webkit-tap-highlight-color: rgba(0,0,0,0);
}

body {
    -webkit-touch-callout: none;
    -webkit-text-size-adjust: none;
    -webkit-user-select: none;
    background-color: #36774F !important;
    color: #FFF !important;
    font-family: 'HelveticaNeue-Light', 'HelveticaNeue', Helvetica, Arial, sans-serif;
    font-size: 12px;
    height: 100%;
    margin: 0px;
    padding: 0px;
    text-transform: uppercase;
    width: 100%;
    font-family: 'RobotoRegular', 'Droid Sans', 'Segoe UI', Segoe, 'San Francisco', 'Helvetica Neue', Helvetica, Arial, Geneva, sans-serif;
    font-size: 12px;
}

.app {
    position: absolute;
    left: 50%;
    top: 50%;
    height: 50px;
    width: 225px;
    text-align: center;
    padding: 180px 0px 0px 0px;
    margin: -115px 0px 0px -112px;
}

@media screen and (min-aspect-ratio: 1/1) and (min-width:400px) {
    .app {
        background-position: left center;
        padding: 75px 0px 75px 170px;
        margin: -90px 0px 0px -198px;
    }
}

.event {
    border-radius: 4px;
    -webkit-border-radius: 4px;
    color: #FFFFFF;
    font-size: 12px;
    margin: 0px 30px;
    padding: 2px 0px;
}

    .event.listening {
        background-color: #333333;
        display: block;
    }

    .event.received {
        background-color: #4B946A;
        display: none;
    }

@keyframes fade {
    from {
        opacity: 1.0;
    }

    50% {
        opacity: 0.4;
    }

    to {
        opacity: 1.0;
    }
}

@-webkit-keyframes fade {
    from {
        opacity: 1.0;
    }

    50% {
        opacity: 0.4;
    }

    to {
        opacity: 1.0;
    }
}

.blink {
    animation: fade 3000ms infinite;
    -webkit-animation: fade 3000ms infinite;
}

body {
    background-color: #36774f;
    -webkit-background-size: cover;
    -moz-background-size: cover;
    -o-background-size: cover;
    background-size: cover;
}

.left-column {
    background-color: #285d3c;
}

table.timetable {
    background-color: #285d3c;
    background-size: cover;
}

.header {
    background: transparent url(../images/header-bg.jpg) no-repeat center center;
    background-size: cover;
    margin-left: 0px;
    max-width: 100%;
    height: 73px
}

img.logo{
    width: 85px;
}

marquee.moving-text {
    background-color: #285d3c;
}

a.nav-link {
    color: white;
}

a.nav-link.show {
    color: black;
}

.table.month-view tr th
{
    min-width: 65px;
}

.copyright{
    text-align: center;
    font-size: 8px;
}

.salah-header {
    font-size: 1.1rem;
    text-align: center;
}

<!DOCTYPE html>
<html ng-app="mia">
<head>
    <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *">

    <meta http-equiv="content-type" content="text/html; charset=UTF-8" />
    <meta name="format-detection" content="telephone=no">
    <meta name="msapplication-tap-highlight" content="no">
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width">
    <link rel="stylesheet" type="text/css" href="css/index.css">
    <link rel="stylesheet" type="text/css" href="css/color_green.css">
    <link rel="stylesheet" type="text/css" href="css/bootstrap.css">
    <title>MIA</title>
    <script type="text/javascript" src="cordova.js"></script>
    <script type="text/javascript" src="scripts/platformOverrides.js"></script>
    <script type="text/javascript" src="scripts/jquery-3.3.1.js"></script>
    <script type="text/javascript" src="scripts/bootstrap.js"></script>
    <script type="text/javascript" src="scripts/moment-with-locales.js"></script>
    <script type="text/javascript" src="scripts/angular.min.js"></script>
    <script type="text/javascript" src="scripts/angular-animate.min.js"></script>
    <script type="text/javascript" src="scripts/angular-resource.min.js"></script>
    <script type="text/javascript" src="scripts/angular-route.min.js"></script>
    <script type="text/javascript" src="scripts/angular-sanitize.min.js"></script>
    <script type="text/javascript" src="scripts/angular-touch.min.js"></script>
    <script type="text/javascript" src="scripts/app.js"></script>
    <!--- Controllers --->
    <script type="text/javascript" src="scripts/controllers/index.controller.js"></script>
</head>

<body class="body-section" ng-cloak>
    <div class="container-fluid" ng-controller="IndexController as vm">
        <div class="row" style="background: transparent url('images/header-bg.jpg') no-repeat center center; background-size: cover; margin-left: 0px; max-width: 100%; height: 73px">
            <div class="col-md-12">
                <img src="images/logo.png" class="logo img-fluid" />
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <img src="images/musallah_cover.jpg" class="img-fluid" />
            </div>
        </div>
        <div class="row">
            <div class="col-md-12">
                <ul class="nav nav-tabs" id="myTab" role="tablist">
                    <li class="nav-item">
                        <a class="nav-link active" id="home-tab" data-toggle="tab" data-target="#home" role="tab" aria-controls="home" aria-selected="true">Today</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="profile-tab" data-toggle="tab" data-target="#profile" role="tab" aria-controls="profile" aria-selected="false">Tomorrow</a>
                    </li>
                    <li class="nav-item">
                        <a class="nav-link" id="contact-tab" data-toggle="tab" data-target="#contact" role="tab" aria-controls="contact" aria-selected="false">Month</a>
                    </li>
                </ul>
                <div class="tab-content" id="myTabContent">
                    <div class="tab-pane fade show active" id="home" role="tabpanel" aria-labelledby="home-tab">
                        
                    </div>
                    <div class="tab-pane fade" id="profile" role="tabpanel" aria-labelledby="profile-tab">
                        
                        
                    </div>
                    <div class="tab-pane fade" id="contact" role="tabpanel" aria-labelledby="contact-tab">
                        
                    </div>
                </div>
            </div>
        </div>
        <div class="row">
            <div class="col-md-12 copyright">
                Copyright &copy; All rights reserved. 
            </div>
        </div>
    </div>
</body>

</html>

我的角度js文件中的任何地方都没有引用该图标。

这是我看到的控制台错误：

Answer 1

只需将以下行添加到HTML文件的部分：

//Try PHP-ExcelReader     

<?php
        include 'excel_reader.php';       // include the class
        $excel = new PhpExcelReader;      // creates object instance of the class
        $excel->read('excel_file.xls');   // reads and stores the excel file data

        // Test to see the excel data stored in $sheets property
        echo '<pre>';
        var_export($excel->sheets);

        echo '</pre>';

        or 

     echo '<pre>';
        print_r($excel->sheets);

        echo '</pre>';

参考：How to prevent favicon.ico requests?

Answer 2

如here所述：

“ 许多Web浏览器都具有一种功能，如果有人将您的网站加为书签（即将其放在“收藏夹”菜单中），它将特定图标与您的网站关联到书签中。它会尝试获取该图标。首先从网页目录中请求“ favicon.ico”。如果找不到此类文件，它将尝试从您网站的 root 目录中获取该文件，否则，它将失败。只会使用默认图标作为书签。“

Answer 3

以防万一有人碰到类似问题，这是解决以下问题的必要条件。

最初，this帖子使我认为这是导致白屏的丢失图标。尝试解决所有JS控制台错误，然后查看是否可以消除白屏。

但是，就我而言，即使消除了该错误，我仍然会出现白屏。进行一些挖掘后，我发现了this问题，建议在调试模式下进行编译时，增加初始屏幕的延迟。

Cordova应用程序正在寻找未知的favicon.ico

3 个答案: