0

ログイン画面でウェブサイトをローカルでデバッグすると、現在地の地図が表示され、経度と緯度が入力された 2 つのテキスト フィールドがありますが、ウェブサイトを展開すると、これが機能しなくなります。奇妙なことに、昨年デプロイしたときは完全に機能しました。

これは、ログイン ページのビューです。

@using WebApplication2.Models
@model LoginViewModel

@{
    ViewBag.Title = "Log in";
}

<h2>@ViewBag.Title.</h2>
<div class="row">
    <div class="col-md-5">
        <section id="loginForm">
            @using (Html.BeginForm("Login", "Account", new { ReturnUrl = ViewBag.ReturnUrl }, FormMethod.Post, new { @class = "form-horizontal", role = "form" })) {
                @Html.AntiForgeryToken()
                <h4>Use a local account to log in.</h4>
                <hr />
                @Html.ValidationSummary(true, "", new { @class = "text-danger" })
                <div class="form-group">
                    @Html.LabelFor(m => m.Email, new { @class = "col-md-2 control-label" })
                    <div class="col-md-10">
                        @Html.TextBoxFor(m => m.Email, new { @class = "form-control" })
                        @Html.ValidationMessageFor(m => m.Email, "", new { @class = "text-danger" })
                    </div>
                </div>
                <div class="form-group">
                    @Html.LabelFor(m => m.Password, new { @class = "col-md-2 control-label" })
                    <div class="col-md-10">
                        @Html.PasswordFor(m => m.Password, new { @class = "form-control" })
                        @Html.ValidationMessageFor(m => m.Password, "", new { @class = "text-danger" })
                    </div>
                </div>
                <div class="form-group">
                    <div class="col-md-offset-2 col-md-10">
                        <div class="checkbox">
                            @Html.CheckBoxFor(m => m.RememberMe)
                            @Html.LabelFor(m => m.RememberMe)
                        </div>
                    </div>
                </div>
                <input type="hidden" id="coordinates" name="coordinates">

                <div class="form-group">
                    <div class="col-md-10">
                        @Html.HiddenFor(m => m.Latitude)
                        @Html.EditorFor(m => m.Longitude)
                        @Html.EditorFor(m => m.Accuracy)
                    </div>
                </div>

                <div class="form-group">
                    <div class="col-md-offset-2 col-md-10">
                        <input type="submit" value="Log in" class="btn btn-default" />
                    </div>
                </div>

                <p>
                    @Html.ActionLink("Register as a new user", "Register")
                </p>
                @* Enable this once you have account confirmation enabled for password reset functionality
                    <p>
                        @Html.ActionLink("Forgot your password?", "ForgotPassword")
                    </p>*@



            }
        </section>
    </div>

    @*<div class="col-md-4">
            <section id="socialLoginForm">
                @Html.Partial("_ExternalLoginsListPartial", new ExternalLoginListViewModel { Action = "ExternalLogin", ReturnUrl = ViewBag.ReturnUrl })
            </section>
        </div>*@
    <div class="col-md-4">
        <section>
            <h2>Contact administrator if its not your current location: </h2>
            <div id="map" style="height: 253px ; width: 253px" />
        </section>
    </div>

</div>

@section Scripts {
    <script type="text/javascript" src="http://maps.googleapis.com/maps/api/js?sensor=false"></script>
    <script>
        var options = {
            enableHighAccuracy: true,
            timeout: 5000,
            maximumAge: 0
        };
        alert('aaa');
        var x = document.getElementById("coordinates");
        var latitude = document.getElementById("Latitude");
        var longitude = document.getElementById("Longitude");
        var accuracy = document.getElementById("Accuracy");
        function getLocation() {
            if (navigator.geolocation) {
                var position = navigator.geolocation.getCurrentPosition(showPosition, null, options);

            } else {
                x.innerHTML = "Geolocation is not supported by this browser.";
            }
        }
        function showPosition(position) {
            x.value = "Latitude: " + position.coords.latitude + "Longitude: " + position.coords.longitude + "Accuracy: " + position.coords.accuracy + " meters";
            latitude.value = position.coords.latitude;
            longitude.value = position.coords.longitude;
            accuracy.value = position.coords.accuracy;
            InitializeMap(position)
        }
        var map;
        var geocoder;
        function InitializeMap(position) {
            var latlng = new google.maps.LatLng(position.coords.latitude, position.coords.longitude);
            var mapOptions =
            {
                zoom: 16,
                center: latlng,
                mapTypeId: google.maps.MapTypeId.ROADMAP,
                disableDefaultUI: true
            };
            map = new google.maps.Map(document.getElementById("map"), mapOptions);

            var marker = new google.maps.Marker({
                position: latlng,
                title: 'Hello World!'
            });
            marker.setMap(map);

        }
        window.addEventListener('load', getLocation);
    </script>
    @Scripts.Render("~/bundles/jqueryval")
}

そして、これはローカルでどのように見えるかです:

ここに画像の説明を入力

Web でどのように表示されるかを確認できます: http://informatyka4445-001-site1.itempurl.com/Account/Login?ReturnUrl=%2F

質問: マップを Web に配置したときにマップが表示されないのはなぜですか。

ログイン: admin@admin.pl パス: TestPass44! 遊べる完全モックアップデータです。

4

1 に答える 1

1

これは、Web サイトを起動した後にコンソールに表示されるものです。

getCurrentPosition() と watchPosition() は、安全でないオリジンでは機能しなくなりました。この機能を使用するには、アプリケーションを HTTPS などの安全なオリジンに切り替えることを検討する必要があります。詳細については 、リンクを参照してください。

Webサイトをhttpsに切り替えると役立ちます

于 2016-09-16T20:02:55.180 に答える