Penerangan: Setiap kali saya beralih daripada menggunakan localhost sebagai titik akhir API kepada URL langsung bahagian belakang sebenar, saya mendapat dua ralat dalam apl React saya. Berikut adalah ralat yang saya perolehi:

PATCH https://hobby-hunter-api.onrender.com/users/6488a0ab682e930dcd661111/64628638beaa4cc4aecd3a42 404 (Not Found) in Friend.jsx:25 `Uncaught TypeError: friends.find is not a function in Friend.jsx:22

Saya menggunakan MongoDB dan Node.js sebagai hujung belakang. Menghargai sebarang cerapan atau penyelesaian untuk menyelesaikan isu ini. Terima kasih!

Butiran tambahan: Jika sebarang maklumat tambahan atau coretan kod diperlukan untuk membantu mendiagnosis masalah, sila beritahu saya.

Kod komponen rakan:

import { PersonAddOutlined, PersonRemoveOutlined } from "@mui/icons-material"; import { Box, IconButton } from "@mui/material"; import { useDispatch, useSelector } from "react-redux"; import { useNavigate } from "react-router-dom"; import { setFriends } from "state"; import UserImage from "./UserImage"; const Friend = ({ friendId, name, userPicturePath }) => { const dispatch = useDispatch(); const navigate = useNavigate(); const { _id } = useSelector((state) => state.user); const token = useSelector((state) => state.token); const friends = useSelector((state) => state.user.friends); const isFriend = friends && friends.find((friend) => friend._id === friendId); // Check if the friend exists const patchFriend = async () => { const response = await fetch( `https://weblinkbackendapi.onrender.com/users/${_id}/${friendId}`, { method: "PATCH", headers: { Authorization: `Bearer ${token}`, "Content-Type": "application/json", }, } ); const data = await response.json(); dispatch(setFriends({ friends: data })); }; if (!Array.isArray(friends)) { return null; // Return null if friends is not an array } return (     { navigate(`/profile/${friendId}`); navigate(0); }} > 
 {name} 
    patchFriend()} sx={{ p: "0.05rem", fontSize: "0.25rem" }} > {isFriend ? (  ) : (  )}   ); }; export default Friend;