Skift dawa-autocomplete2 ud

Skiftet

1. 1

   Skift pakken

   Fjern den gamle pakke og installér den nye.

   bashKopiér

   npm uninstall dawa-autocomplete2
   npm install @grundfast/dawa-autocomplete

2. 2

   Opret en offentlig nøgle

   Feltet kalder Grundfast direkte fra browseren, så det bruger en offentlig nøgle (gf_pub_live_…). Opret den under Nøgler i dashboardet: vælg Offentlig og skriv de domæner, feltet skal virke på, fx butik.dk, www.butik.dk og localhost:5173. Byg og test med en offentlig testnøgle (gf_pub_test_), som aldrig faktureres.

3. 3

   Ret importen og giv feltet nøglen

   Det er de to linjer, der ændrer sig. select, adgangsadresserOnly, params og de andre indstillinger bliver stående.

import { dawaAutocomplete } from 'dawa-autocomplete2';

dawaAutocomplete(document.getElementById('adresse'), {
  select: function (valgt) {
    gemAdresse(valgt.tekst, valgt.data.id);
  },
});

import { dawaAutocomplete } from '@grundfast/dawa-autocomplete';

dawaAutocomplete(document.getElementById('adresse'), {
  apiKey: 'gf_pub_live_...',
  select: function (valgt) {
    gemAdresse(valgt.tekst, valgt.data.id);
  },
});

Bruger du require, er det det samme: require('@grundfast/dawa-autocomplete').dawaAutocomplete. Kan du ikke sætte nøglen i koden, kan den stå på feltet som data-grundfast-key="gf_pub_live_...".

Med et script-tag

Indlæste du widgetten fra et CDN, så skift de to URL’er. Den globale dawaAutocomplete.dawaAutocomplete(...) er den samme som før.

<script src=".../dawa-autocomplete2/1.0.2/dawa-autocomplete2.min.js"></script>
<script>
  dawaAutocomplete.dawaAutocomplete(document.getElementById('adresse'), {
    select: function (valgt) { console.log(valgt.tekst); }
  });
</script>

@1 i URL’en giver dig rettelser i version 1 automatisk. Vil du låse en bestemt version, så skriv den fulde, fx @1.0.0.

Det, der er det samme

• Funktionen og det, den returnerer. dawaAutocomplete(input, options) giver et objekt med selected(), id(uuid) og destroy().
• Indstillingerne. select, adgangsadresserOnly, type, params, minLength, multiline, id, debounce, fuzzy, supplerendebynavn, stormodtagerpostnumre, retryDelay, render og baseUrl. params sendes med som før, fx { kommunekode: '101' } eller { postnr: '8000' }.
• Forløbet. Vejnavn, så husnummer, så etage og dør — med markøren der, hvor næste del af adressen skal skrives, og piletaster, Enter og Tab som før.
• Markup og klasser. ul.dawa-autocomplete-suggestions, li.dawa-autocomplete-suggestion og dawa-selected på den markerede. Dit eget stylesheet virker uændret. Har du brugt pakkens, så importér @grundfast/dawa-autocomplete/css — den gamle sti dist/css/dawa-autocomplete2.css findes også.

Det, select får

select får forslaget, præcis som API’et sender det, i samme form som før: type, tekst, forslagstekst, caretpos og adressen i data.

{
  "type": "adresse",
  "tekst": "Jægersborggade 10, st. tv, 2200 København N",
  "forslagstekst": "Jægersborggade 10, st. tv\n2200 København N",
  "caretpos": 43,
  "stormodtagerpostnr": false,
  "data": {
1    "id": "0a3f509f-1325-32b8-e044-0003ba298018",
    "status": 1,
    "darstatus": 3,
    "vejkode": "3472",
    "vejnavn": "Jægersborggade",
    "adresseringsvejnavn": "Jægersborggade",
    "husnr": "10",
    "etage": "st",
    "dør": "tv",
    "supplerendebynavn": null,
    "postnr": "2200",
    "postnrnavn": "København N",
    "stormodtagerpostnr": null,
    "stormodtagerpostnrnavn": null,
    "kommunekode": "0101",
    "adgangsadresseid": "0a3f507a-a100-32b8-e044-0003ba298018",
3    "x": 12.5449906,
3    "y": 55.6921031,
2    "href": "https://api.grundfast.dk/dawa/adresser/0a3f509f-1325-32b8-e044-0003ba298018"
  }
}

Nogle felter kan ikke længere udfyldes efter DAWA og er altid null. Hvilke, står i DAWA efter DAWA.

Det, der er nyt

• apiKey — den offentlige nøgle. Den sendes som ?token= på et almindeligt GET, så browseren ikke laver et CORS-preflight først.
• En baseUrl, der stadig peger på DAWA, bliver skiftet til Grundfast, og konsollen siger det. Peger den på din egen proxy, bruges den som før.
• En indstilling, pakken ikke kender, giver én advarsel i konsollen og ignoreres — feltet virker stadig.
• En afvist nøgle prøves ikke igen. Konsollen får API’ets begrundelse én gang, og listen forbliver tom, så kunden kan skrive adressen i hånden. Fejl på serveren og 429 prøves igen efter retryDelay, højst tre gange.
• Skærmlæsere. Feltet får role="combobox", aria-expanded og aria-activedescendant, og Escape lukker listen.

Hvad koster det?

Hvert opslag er ét kald på din konto, ligesom alle andre kald — se priserne. Feltet spørger først fra to tegn (minLength), og mens ét opslag kører, venter kun det nyeste tastetryk, så hurtig tastning ikke giver et kald pr. tegn. Vil du spare flere kald, så sæt debounce, fx 150. En offentlig nøgle har desuden en grænse på 120 kald i minuttet pr. besøgende.

Hvis der ikke kommer forslag

Åbn browserens konsol. Pakken skriver en linje, der begynder med [@grundfast/dawa-autocomplete], med årsagen. Du kan også prøve nøglen fra en terminal — kaldet er det samme, feltet laver, og Origin er dit domæne:

curl -G "https://api.grundfast.dk/dawa/autocomplete" \
  --data-urlencode "q=Jægersborggade 10" \
  --data-urlencode "token=$GRUNDFAST_PUBLIC_KEY" \
  -H "Origin: https://butik.dk"

• no apiKey — feltet fik ingen nøgle. Sæt apiKey eller data-grundfast-key.
• 403 … origin … is not allowed — domænet står ikke på nøglen. Ret listen i dashboardet; det slår igennem inden for et halvt minut. Reglerne for www, underdomæner og porte står under Offentlige nøgler.
• SECRET key — du har brugt en hemmelig nøgle (gf_live_). Den kan alle læse i sidens kildekode, så tilbagekald den og opret en offentlig.

Kalder din server også DAWA direkte, så se Migrér fra DAWA: samme stier under https://api.grundfast.dk/dawa, med en hemmelig nøgle.