Skip to content
Visit Workers on GitHub
Set theme to dark (⇧+D)

Geolocation: Weather App

Fetch weather data from an API using the user's geolocation data.

addEventListener('fetch', event => {  event.respondWith(handleRequest(event.request))})
async function handleRequest(request) {  let endpoint = ""  const token = "" //Use a token from  let html_style = `body{padding:6em; font-family: sans-serif;} h1{color:#f6821f}`    let html_content = "<h1>Weather 🌦</h1>"
  latitude =  longitude =  endpoint+= `${latitude};${longitude}/?token=${token}`  const init = {    headers: {      "content-type": "application/json;charset=UTF-8",    },  }
  const response = await fetch(endpoint,init)  const content = await response.json()
  html_content += `<p>This is a demo using Workers geolocation data. </p>`  html_content += `You are located at: ${latitude},${longitude}.</p>`  html_content += `<p>Based off sensor data from <a href="${}">${}</a>:</p>`  html_content += `<p>The AQI level is: ${}.</p>`  html_content += `<p>The N02 level is: ${}.</p>`  html_content += `<p>The O3 level is: ${}.</p>`  html_content += `<p>The temperature is: ${}°C.</p>`
  let html = `<!DOCTYPE html><head>  <title>Geolocation: Weather</title></head><body>  <style>${html_style}</style>  <div id="container">  ${html_content}  </div></body>`
  return new Response(html, {    headers: {      "content-type": "text/html;charset=UTF-8",    },})}