Skip to content

Instantly share code, notes, and snippets.

@atomita
Last active December 25, 2024 10:45
Show Gist options
  • Save atomita/c1a46e6b6257b6569e1b369e0eb34c80 to your computer and use it in GitHub Desktop.
Save atomita/c1a46e6b6257b6569e1b369e0eb34c80 to your computer and use it in GitHub Desktop.
Snippet: Add Donwload Button to Item List at Qiita Team
const accessToken = '{{https://qiita.com/settings/applications で個人用アクセストークンを発行し書き換え}}';
const articleSelector = 'article'; //'.css-1505ldx';
const linkSelector = '.css-uk6woj';
[...document.querySelectorAll(articleSelector)].map(article => {
const link = article.querySelector(linkSelector);
link.style.position = 'relative'; // absoluteで覆っていてclickできないので
const api = link.href.split('/').map((v, i) => i == 3 ? 'api/v2' : v).join('/');
const button = document.createElement('button');
button.innerHTML = '🢃 JSON';
button.style.background = 'cornflowerblue';
button.style.borderRadius = '5px';
button.style.color = 'white';
button.style.padding = '5px';
button.addEventListener('click', async () => {
const response = await fetch(api, {
method: 'GET',
headers: {
'Authorization': 'Bearer ' + accessToken,
'Content-Type': 'application/json',
}
})
if (!response.ok) {
console.log(response);
alert(response.status + ' ' + response.statusText);
return;
}
const json = await response.json();
const bb = new Blob([JSON.stringify(json, null, ' ')], { type: 'text/plain' });
const a = document.createElement('a');
a.download = json.title + '.json';
a.href = URL.createObjectURL(bb);
a.click();
});
article.appendChild(button);
});
@atomita
Copy link
Author

atomita commented Dec 25, 2024

Qiita Teamの投稿一覧に、 /api/v2/items/:item のResponseをDownloadできるボタンを追加するSunippetです

Qiita Teamの投稿一覧を開いて、 {{https://qiita.com/settings/applications で個人用アクセストークンを発行し書き換え}} を書き換えたものを、ConsoleかDevToolsのSunippets機能で実行する感じ

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment