Cors preflight put api gateway

Bit strange to get " access to fetch URL blocked by cors preflight etc..." because the PUT request works for me in postman but i only get that error when i try to upload in react js . Here is my code above.

I get another error by the way "

<pre>error TypeError: Failed to fetch
    at Upload (Upload.js:28:1)

import axios from 'axios';
  
import React,{Component} from 'react';
import { useState } from 'react';
  
export default function Upload(){


const [data,setData] = useState()

if (data) {
  const file = (data.target.files[0])
console.log(file)
const myHeaders = new Headers();
myHeaders.append("Content-Type", "image/jpeg");
const formdata = new FormData();

formdata.append('File', file);


const requestOptions = {
  method: 'PUT',
  headers: myHeaders,
  body: formdata,
  redirectXXX: 'manual'
};

fetch("https://XXXX.execute-api.us-east-1.amazonaws.com/prod/XXXX/IMG_0733.jpg", requestOptions)
  .then(response => response.text())
  .then(result => console.log(result))
  .catch(error => console.log('error', error));

}




return (
  <div>
    <form>
        <input type="file" onChange={(e) => setData(e)}/>


    </form>




  </div>



)





}

expecting upload to put into API same way the postman does it.,