How to add postcode lookup to a website

Step 1 — How do I get an API key?

Create a free account and generate an API key from your dashboard. No card is required to start, and the same key works across the postcode lookup API and autocomplete endpoints.

Step 2 — How do I call the lookup endpoint?

Make a single authenticated GET request with the postcode. Proxy it through your backend so your key stays secret:

// server-side handler
const res = await fetch(
  "https://api.autopostcode.com/v1/lookup?postcode=" + encodeURIComponent(postcode),
  { headers: { Authorization: "Bearer " + process.env.AUTOPOSTCODE_KEY } }
);
const { addresses } = await res.json();
// addresses: [{ line1, line2, town, postcode, uprn }, ...]

Step 3 — How do I render the results?

Drop a postcode field and a results dropdown into your form and populate it from the response:

<label>Postcode <input id="pc" /></label>
<button id="find">Find address</button>
<select id="results"></select>

<script>
document.getElementById("find").onclick = async () => {
  const pc = document.getElementById("pc").value;
  const r = await fetch("/api/lookup?postcode=" + encodeURIComponent(pc));
  const { addresses } = await r.json();
  const sel = document.getElementById("results");
  sel.innerHTML = addresses
    .map(a => "<option>" + a.line1 + ", " + a.town + ", " + a.postcode + "</option>")
    .join("");
};
</script>

Should I use lookup or autocomplete?

For the second pattern, follow the JavaScript autocomplete tutorial, or start with the API quickstart.

A UK-first, affordable alternative

AutoPostcode uses the same Royal Mail PAF data as Loqate, Fetchify and Ideal Postcodes, with a developer-friendly REST API and clearer pricing.