použití modulu služby Azure Maps services

Článek
11/03/2021
4 min ke čtení

sada Azure Maps Web SDK poskytuje modul služeb. tento modul je pomocná knihovna usnadňující použití Azure Maps služby REST ve webových nebo Node.js aplikacích pomocí javascriptu nebo TypeScript.

Použití modulu služby na webové stránce

Vytvořte nový soubor HTML.
načtěte modul Azure Maps services. Můžete ho načíst jedním ze dvou způsobů:
- použijte globálně hostovanou verzi Content Delivery Network služby Azure Maps services v rámci Azure. Přidejte odkaz na skript do <head> prvku souboru:
```
<script src="https://atlas.microsoft.com/sdk/javascript/service/2/atlas-service.min.js"></script>
```
- případně můžete modul služby pro Azure Maps zdrojového kódu sady Web SDK načíst místně pomocí balíčku Azure-Maps-rest npm a potom ho hostovat s vaší aplikací. Tento balíček obsahuje také definice TypeScript. Použijte tento příkaz:
  
  npm install azure-maps-rest
  
  Pak přidejte odkaz na skript do <head> prvku souboru:
```
<script src="node_modules/azure-maps-rest/dist/atlas-service.min.js"></script>
```

Vytvořte kanál ověřování. Aby bylo možné inicializovat koncový bod klienta adresy URL služby, musí být kanál vytvořen. pomocí vlastního klíče účtu Azure Maps nebo přihlašovacích údajů Azure Active Directory (Azure AD) můžete ověřit klienta služby Azure Maps Search. V tomto příkladu se vytvoří klient URL vyhledávací služby.

Pokud pro ověřování používáte klíč předplatného:

// Get an Azure Maps key at https://azure.com/maps.
var subscriptionKey = '<Your Azure Maps Key>';

// Use SubscriptionKeyCredential with a subscription key.
var subscriptionKeyCredential = new atlas.service.SubscriptionKeyCredential(subscriptionKey);

// Use subscriptionKeyCredential to create a pipeline.
var pipeline = atlas.service.MapsURL.newPipeline(subscriptionKeyCredential, {
  retryOptions: { maxTries: 4 } // Retry options
});

// Create an instance of the SearchURL client.
var searchURL = new atlas.service.SearchURL(pipeline);

Pokud používáte službu Azure AD k ověřování:

// Enter your Azure AD client ID.
var clientId = "<Your Azure Active Directory Client Id>";

// Use TokenCredential with OAuth token (Azure AD or Anonymous).
var aadToken = await getAadToken();
var tokenCredential = new atlas.service.TokenCredential(clientId, aadToken);

// Create a repeating time-out that will renew the Azure AD token.
// This time-out must be cleared when the TokenCredential object is no longer needed.
// If the time-out is not cleared, the memory used by the TokenCredential will never be reclaimed.
var renewToken = async () => {
  try {
    console.log("Renewing token");
    var token = await getAadToken();
    tokenCredential.token = token;
    tokenRenewalTimer = setTimeout(renewToken, getExpiration(token));
  } catch (error) {
    console.log("Caught error when renewing token");
    clearTimeout(tokenRenewalTimer);
    throw error;
  }
}
tokenRenewalTimer = setTimeout(renewToken, getExpiration(aadToken));

// Use tokenCredential to create a pipeline.
var pipeline = atlas.service.MapsURL.newPipeline(tokenCredential, {
  retryOptions: { maxTries: 4 } // Retry options
});

// Create an instance of the SearchURL client.
var searchURL = new atlas.service.SearchURL(pipeline);

function getAadToken() {
  // Use the signed-in auth context to get a token.
  return new Promise((resolve, reject) => {
    // The resource should always be https://atlas.microsoft.com/.
    const resource = "https://atlas.microsoft.com/";
    authContext.acquireToken(resource, (error, token) => {
      if (error) {
        reject(error);
      } else {
        resolve(token);
      }
    });
  })
}

function getExpiration(jwtToken) {
  // Decode the JSON Web Token (JWT) to get the expiration time stamp.
  const json = atob(jwtToken.split(".")[1]);
  const decode = JSON.parse(json);

  // Return the milliseconds remaining until the token must be renewed.
  // Reduce the time until renewal by 5 minutes to avoid using an expired token.
  // The exp property is the time stamp of the expiration, in seconds.
  const renewSkew = 300000;
  return (1000 * decode.exp) - Date.now() - renewSkew;
}

Další informace najdete v tématu ověřování pomocí Azure Maps.

následující kód používá nově vytvořený klient adresy URL služby Azure Maps Search k obnově kódu adresy: "1 Microsoft Way, Redmond, WA". Kód používá searchAddress funkci a zobrazí výsledky jako tabulku v těle stránky.

// Search for "1 microsoft way, redmond, wa".
searchURL.searchAddress(atlas.service.Aborter.timeout(10000), '1 microsoft way, redmond, wa')
  .then(response => {
    var html = [];

    // Display the total results.
    html.push('Total results: ', response.summary.numResults, '<br/><br/>');

    // Create a table of the results.
    html.push('<table><tr><td></td><td>Result</td><td>Latitude</td><td>Longitude</td></tr>');

    for(var i=0;i<response.results.length;i++){
      html.push('<tr><td>', (i+1), '.</td><td>', 
        response.results[i].address.freeformAddress, 
        '</td><td>', 
        response.results[i].position.lat,
        '</td><td>', 
        response.results[i].position.lon,
        '</td></tr>');
    }

    html.push('</table>');

    // Add the resulting HTML to the body of the page.
    document.body.innerHTML = html.join('');
});

Tady je celý běžící ukázka kódu:

Podpora cloudu Azure Government

sada Azure Maps Web SDK podporuje cloud Azure Government. všechny adresy url javascriptu a CSS použité pro přístup k sadě Azure Maps Web SDK zůstávají stejné, ale následující úlohy se musí udělat pro připojení k Azure Government cloudové verzi Azure Maps platformy.

Při použití interaktivního ovládacího prvku mapy přidejte následující řádek kódu před vytvořením instance Map třídy.

atlas.setDomain('atlas.azure.us');

při ověřování map a služeb nezapomeňte použít podrobnosti ověřování Azure Maps z Azure Government cloudové platformy.

Při použití modulu služeb musí být při vytváření instance koncového bodu adresy URL rozhraní API nastavena doména pro služby. Například následující kód vytvoří instanci SearchURL třídy a odkazuje na doménu na cloud Azure Government.

var searchURL = new atlas.service.SearchURL(pipeline, 'atlas.azure.us');

pokud máte přímý přístup ke službě Azure Maps REST, změňte doménu adresy URL na atlas.azure.us . Pokud například používáte službu rozhraní API pro hledání, změňte doménu adresy URL z https://atlas.microsoft.com/search/ na https://atlas.azure.us/search/ .

Další kroky

Další informace o třídách a metodách, které se používají v tomto článku:

MapsURL

SearchURL

RouteURL

SubscriptionKeyCredential

TokenCredential

Další ukázky kódu, které používají modul služby, najdete v těchto článcích:

Zobrazit výsledky hledání na mapě

Získání informací ze souřadnice

Zobrazení pokynů pro trasu z A do B

použití modulu služby Azure Maps services

Ohodnoťte vaše zkušenosti

Použití modulu služby na webové stránce

Podpora cloudu Azure Government

Další kroky