412 },
413 {
414 "id": napId,
415 "title": "Take a nap"
416 }
463 },
464 {
465 "id": napId,
466 "title": "Take a nap"
467 }
1async function getInstantSchema(instantAppId: string, instantAdminToken: string) {
2 const response = await fetch("https://api.instantdb.com/admin/schema", {
3 method: "GET",
4 headers: {
1export default async function(req: Request) {
2 const data = await fetch("https://api.fetch.tools/status");
3 const status = await data.json();
4
1# API Wrapper
2
3The following is an example of wrapping the use of an API in a small backend function. This pattern is useful for preparing data before using in Framer, and is used in the Fetch tutorial video. It follows the pattern of calling a source API, parsing the data, setting up the CORS headers, and then responding with data.
1# Framer Fetch: Basic
2
3A basic example of an API endpoint to use with Framer Fetch.
8Fork this val and change the following:
9- `username` = your Last.fm username
10- Add your Last.fm API key to your [environment variables](https://www.val.town/settings/environment-variables), name it `LASTFM_API_KEY`
11 - You can get your Last.fm API key through [this form](https://www.last.fm/api/account/create), it seems like it gets auto-approved.
12
13This will return the most recent track you have been listening to, along with the artist and artwork.
16You can easily plug this into your Framer website through [Framer Fetch](https://www.framer.com/developers/fetch/introduction).
17
18You can get the API url of your val by clicking `Copy` > `Copy HTTP Endpoint` on the right side bar.
19
20For example, my HTTP endpoint is: `https://charmaine-listeningtolastfm.web.val.run`
6 headers.set("Access-Control-Allow-Headers", "Content-Type");
7
8 // Customize username and API key
9 const username = "YOUR_USERNAME_HERE";
10 const apiKey = Deno.env.get("LASTFM_API_KEY");
11 if (!apiKey) return new Response("Missing API key", { status: 500 });
12
13 const url =
14 `http://ws.audioscrobbler.com/2.0/?method=user.getrecenttracks&user=${username}&api_key=${apiKey}&format=json`;
15
16 const resp = await fetch(url);
1# Framer Fetch: Basic
2
3A basic example of an API endpoint to use with Framer Fetch.
6 headers.set("Access-Control-Allow-Headers", "Content-Type");
7
8 // Customize username and API key
9 const username = "YOUR_USERNAME_HERE";
10 const apiKey = Deno.env.get("LASTFM_API_KEY");
11 if (!apiKey) return new Response("Missing API key", { status: 500 });
12
13 const url =
14 `http://ws.audioscrobbler.com/2.0/?method=user.getrecenttracks&user=${username}&api_key=${apiKey}&format=json`;
15
16 const resp = await fetch(url);
191
192 try {
193 const response = await fetch("/api/models");
194 if (!response.ok) throw new Error("Failed to fetch models");
195 const data = await response.json();
335 }
336
337 if (req.url.endsWith("/api/models")) {
338 // Initialize providers
339 const providers = [
