Cant see my product in website

I am having problems with my website as the products isn’t showing and I am using MongoDB and cloudinary for my website I tried using .env to connected to website but for some reason it still doesn’t work is there anyway for it to show and I already integrated it into MongoDB this is my first here please help me

1 Like

It looks like your database and backend are on a separate deployment than your main website? Is there any reason for this?

image

all of my database and backend codes are on a backend file while my frontend has it own folder

1 Like

It seems like you need to implement CORS: How can I enable CORS on Vercel?

1 Like

Sharing this resource too in case it’s helpful!

1 Like

Will that work because both my backend file and my frontend file are in the same repositiory but I only deployed the frontend.

so this is the one where everything is on there when I used output directory to the frontend file :https://nfl-website-beta.vercel.app

I tried that it still doesn’t work

I have tried it, it doesn’t work

Yes it wil work once you implement CORS.

It still didnt work this was the code for my frontend:

{
    "version": 2,
    "builds": [
        {
            "src": "package.json",
            "use": "@vercel/static-build",
            "config": {"distDir": "dist"}
        }
    ],
    "rewrites": [
        {"source": "/(.*)", "destination": "/"}
    ]
} and this was the code my backend file {
    "version": 2,
    "name": "backend",
    "builds": [
        {
            "src": "server.js",
            "use": "@vercel/node"
        }
    ],
    "routes": [
        {
            "src": "/(.*)",
            "dest": "server.js"
        }
    ],
    "headers": [
        {
            "source": "/api/(.*)",
            "headers": [
                { "key": "Access-Control-Allow-Credentials", "value": "true" },
                { "key": "Access-Control-Allow-Origin", "value": "*" },
                { "key": "Access-Control-Allow-Methods", "value": "GET,OPTIONS,PATCH,DELETE,POST,PUT" },
                { "key": "Access-Control-Allow-Headers", "value": "X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version" }
            ]
        }
    ]
}

Can you share the new deployment URL? I can see https://nfl-website-jbrw.vercel.app/ has still CORS header missing:

➜  ~ curl -I https://nfl-website-n1pb.vercel.app/
HTTP/2 404
cache-control: public, max-age=0, must-revalidate
content-type: text/plain; charset=utf-8
date: Sun, 20 Apr 2025 08:02:07 GMT
server: Vercel
strict-transport-security: max-age=63072000; includeSubDomains; preload
x-vercel-error: DEPLOYMENT_NOT_FOUND
x-vercel-id: bom1::2vk49-1745136127829-a86e90c2f8f9
content-length: 107

I dont have that project anymore there is only two that I have I tried redeploying both just now but now I have blank screen with a type error the only reason why I dont have it was simply to see which one works. so my the link is still https://nfl-website-t5dy.vercel.app and https://nfl-website-jbrw.vercel.app/ please help cause I dont know what to do

I can see that CORS headers are present now. Can you tell me what step I need to take to reproduce this issue?

1 Like

So basically started with new project then open root directory to frontend file then deploy it.

So I started with new project then open root directory to frontend file then deploy it.

Both of these deployment are accessible it seems: https://nfl-website-t5dy.vercel.app and https://nfl-website-jbrw.vercel.app/. Which route are you getting the error still?

1 Like

So my frontend is working fine in jbrw and t5dy but it mainly my backend file. I deployed my frontend but in inspect element everything seems to be working fine but none of the product items work or my login. I tried to deploy my reposority with my two files inside both frontend and backend. I can’t see anything in the beta. https://nfl-website-beta.vercel.app/

So my frontend is working fine in jbrw and t5dy but it mainly my backend file. I deployed my frontend but in inspect element everything seems to be working fine but none of the product items work or my login. I tried to deploy my reposority with my two files inside both frontend and backend. I can’t see anything in the beta. https://nfl-website-beta.vercel.app/

The website was working on my frontend until I have problem with the backend file I tried to redeploy it and now it not showing at all meaning that until I loaded the page it shows for a brief second then disappears

The expected result was suppose to be showing the frontend of the website and while also seeing items from my backend file (they are on two files frontend and backend). The backend file has mongoDB and cloudinary in them. When deploying it I used my repository to upload both my frontend (vite+react) and my backend

https://nfl-website-beta.vercel.app