Hi all - site is here.
Login with zakum690@gmail.com and test12345 as the password - it’s a test account I’ve created.
The try app temporarily doesn’t work.
I’ve got 3 netlify functions for 3 supermarkets, 2/3 work. I’m having issues with ‘Woolworths’.
When I test the “search” locally with netlify dev, then it works fine - I can see results:
However once deployed, it’s getting stuck here (I think):
Which matches this console.log here:
This is from the browser:
I’m not sure what’s blocking it & it’s definitely not taking 10 real seconds as it takes less than 1 second locally with netlify dev & also it’s pretty much instant with netlify dev --geo=mock
I’ve also tested the fetch URL with postman and it’s working fine - as long as you enter the 2 headers from the screenshot.
Before creating netlify functions, I had to run an express server locally for that domain as I got blocked by cors - but when deployed this solved it on the frontend with redirects:
[[redirects]]
force = true
from = “proxy/*”
status = 200
to = “https://www.woolworths.co.nz/:splat”
const production = process.env.NODE_ENV === “production”;
export const proxy = () => {
return production ? “proxy/” : “http://localhost:3000/”;
};
Then previously I called it like this:
const url =
${proxy()}api/v1/products?target=search&search=${searchTerm.toLowerCase()}&inStockProductsOnly=false&size=48;`
This is what my server.js used to look like to get around cors issues:
// server.js
import express from "express";
import { createProxyMiddleware } from "http-proxy-middleware";
import cors from "cors";
const app = express();
app.use(
cors({
credentials: true,
origin: "http://localhost:5173",
})
);
// Configure the proxy middleware
app.use(
createProxyMiddleware({
target: "https://www.woolworths.co.nz/", // The target API server you want to proxy to
changeOrigin: true, // Modify the Origin header for CORS
// pathRewrite: {
// "^/woolies": "", // Optional: rewrite path to remove /api if needed
// },
cookieDomainRewrite: {
// Ensure cookies are correctly set when proxying
"*": "", // Allows cookies to work across domains
},
onProxyReq: (proxyReq, req, res) => {
// You can manipulate the request here if needed (headers, etc.)
proxyReq.setHeader("User-Agent", "nala bananas");
proxyReq.setHeader("x-requested-with", "OnlineShopping.WebApp");
proxyReq.setHeader("accept", "application/json, text/plain, */*");
proxyReq.setHeader("accept-language", "en-US,en;q=0.9");
proxyReq.setHeader("cache-control"), "no-cache";
proxyReq.setHeader("content-type"), "application/json";
proxyReq.setHeader("expires", "Sat, 01 Jan 2000 00:00:00 GMT");
},
onProxyRes: (proxyRes, req, res) => {
const allowedOrigin = "http://localhost:5173";
proxyRes.headers["Access-Control-Allow-Origin"] = allowedOrigin;
proxyRes.headers["Access-Control-Allow-Credentials"] = "true";
proxyRes.headers["Access-Control-Allow-Methods"] = "GET,PUT"; // Allow methods
proxyRes.headers["Access-Control-Allow-Headers"] =
"Content-Type, Authorization"; // Allow custom headers
},
})
);
// // Basic route to test the server is running
app.get("/", (req, res) => {
res.send("Proxy Server is running!");
});
// Start the Express server
const PORT = 3000;
app.listen(PORT, () => {
console.log(`Proxy server is running on http://localhost:${PORT}`);
});
However I’m not getting cors issues anymore since it’s run on a server now, hence why I changed it back to the actual URL instead of proxy()
I’m using netlify/functions as my functions directory. I’ve temporarily removed my rewrite rules from netlify.toml just to see if that might have blocked it, but no luck. I’ve also tried the node-fetch package but getting the same problem. Like I said it works 100% locally & have verified I’m on node 20.11.0 which matches:
Build settings if it helps too ("build-only": "vite build")
