0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

SharePointのリンクをTeamsとMarkdown(Backlog)に貼りたい

Last updated at Posted at 2024-07-02

目的

  • SharePointはファイルのパスとファイルのリンクなどを共有するのがすごい手間
     (なにか知らない標準機能があるのかもだけど)
  • なんとかしたい
  • クリップボードからうまく貼り付けられると素敵
  • 貼り付けたいのはTeamsとBacklog(Markdown)

方法

調べたら同じようなことを考えている人はいて
基本的にはこちらの方のページのブックマークレットを使えばOK
(とても、ありがたかったです)

より自分が使いやすく

ただ、これだと、Teamsに貼ったときにおかしくなる(ファイルが複数ある場合、ファイル名が横一列になる)
なので、ちょっと修正

これでTeamsに貼るといいかんじ

image.png

javascript: (async () => {
  const selectedItems = [...document.querySelectorAll('div.is-selected')].map(x => x.ariaLabel.split(',')[0]);
  const site = location.pathname.split('/')[2];
  const docList = location.pathname.split('/')[3];
  const id = new URLSearchParams(location.search).get('id') || new URLSearchParams(location.search).get('RootFolder');
  const path = id ? id.split('/').slice(3).join('/') : docList;
  const baseurl = `${location.origin}/sites/${site}`;
  const url = `${baseurl}/_api/web/GetFolderByServerRelativeUrl('${path}')/Files`;
  const response = await fetch(url, {
    headers: {
      'Content-Type': 'application/json',
      'Accept': 'application/json;odata=verbose'
    }
  });
  const files = await response.json();
  let text = `<${baseurl}/${path}>\n`;
  let html = `<a href="${baseurl}/${path}">${baseurl}/${path}</a><br />`;
  for (let file of files.d.results) {
    const ext = file.Name.split('.').pop();
    const docUrl = /docx?|pptx?|xlsx?/.test(ext)
      ? `${baseurl}/_layouts/15/Doc.aspx?sourcedoc={${file.UniqueId}}`
      : `${baseurl}/${path}/${file.Name}`;
    console.log(file.Name, file.LinkingUri, file.UniqueId, docUrl);
    if (selectedItems.length === 0 || selectedItems.includes(file.Name)) {
      text = text + docUrl + '\n';
      html = html + `*&nbsp;${file.Name}<a href="${docUrl}"></a><br />`;
    }
  }
  const blob = new Blob([html], { type: "text/html" });
  const richTextInput = new ClipboardItem({ "text/html": blob });
  await navigator.clipboard.write([richTextInput]);
  prompt('HTML形式としてファイルパスをコピーしました。テキスト形式の場合は以下のテキストをコピーしてください。', text);
})();

よりさらに自分が使いやすく(最終版

でもBacklogにtext形式を貼り付けるとURLがうまくリンクにならない。。

というわけで、さらに修正したもの

javascript: (async () => {
    const selectedItems = [...document.querySelectorAll('div.is-selected')].map(x => x.ariaLabel.split(',')[0]);
    const site = location.pathname.split('/')[2];
    const docList = location.pathname.split('/')[3];
    const id = new URLSearchParams(location.search).get('id') || new URLSearchParams(location.search).get('RootFolder');
    const path = id ? id.split('/').slice(3).join('/') : docList;
    const baseurl = `${location.origin}/sites/${site}`;
    const url = `${baseurl}/_api/web/GetFolderByServerRelativeUrl('${path}')/Files`;
    const response = await fetch(url, {
      headers: {
        'Content-Type': 'application/json',
        'Accept': 'application/json;odata=verbose'
      }
    });
    const files = await response.json();
    let tem_url = `${baseurl}/${path}`;
    let text = `[${baseurl}/${path}](`+encodeURI(tem_url)+`)\n\n`;
    let html = `<a href="${baseurl}/${path}">${baseurl}/${path}</a><br />`;
    for (let file of files.d.results) {
      const ext = file.Name.split('.').pop();
      const docUrl = /docx?|pptx?|xlsx?/.test(ext)
        ? `${baseurl}/_layouts/15/Doc.aspx?sourcedoc={${file.UniqueId}}`
        : `${baseurl}/${path}/${file.Name}`;
      console.log(file.Name, file.LinkingUri, file.UniqueId, docUrl);
      if (selectedItems.length === 0 || selectedItems.includes(file.Name)) {
        text = text + `[${file.Name}](` + encodeURI(docUrl) + ')\n';
        html = html + `*&nbsp;${file.Name}<a href="${docUrl}"></a><br />`;
      }
    }
    const blob = new Blob([html], { type: "text/html" });
    const richTextInput = new ClipboardItem({ "text/html": blob });
    await navigator.clipboard.write([richTextInput]);
    prompt('HTML形式としてファイルパスをコピーしました。Markdown形式の場合は以下のテキストをコピーしてください。', text);
  })();

text形式をmarkdown形式のリンクに変更した


最終版の実行イメージ

これを実行する。自動的にクリップボードにバイナリ形式でコピーされる(Teams貼り付け用)
image.png

これだとクリップボードの内容をTeamsに貼り付けたときは、変わらず
image.png

入力フォームの内容をコピーしてMarkDown形式を貼り付けたときは(Backlog)、こうなる
image.png

ブックマークレットを作る

これをこのサイトでブックマークレットにする

修正版を変換したbookmarketは以下

javascript:(async()=>{const selectedItems=[...document.querySelectorAll('div.is-selected')].map(x=>x.ariaLabel.split(',')[0]);const site=location.pathname.split('/')[2];const docList=location.pathname.split('/')[3];const id=new URLSearchParams(location.search).get('id')||new URLSearchParams(location.search).get('RootFolder');const path=id?id.split('/').slice(3).join('/'):docList;const baseurl=`${location.origin}/sites/${site}`;const url=`${baseurl}/_api/web/GetFolderByServerRelativeUrl('${path}')/Files`;const response=await fetch(url,{headers:{'Content-Type':'application/json','Accept':'application/json;odata=verbose'}});const files=await response.json();let tem_url=`${baseurl}/${path}`;let text=`[${baseurl}/${path}](`+encodeURI(tem_url)+`)\n\n`;let html=`<a href="${baseurl}/${path}">${baseurl}/${path}</a><br/>`;for(let file of files.d.results){const ext=file.Name.split('.').pop();const docUrl=/docx?|pptx?|xlsx?/.test(ext)?`${baseurl}/_layouts/15/Doc.aspx?sourcedoc={${file.UniqueId}}`:`${baseurl}/${path}/${file.Name}`;console.log(file.Name,file.LinkingUri,file.UniqueId,docUrl);if(selectedItems.length===0||selectedItems.includes(file.Name)){text=text+`[${file.Name}](`+encodeURI(docUrl)+')\n';html=html+`*&nbsp;${file.Name}<a href="${docUrl}"></a><br/>`;}}const blob=new Blob([html],{type:"text/html"});const richTextInput=new ClipboardItem({"text/html":blob});await navigator.clipboard.write([richTextInput]);prompt('HTML形式としてファイルパスをコピーしました。Markdown形式の場合は以下のテキストをコピーしてください。',text);})();

参考

0
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
0
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?