API GitHub mengembalikan 422 Entiti Tidak Boleh Diproses apabila menghantar data

Question

Saya cuba menghantar fail ke repositori github saya melalui proses html tetapi ia gagal dengan ralat 422. Saya rasa nombor saya bagus, tetapi...tidak. Saya seorang pemula di bahagian ini dan saya tidak dapat mencari penyelesaian untuk masalah saya.

Dalam artikel ini: https://levelup.gitconnected.com/how-to-upload-images-to-github-via-javascript-59163b8fff27

Seseorang menulis tentang pembahagian data menggunakan base64 yang boleh menjadi trek tetapi saya tidak tahu cara mengekodnya dalam kes saya. Di bawah adalah percubaan dan kegagalan saya! ! !

// REACT
import React from "react"

export default function ApiGithubToken() {
  const load = e => {
    if(e.target !== null) {
      let files = e.target.files;
      if(files.length > 0) {
        if(files[0] !== null) {
          const git= {
            owner : 'knupel',
            repo: 'gatsby_react_lab',
            path: `media/test/`,
            token: process.env.GATSBY_TOKEN_GITHUB,
          }
          upload_file(git, files[0]);
        }
      }
    }
  }
  return (
    <div>
      <p>Sélectionner le fichier à déposer sur Github / Select your file to upload in Github</p>
      <input type="file" name="input" onChange={load}/>
      <br/>
      <br/>
      <button type="submit">CHARGEZ</button>
    </div>
  )
}

const upload_file = async (git: { owner: string; repo: string; path: string; token: string | undefined; }, data: any) => {
  const res = await fetch(`https://api.github.com/repos/${git.owner}/${git.repo}/contents/${git.path}`,
    {
      method: "PUT",
      headers: {
        Accept: "application/vnd.github+json",
        Authorization: `Bearer ${git.token}`
      },
      body: JSON.stringify({
        message: "Téléversement de votre fichier",
        content: data
        // content: data.split('base64,')[1]
        // content: data.content
      })
    }
  );
  return await res.json();
}

dan mesej ralat

Answer 1

Saya mengemas kini kod seperti yang anda cadangkan @AKX tetapi ralat yang dikembalikan adalah ralat yang sama 422

// REACT
import React from "react"
// APP
import Layout from "../../components/struct/layout"


export default function ApiGithubToken() {
  return (
    

      
      
      
Sélectionner le fichier à déposer sur Github / Select your file to upload in Github
       load(event)}/>
      

      

      CHARGEZ
    
  )
}

function load(event:any) {
  if(event !== undefined && event.target.type === "file") {
    const file =  event.target.files[0];
    console.log("file",file);
    const reader = new FileReader();

    if (file) {
      reader.readAsDataURL(file);
    }

    reader.addEventListener("load", () => {
      const git= {
        owner : 'knupel',
        repo: 'gatsby_react_lab',
        path: `media/test/`,
        token: process.env.GATSBY_TOKEN_GITHUB,
      }
      upload_file(git , reader.result);
    }, false);
  }
}

const upload_file = async (git: { owner: string; repo: string; path: string; token: string | undefined; }, data: any) => {
  let final_path = `https://api.github.com/repos/${git.owner}/${git.repo}/contents/${git.path}`;
  console.log("data", data);
  const res = await fetch(final_path,
    {
      method: "PUT",
      headers: {
        Accept: "application/vnd.github+json",
        Authorization: `Bearer ${git.token}`
      },
      body: JSON.stringify({
        message: "Téléversement de votre fichier",
        content: data,
        // content: data.split('base64,')[1]
        // content: data.content
      })
    }
  );
  return await res.json();
}


export const Head = () => {
    
        
        
        
    >
}

Bagus, sekarang dokumen dah diluluskan, saya percaya rasanya sedap