Skip to main content

How to fix the "missing header x-site-id" error when calling a Vercel API from Framer?

I have added my domain (www.imarcusnote.com) to the authorized list and I am sending the x-site-id header from my Framer site to my Vercel API, but I still get a 'Missing header x-site-id' error. Is there an issue with my App ID recognition?

1 comment

  • Duncan from Memberstack
    Duncan from Memberstack

    Hi Hamkwangcheon9,

    I took a look at your account and app setup for l-marcusnote (with some help from AI).

    To answer your question directly: There is no issue with your App ID recognition on Memberstack's end. Your App ID ( app_cmmm5k2i6007f0ttcejo13pcg ) is active, and your domains ( imarcusnote.com and www.imarcusnote.com ) are correctly added to your app's authorized list.

    The "Missing header x-site-id" error you are seeing is almost certainly happening between your Framer frontend and your Vercel API, or it's a CORS/formatting issue.

    Here is what you need to know to fix this:

    1. The Error is Originating from Your Vercel API

    Memberstack's public Admin APIs use X-API-KEY for authentication, not x-site-id. If your Vercel API requires x-site-id (perhaps to forward requests to Memberstack's internal APIs or to identify the app), your Vercel server is rejecting the request because it isn't receiving that header from your Framer site.

    2. Check Your CORS Configuration on Vercel

    If you are sending the header from Framer using fetch or axios, the browser might be stripping the custom x-site-id header before it reaches Vercel because of CORS (Cross-Origin Resource Sharing) policies.

    • Make sure your Vercel API's CORS settings explicitly allow this custom header. Your Vercel API response headers must include:

    Access-Control-Allow-Headers: x-site-id, Content-Type, Authorization

    3. Header Case Sensitivity

    If you are using Node.js on your Vercel backend, keep in mind that Node automatically converts all incoming HTTP headers to lowercase.

    • If your Vercel code is strictly looking for req.headers['X-Site-Id'] or req.headers['X-SITE-ID'], it will return undefined.
    • Make sure your backend code is looking for req.headers['x-site-id'].

    A Quick Note on Framer Support

    Please keep in mind that Framer is not officially supported by Memberstack. Because Framer is a closed ecosystem that doesn't natively support custom data attributes in the same way platforms like Webflow do, standard Memberstack features (like our pre-built modals and data attributes) will not work out-of-the-box.

    Next Steps: I recommend checking the Network tab in your browser's developer tools when you trigger the request from Framer. Look at the "Request Headers" for that specific API call to Vercel and verify if x-site-id: app_cmmm5k2i6007f0ttcejo13pcg is actually being attached and sent. If it's not there, the issue is in the Framer frontend fetch request.

    0

Please sign in to leave a comment.

Sitemap