Docs

Verify emails in Vue

Vue runs in the browser, so it must call an endpoint on your own server rather than ValidReach directly. The API key stays on your server; the browser only talks to your own endpoint.

Before you start

Create an API key under Settings → API keys and keep it in an environment variable named VALIDREACH_API_KEY on your server. Never ship it in browser or mobile code.

Example

<script setup>
import { ref } from 'vue';

const email = ref('');
const message = ref('');

async function check() {
  const res = await fetch('/api/verify', {
    method: 'POST',
    headers: { 'Content-Type': 'application/json' },
    body: JSON.stringify({ email: email.value }),
  });
  const { status } = await res.json();
  message.value =
    status === 'invalid' || status === 'disposable'
      ? 'Please check this address.'
      : '';
}
</script>

<template>
  <input v-model="email" type="email" @blur="check" />
  <p role="alert">{{ message }}</p>
</template>

Handle the result

Branch on data.status. Treat invalid and disposable as rejections, retry unknown later when retryable is true (unknown is not billed), and decide on catchall, risky and role by your own policy. HTTP 402 means out of credits and 429 means rate limited.