I have an error in cors, I have 2 applications, the first application will fetch data, and the 2nd application becomes a server where I create an api, in application 1 I try to access data from application 2, but it is blocked by cors, I have done several ways such as middleware, here is the code:

import { NextResponse } from "next/server";

export function middleware() {
  // «console. log (req.nexturl);
  const res = NextResponse.next();
  res.headers.append('Access-Control-Allow-Credentials', "true")
  res.headers.append('Access-Control-Allow-Origin', 'http://localhost:3000')
  res.headers.append("Access-Control-Allow-Methods", "GET, DELETE, PATCH, POST, PUT")
  res.headers.append(
    'Access-Control-Allow-Headers',
    'X-CSRF-Token, X-Requested-With, Accept, Accept-Version, Content-Length, Content-MD5, Content-Type, Date, X-Api-Version'
  )
  return res
}
export const config = {
  matcher: ['/api/:path*']
}

Please Help