带有 tomcat 的 Azure windows 服务器不显示完整的 html 页面答案

【问题标题】：Azure windows server with tomcat does not display a full html page带有 tomcat 的 Azure windows 服务器不显示完整的 html 页面
【发布时间】：2015-11-11 14:44:03
【问题描述】：

我编写了一个显示谷歌地图的简单 html 页面，它可以在我的本地计算机上运行，但在我将 war 文件上传到 MS Azure 云 tomcat 服务器后它不显示地图。

在我的本地机器上，我正在运行带有 Tomcat 8.0.15 的 Netbeans 8.0.2。在 Azure 上运行 Tomcat 8.0.24

这是我的代码

<!DOCTYPE html>
<!--
To change this license header, choose License Headers in Project Properties.
To change this template file, choose Tools | Templates
and open the template in the editor.
-->
<html>
    <head>
        <title>Home Page</title>
        <meta charset="UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <style>
            html, body, #map-canvas {
                margin: 0;
                padding: 0;
                height: 100%;
            }
        </style>
        <script src="https://maps.googleapis.com/maps/api/js?v=3.exp&sensor=false"></script>
        <script>
            var map;
            var lat;
            var lon;

            function initialize() {
                var mapOptions = {
                    zoom: 13,
                    center: new google.maps.LatLng(-37.8180819, 144.968177),
                    mapTypeId: google.maps.MapTypeId.ROADMAP
                };
                map = new google.maps.Map(document.getElementById('map-canvas'),
                        mapOptions);
            }

            google.maps.event.addDomListener(window, 'load', initialize);

            function pan() {
                getLocation();
                var panPoint = new google.maps.LatLng(lat.toString(), lon.toString());
                map.panTo(panPoint);
                
            }

            function getLocation() {
                if (navigator.geolocation) {
                    navigator.geolocation.getCurrentPosition(showPosition);
                } else {
                    x.innerHTML = "Geolocation is not supported by this browser.";
                }
            }

            function showPosition(position) {
                lat = position.coords.latitude;
                lon = position.coords.longitude;
            }

            function showError(error) {
                switch (error.code) {
                    case error.PERMISSION_DENIED:
                        x.innerHTML = "User denied the request for Geolocation."
                        break;
                    case error.POSITION_UNAVAILABLE:
                        x.innerHTML = "Location information is unavailable."
                        break;
                    case error.TIMEOUT:
                        x.innerHTML = "The request to get user location timed out."
                        break;
                    case error.UNKNOWN_ERROR:
                        x.innerHTML = "An unknown error occurred."
                        break;
                }
            }
        </script>
    </head>
    <body>
        <!--        <label>lat</label><input type="text" id="lat" />
                <br/>
                <label>lng</label><input type="text" id="lng" />-->
        <input type="button" value="Track your location" onclick="pan()" />


        <div id="map-canvas"></div>
    </body>

</html>

这是我在机器上运行时看到的

下面的照片是我在 Azure Tomcat 服务器上看到的（没有 10 个代表，所以请点击链接查看照片，抱歉） http://i.stack.imgur.com/70AT9.jpg

只有按钮可见，地图不显示在浏览器中。 http://i.stack.imgur.com/2rMHC.png

非常感谢任何提示或评论。

【问题讨论】：

第二张图片上的按钮与第一张上的按钮不同。你确定代码是一样的吗？
！00% 确定。相同的代码。当我截取屏幕截图时，它可能会突出显示。这是我的实时服务器的链接，它不显示地图而是按钮本身。 a1-jdk7.cloudapp.net/A1Fundation
按钮中的文字是“updateCenter”。
@geocodezip 是的，我改变了措辞。仍然不应该影响地图第一次显示（在我点击按钮之前，应该显示默认地图）。
@geocodezip 我想我找到了问题所在，我做了更改后忘记停止并重新部署war文件。

标签： html css tomcat azure google-maps-api-3

【解决方案1】：

感谢 geocodezip，我找到了问题并解决了它。我忘了在 tomcat 中重新部署我的应用程序。这是我的错误。谢谢你们的cmets。

【讨论】：