I am facing an issue with integrating paystack into my ecommerce website. Despite troubleshooting extensively, I cannot locate the source of the errors that are occurring. The integration of other payment platforms is successful, but paystack is causing problems.
It is crucial for paystack to function correctly on this ecommerce site, especially since it caters mainly to clients in Nigeria who use local cards for payments. While the onSuccess component works fine with the paystack-public-key setup, the order database does not update to reflect a successful payment. Instead, it returns a 404 error with the headers:
Request URL: http://localhost:3000/api/order/6626ea44b7683aa864d92837/pay
Request Method: PUT
Status Code: 404 Not Found
The same payment method worked flawlessly in a single-page reactjs ecommerce project, so I am puzzled as to why it is encountering issues in this nextjs project. Below are the relevant code pages associated with this problem. Kindly review them and offer assistance - thank you.
/pages/order/[id].js
import styles from "@/styles/order.module.scss";
import Header from "@/components/header";
import Order from "@/models/Order";
import User from "@/models/user";
import { IoIosArrowForward } from "react-icons/io";
import db from "@/utils/db";
...
/pages/api/order/[id].js
import nc from "next-connect";
import auth from "@/middleware/auth";
import Order from "@/models/Order";
import db from "@/utils/db";
import User from "@/models/user";
...
export default handler;
/models/Order.js
import mongoose from "mongoose";
const { ObjectId } = mongoose.Schema;
const orderSchema = new mongoose.Schema(
{
user: {
type: ObjectId,
ref: "User",
required: true,
},
products: [
...
],
...
},
{
timestamps: true,
}
);
const Order = mongoose.models.Order || mongoose.model("Order", orderSchema);
export default Order;