fuyuhang
/
Project_yhfu
spogulis no http://121.37.83.100:3000/sooka_onest/sooka_onest_forestfire_vue2_visualization.git


			
							123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172173174175176177178179180181182183184185186187188189190191192193194195196197198199200201202203204205206207208209210211212213214215216217218219
							<!--********************************************************************
* Copyright© 2000 - 2021 SuperMap Software Co.Ltd. All rights reserved.
*********************************************************************-->
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title data-i18n="resources.title_onlineSecurity"></title>
    <script type="text/javascript" src="../../dist/ol/include-ol.js"></script>
    <style>
        .panel {
            margin-bottom: 0;
        }
    </style>
</head>
<body style=" margin: 0;overflow: auto;background: #fff;width: 100%;height:100%;position: absolute;top: 0;">
<div class="container">
    <div class="page-header">
        <h4 data-i18n="resources.title_onlineSecurity"></h4>
    </div>
    <div class="row">
        <table class="table table-bordered col-md-8">
            <thead>
            <tr>
                <th class="text-center" data-i18n="resources.text_function"></th>
                <th class="text-center" data-i18n="resources.text_instance"></th>
            </tr>
            </thead>
            <tbody>
            <tr>
                <td class="text-center text-success" data-i18n="resources.text_login"></td>
                <td>
                    <div class="col-md-12 text-center">
                        <a class="btn btn-success" onclick="loginOnline()" data-i18n="resources.text_login"></a>
                    </div>
                </td>
            </tr>

            <!-- 注册key -->
            <tr>
                <td class="text-center text-success" data-i18n="resources.text_keyAuthorizedService"></td>
                <td>
                    <div class="col-md-12">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <form class="form-horizontal">
                                    <fieldset>
                                        <div class="form-group">
                                            <label for="serviceUrl_online" class="col-md-2 control-label"
                                                   data-i18n="resources.text_serviceAddress"></label>
                                            <div class="col-md-8">
                                                <input type="text" class="form-control" id="serviceUrl_online">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label for="key_online" class="col-md-2 control-label">key</label>
                                            <div class="col-md-8">
                                                <input type="text" class="form-control" id="key_online">
                                            </div>
                                        </div>

                                        <div class="col-md-12 text-center">
                                            <a class="btn btn-success" onclick="registerOnlineKeyAndRequestService()"
                                               data-i18n="resources.text_accessing"></a>
                                        </div>
                                    </fieldset>
                                </form>
                            </div>
                        </div>
                    </div>
                </td>
            </tr>
            <!-- 出图 -->
            <tr>
                <td class="text-center text-success" data-i18n="resources.text_keyAuthorizedGetMap"></td>
                <td>
                    <div class="col-md-12">
                        <div class="panel panel-default">
                            <div class="panel-body">
                                <form class="form-horizontal">
                                    <fieldset>
                                        <div class="form-group">
                                            <label for="serviceUrlMap_online" class="col-md-2 control-label"
                                                   data-i18n="resources.text_serviceAddress"></label>
                                            <div class="col-md-8">
                                                <input type="text" class="form-control" id="serviceUrlMap_online">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <label for="mapKey_online" class="col-md-2 control-label">key</label>
                                            <div class="col-md-8">
                                                <input type="text" class="form-control" id="mapKey_online">
                                            </div>
                                        </div>
                                        <div class="form-group">
                                            <div class="col-md-12  text-center">
                                                <a class="btn btn-success" onclick="showMapWithOnlineKey()"
                                                   data-i18n="resources.text_getMap"></a>
                                            </div>
                                        </div>
                                    </fieldset>
                                </form>
                            </div>
                        </div>
                    </div>
                </td>
            </tr>
            <tr>
                <td colspan="3">
                    <div class="row">
                        <div class="col-md-12  text-center">
                            <div class="col-md-12" id="online_map" style=" height: 300px;"></div>
                        </div>
                    </div>
                </td>
            </tr>
            </tbody>
        </table>
    </div>
</div>
<script type="text/javascript" include="bootstrap,jquery,widgets.alert" src="../js/include-web.js"></script>
<script>

    //若示例与SuperMap Online不在同一域下，欲查看示例效果请打开该句注释
    //SuperMap.Support.cors = false;
    $(document).ready(function () {
        $("#serviceUrl_online").val("http://www.supermapol.com/iserver/services/bsaq89v0/rest/maps/World");
        $('#key_online').val("Ie2kriXZZz9GPevFDBQzgLRf");
        $("#serviceUrlMap_online").val("http://www.supermapol.com/iserver/services/bsaq89v0/rest/maps/World");
        $('#mapKey_online').val("Ie2kriXZZz9GPevFDBQzgLRf");

    });

    /*登录*/
    function loginOnline() {
        var href = window.location.href;
        SuperMap.SecurityManager.loginOnline(href, true);
    }

    /*登录 end*/


    /*注册key*/
    function requestOnlineKeyService() {
        var serviceUrl = getOnlineServiceUrl();
        if (!checkUrl(serviceUrl)) {
            return;
        }
        new ol.supermap.MapService(serviceUrl, {
            serverType: SuperMap.ServerType.ONLINE
        }).getMapInfo(function (json) {
            if (json.error) {
                widgets.alert.showAlert(JSON.stringify(json.error), false);
            } else {
                widgets.alert.showAlert(JSON.stringify(json.result), true);
            }
        });
    }

    function registerOnlineKeyAndRequestService() {
        var key = $('#key_online').val();
        var serviceUrl = getOnlineServiceUrl();
        if (!checkUrl(serviceUrl)) {
            return;
        }
        SuperMap.SecurityManager.destroyKey(serviceUrl);
        SuperMap.SecurityManager.registerKey(serviceUrl, key);
        requestOnlineKeyService();
    }

    function getOnlineServiceUrl() {
        return $("#serviceUrl_online").val();
    }

    /*注册key end*/

    /*出图*/
    function showMapWithOnlineKey() {
        var key = $('#mapKey_online').val();
        var mapUrl = $('#serviceUrlMap_online').val();
        if (!checkUrl(mapUrl)) {
            return;
        }
        SuperMap.SecurityManager.registerKey(mapUrl, key);

        var map = new ol.Map({
            target: 'online_map',
            controls: ol.control.defaults({attributionOptions: {collapsed: false}})
                .extend([new ol.supermap.control.Logo()]),
            view: new ol.View({
                center: [0, 0],
                maxZoom: 18,
                zoom: 2,
                projection: 'EPSG:4326'
            }),
        });
        var layer = new ol.layer.Tile({
            source: new ol.source.TileSuperMapRest({
                serverType: SuperMap.ServerType.ONLINE,
                url: mapUrl
            }),
            projection: 'EPSG:4326'
        });
        map.addLayer(layer);
    }

    /*出图 end*/


    function checkUrl(url) {
        if (url === "") {
            widgets.alert.showAlert(resources.msg_fillInURL, false);
            return false;
        }
        return true;
    }
</script>
</body>
</html>