GitHubのIssue, PRへのファイル添付は別リポジトリのものとして扱える

目次

別リポジトリのものとして扱えると何が嬉しいのか

GitHubのIssueやPRのエディタはファイルを添付すると自動でURLが生成される機能があるが、リポジトリがプライベートな場合このURLにはアクセス権が必要になる。

参照: ファイルのアタッチ - GitHub Docs

そして、このブログはプライベートリポジトリのIssueで記事を管理しているため、ファイルをそのまま添付すると閲覧できなくなる。 別のパブリックリポジトリでURLを取得し、それをコピペする方法はあるが、この作業は無くせるならその方が良い。

どのようにするのか

めちゃくちゃ簡単で、画像に示すdata-upload-repository-idの値を書き換えるだけで良い。

スクリーンショット 2024-10-20 21 35 47

これにより、ファイルのアップロード時に呼ばれる関数が書き換えた値を取得してくれる。

function policyForm(attachment: Attachment, container: Element): FormData {
  const token = container.querySelector<HTMLInputElement>('.js-data-upload-policy-url-csrf')!.value
  const repoId = container.getAttribute('data-upload-repository-id')
  ...

この関数とアップロード処理の全貌は、ブラウザの開発者ツールからgithub.githubassets.com/assets/app/assets/modules/github/upload/batch-upload.tsと辿っていく事で確認出来る。

注意

data-upload-repository-idに指定する値は存在するリポジトリのidであれば何でも良いが、まぁUIでは想定されていない事をするわけだし何かあると困るので自分が管理しているリポジトリのものにするべきだろう。

また、ソースコードからも分かるようにこの値はアップロード時に参照されるコンテナ要素毎にそれぞれ設定する必要がある。


方法は分かったしやる事も割と簡単なのでやる気があればブラウザ拡張機能なりにしようと思う。

拡張機能にした

https://github.com/waonpad/gh-issue-upload-file-to-diff-repo

keydownイベント数年ぶりに使った気がする。 元サイトにDOMを挿入してボタン作ったりすると一気に面倒になるのでこういうのはキーボードショートカットでいいね。