I understand that I need to set up an app proxy to make requests to my Postgres DB and for the app-extensions. However, I keep getting 404 errors for a bad URI - I’m not understanding how to do this properly.
All I want to do is post to Postgres (on Heroku) by making a frontend call to my API. The app-proxy config is attached below.
I’m trying to make an authenticaed call via useFetch() hook in merchant.tsx:
merchant.tsx:
const BASE_URL = "/apps/my-app-proxy";
const postBody = {
id: 1,
name: "Test",
account: "0x.....",
campaign_id: 1,
};
useFetch(`${BASE_URL}/api/merchant/`, {
headers: {
"Content-Type": "application.json",
"Access-Control-Allow-Origin": "*",
},
body: JSON.stringify(postBody),
method: "POST",
}).then((res) => {
console.log("POST merchant: ", res);
});
The useFetch response returns as a 404, so the URL is wrong.
The App proxy config I am using:
The endpoints in merchant.ts are NOT being hit. So how do I actually call the proxy url to reach my endpoints?
The files in the server folder are:
index.ts:
app.use("/api/merchant", merchantRouter);
merchant.ts:
import express from "express";
import { Merchant } from "../models/Models";
const router = express.Router();
// NOTE: These routes deal with all merchant requests
// TODO: connect database to shopify
// Authentication to prevent aanyone from calling
// or already done by shopify?
router.post("/", async (req, res) => {
try {
// TODO: check if merchant already exsits (shopify acc/email?)
console.log('MERCHANT ENDPOINT')
const merchant = req.body;
await Merchant.create(merchant);
res.json(merchant);
} catch (e) {
console.error('ERROR: ', e);
}
})
router.get("/", async (req, res) => {
try {
console.log('GET MERCHANTS called ', req)
const merchants = await Merchant.findAll();
res.json(merchants);
} catch (e) {
console.error("ERROR: ", e);
}
});
router.get("/:id", async (req, res) => {
try {
const id = req.params.id;
const merchant = await Merchant.findByPk(id);
res.json(merchant);
} catch (e) {
console.error("Error: ", e);
}
});
export default router;
