Загрузка сторонних скриптов, таких как src="http://js.api.here.com/v3/3.0/mapsjs-service.js", в приложение Nodejs

Я пытаюсь интегрировать карты Here в мой сайт Nodejs. Я хочу создать объект карты, как показано ниже в моем файле app.js.

var map = new H.Map(
          document.getElementById('mapContainer'),
          maptypes.normal.map,
          {
              zoom: 10,
              center: { lng: 13.4, lat: 52.51 }
          });

Затем я хочу передать этот объект карты в мой файл ejs для отображения. Но я не могу понять, как загрузить приведенные ниже сценарии в мое приложение. Эти файлы представляют собой сценарии, предоставляемые Here maps, которые необходимо загрузить для создания объекта карты.

<meta name="viewport" content="initial-scale=1.0, width=device-width" />
<script src="http://js.api.here.com/v3/3.0/mapsjs-core.js"
             type="text/javascript" charset="utf-8"></script>
<script src="http://js.api.here.com/v3/3.0/mapsjs-service.js"
             type="text/javascript" charset="utf-8"></script>

Если я пытаюсь загрузить эти файлы в мои файлы ejs, я получаю сообщение об ошибке H не определено. Может кто-нибудь сказать, пожалуйста, как загрузить эти скрипты в моем приложении, чтобы у меня был доступ к новому H.map (...). И как мне сделать эти переменные доступными в моем файле ejs

Long Story Short Я хочу добавить следующий код в мое приложение nodejs, разделяя код внутри тега сценария в файле js и часть HTML в файл EJS

<html>
  <head>
  <meta name="viewport" content="initial-scale=1.0, width=device-width" />
  <script src="http://js.api.here.com/v3/3.0/mapsjs-core.js"
  type="text/javascript" charset="utf-8"></script>
  <script src="http://js.api.here.com/v3/3.0/mapsjs-service.js"
  type="text/javascript" charset="utf-8"></script>
  </head>
  <body>
  <div style="width: 640px; height: 480px" id="mapContainer"></div>
  <script>
    // Initialize the platform object:
    var platform = new H.service.Platform({
    'app_id': '{YOUR_APP_ID}',
    'app_code': '{YOUR_APP_CODE}'
    });

    // Obtain the default map types from the platform object
    var maptypes = platform.createDefaultLayers();

    // Instantiate (and display) a map object:
    var map = new H.Map(
    document.getElementById('mapContainer'),
    maptypes.normal.map,
    {
      zoom: 10,
      center: { lng: 13.4, lat: 52.51 }
    });
  </script>
  </body>
</html>

1 ответ

Решение

Поскольку вы используете EJS, вы можете проверить это: Как включить внешний файл.js на страницу шаблона узла ejs

Короче говоря, сценарий в EJS выполняется на стороне сервера перед отправкой страницы клиенту.

Чтобы использовать сторонние скрипты, попробуйте установить их на стороне сервера.

npm i here-js-api

А затем загрузите их в ваш скрипт: добавление локальных файлов скриптов в представления EJS

Другие вопросы по тегам