StackEdit Github 연동 에러 해소

문제상황

평소 업무일지를 markdown 문서로 작성하고 있는데, md 편집툴로 StackEdit 을 사용하고 있다.

그러나 어느 시점부터 새로운 Github repo를 StackEdit 워크스페이스에 등록하려고 하면 Github 권한을 가져오는 중 404 에러를 띄우게 되었다.

원인

이는 StackEdit이 deprecated된 Github API로 권한을 가져오려하기 때문에 발생하는 문제로, access_token을 쿼리 스트링에 추가하면 해소된다. (Github 가이드라인)

이에 대한 PR과 issue가 오픈되어 있는데, 아직 배포 버전에는 적용되지 않은 상태이다.

해결방안

Github repo를 워크스페이스로 등록할 시 위와 같은 창이 뜨는데, 이때 f12 로 개발자 도구를 열어 콘솔에 아래 스크립트를 실행한다.

window.XMLHttpRequest =  class MyXMLHttpRequest extends window.XMLHttpRequest {
  open(...args){
    if(args[1].startsWith("https://api.github.com/user?access_token=")) {
      // apply fix as described by github
      // https://developer.github.com/changes/2020-02-10-deprecating-auth-through-query-param/#changes-to-make
  
      const segments = args[1].split("?");
      args[1] = segments[0]; // remove query params from url
      const token = segments[1].split("=")[1]; // save the token
      
      const ret = super.open(...args);
      
      this.setRequestHeader("Authorization", `token ${token}`); // set required header
      
      return ret;
    }
    else {
      return super.open(...args);
    }
  }
}

스크립트 실행 후 OK 버튼을 누르면 Github 권한 요청이 정상적으로 전송되고, 워크스페이스 등록이 완료된다.