Skip to main content

​
Overview

Lovable is an AI app builder that generates full-stack React applications. You can integrate ChatAds by giving Lovable a prompt — it will create a server-side function to proxy API calls and wire up the frontend automatically.
No SDK install needed. Lovable handles the backend and frontend code generation from the prompt below.

​
Setup

​
Step 1: Set Up ChatAds

  1. Create a ChatAds account and upload your Amazon Affiliate Associates ID (ChatAds is Amazon-only right now)
  2. Go to app.getchatads.com/api/keys and create an API key. Call it “Lovable” to keep track of it

​
Step 2: Configure Lovable

  1. Enable Cloud on your Lovable project
  2. Go to the Cloud setting in Lovable and add your ChatAds key as a Secret called CHATADS_API_KEY

​
Step 3: Prompt Lovable

Copy and paste the prompt below into Lovable’s chat:

​
Lovable Prompt

Add ChatAds affiliate link monetization to this app.

ChatAds is an API that finds Amazon affiliate links for product mentions
in text. I send it a message, and it returns affiliate offers I can use
to replace product names with clickable links.

What I need:

1. A server-side function called "chatads-proxy" that:
   - Accepts POST with { "message": "string" } in the body
   - Calls POST https://api.getchatads.com/v1/chatads/messages
   - Sends these headers:
       Content-Type: application/json
       x-api-key: (use the CHATADS_API_KEY secret)
   - Request body: { "message": "<the message string>" }
   - Returns the JSON response to the frontend
   - Handles CORS for the frontend origin

2. The API response looks like this:
   {
     "data": {
       "status": "filled",
       "offers": [
         {
           "link_text": "noise-cancelling headphones",
           "url": "https://www.amazon.com/dp/B0XXXXXXXXX?tag=chatads-20",
           "product": {
             "title": "Sony WH-1000XM5 Wireless Headphones",
             "stars": 4.5,
             "reviews": 12340
           }
         }
       ],
       "returned": 1
     },
     "error": null
   }

3. Enable ChatAds as part of the chat flow:
   - After the AI generates a response but before sending it to the
     user, call chatads-proxy with the AI's response text as the message
   - If data.returned > 0, loop through data.offers and find each
     offer's link_text in the AI response, then wrap it in an anchor
     tag using the offer's url (target="_blank")
   - If data.returned is 0 or error is not null, use the original
     AI response unchanged
   - Send the final response (with or without links) to the user

​
How It Works

The prompt creates a two-part integration:
  1. Server-side function (chatads-proxy) — Calls the ChatAds API with your key. Your key stays on the server and never reaches the browser.
  2. Chat flow integration — After the AI generates a response, the app calls the proxy with the response text. If ChatAds finds product mentions, it inserts affiliate links into the text before the message is sent to the user.

​
Troubleshooting

​
401 Unauthorized errors

The API key isn’t reaching the ChatAds API. Ask Lovable: 
Show me the chatads-proxy function code so I can verify the API key
is being sent correctly in the x-api-key header.

​
CORS errors

If the frontend can’t call the function, ask Lovable: 
The chatads-proxy function is returning CORS errors. Make sure it
handles OPTIONS preflight requests and returns the correct CORS headers
for my frontend origin.
  1. Test your message in the API Explorer first to confirm it returns offers
  2. Check the browser console for errors from the function call
  3. Verify the frontend is checking data.returned > 0 before replacing text

​
Response Reference

FieldTypeDescription
data.statusstring"filled" if offers found, "empty" otherwise
data.returnednumberNumber of offers returned
data.offers[].link_textstringText to match in the original message
data.offers[].urlstringAffiliate link URL
data.offers[].product.titlestringProduct name
data.offers[].product.starsnumberProduct rating (0-5)
data.offers[].product.reviewsnumberReview count
See the full API Reference for all available parameters and response fields.

​
Best Practices

Keep keys server-side

The server-side function keeps your API key off the browser. Never put it directly in frontend code.

Don't block rendering

Show content immediately and update with affiliate links when the API responds. Users shouldn’t wait for ChatAds.

Handle empty gracefully

Not every message will have affiliate matches. Always check data.returned > 0 before modifying text.

Test in API Explorer

Verify your messages return offers in the API Explorer before debugging Lovable code.