Can Persian queries cause errors in Reactjs & Nextjs when using Fetch/Axios?

I am a next.js developer.

I have a blog and want to search a keyword in title of my posts.

this is part of my code.

const [result, setresult] = useState([]);
const [keyword, setkeyword] = useState(url.keyword ? `&keyword=${url.keyword}` : "");

  useEffect(() => {

      axios
         .get(
            `https://example.com/api/search-posts?${keyword}`
         )
         .then((d) => {
            setresult(d.data.allPosts);
         })
         .catch((e) => console.log("error"));


   }, [pn, keyword]);

the problem is :

Failed to fetch RSC payload. Falling back to browser navigation. TypeError: Failed to execute ‘fetch’ on ‘Window’: Failed to read the ‘headers’ property from ‘RequestInit’: String contains non ISO-8859-1 code point

the backend url is like this: https://example.com/api/search-posts?keyword=mobile

if I search a English keyword, I have no error but in Persian( like موبایل), This error happens.

thanks…

this error makes the page be refreshed infinite.