Chrome拡張機能「S.G.T.C. ～Send "Generated Text By UserScript" to Clipboard.～」

S.G.T.C.

About

"S.G.T.C." is an extension for Chrome. It can send text generated with a "UserScript" to the clipboard.

Based on the information on the page,

etc.

On the user side, more functionality can be added by writing "UserScript".

Install

  1. Go to the S.G.T.C. page on the Chrome Web Store.
  2. Click Add to Chrome.
  3. When you click, a confirmation dialog for installation will appear, so click the Add extension button.
  4. Installation complete.

How to use

To use the extension

How to use S.G.T.C. from Popup Menu How to use S.G.T.C. from Context Menu

Click on the icon on the right side of the address bar or the name of the script you wish to run from the context menu.

To use on local file

Manage Extension enable the "Allow access to file URLs" option

If you want to run "S.G.T.C." on local files as well,

  1. From the icon in the top right of Google Chrome, go to the screen with the list of installed extensions by selecting "Extension → Manage Extension".
  2. Click the Detail button for "S.G.T.C" to go to the management screen.
  3. enable the "Allow access to file URLs" option.

Setting

To open the Option of “S.G.T.C.”,

  1. Click the icon on the right side of the address bar to display a pop-up menu.
  2. Click the gear icon at the top of the pop-up menu to display the options screen.

Changes to settings, additions or modifications to user scripts, and changes to the default settings by resetting will not be reflected until you press the save button. Please be especially careful not to forget to save when adding or modifying user script code.

Debug

Developer Tools の Console への出力有効/無効切り替えについて。このオプションを有効にすると、処理が若干（100～300ms）遅くなる為、

等を除き、基本的にこのオプションを有効にする必要はありません。

ユーザースクリプトのデバックの詳細については、UserScript の Debug の項を参照してください。

UserScript

Specification

Restriction

Debug

実行環境である OffscreenDocument はユーザースクリプト実行終了後に短時間で閉じる為、ビューを検証からのデバックは推奨しません。Debug 有効時、ユーザースクリプトのコンソール出力は background(service workers) へと非同期で送信しているので、そちらを参照してください。

Argument

argument, detail of reserved

property type description
title string The page Title.
taken from the document.title of the page.
url string The page url.
taken from the document.URL of the page.
content string HTML content of current page.
taken from the document.documentElement.outerHTML of the page.
referrer string The website visited before current page.
taken from the document.referrer of the page.
selection object See separate detail of selection.
key object See separate key of selection.

argument, detail of selection

マウス等でテキスト選択状態にある場合に取得。現在のページ、もしくは同じドメインから読み込まれた frame や iframe のページから取得。

property type description
title string The page title that have been selected with the mouse.
taken from the document.title of the current page.
url string The page url that have been selected with the mouse.
taken from the document.URL of the current page.
content string HTML content of current page that have been selected with the mouse.
taken from the document.documentElement.outerHTML of the current page.
referrer string The website visited before current page.
taken from the document.referrer of the current page.
sameorigin bool The frame or iframe selected with the mouse is from the same domain as the current page. |　　　　　
selected bool Is it selected in a frame or iframe on the same domain?
selectionText string The Text of the Selected Content on the page.
taken from the window.getSelection().toString() of the active page.
selectionHTML string The HTML of the Selected Content on the page.
taken from the document.documentElement.outerHTML of the active page.

argument, detail of key

キーボードの入力状態を取得。いずれかのキーを離したタイミングでリセットされる為、キーボードを押した状態で実行を。

property type description
type string Returns the string "keydown" on key down.
altKey bool A boolean value indicating whether the Alt key is pressed.
ctrlKey bool A boolean value indicating whether the Ctl key is pressed.
shiftKey bool A boolean value indicating whether the Shift key is pressed.
metaKey bool A boolean value indicating whether the Meta key is pressed.
repeat bool Is the key being held down?
code string The value of a physical key on the keyboard.
event.code of KeyboardEvent: key property - MDN
key string A value that reflects the keyboard locale and layout.
event.key of KeyboardEvent: key property - MDN
simultaneous array If multiple keys are pressed at the same time, they are stored in an array here.
An array of objects that pair "event.code or event.key" with a boolean.

Sample Code

Get Image URL in Page

ユーザースクリプト「Get Image URL in Page」を例に処理全体の流れを解説。

/**
* @description Get Image URL in Page
* @param       {object} reserved
* @return      {string} result
*/
(reserved) => {
    // 必須
    const { title, url, referrer, content, selection, key } = reserved;

    const baseURL = url;

    // content を引数に HTMLDocument 生成
    const doc = (new DOMParser()).parseFromString(content, "text/html");

    // dom へのアクセス
    const images = doc.querySelectorAll("img");

    const imageUrlList = [];

    // 要素から取得した属性値と該当ページのURLを元に絶対URLを生成
    const getFullPath = (elm, attr, baseURL) => {
        const path = elm.getAttribute(attr);
        const url  = new URL(path, baseURL);

        return url.href;
    };
    const isImageFile = (path) => {
        const regexp = /\.(apng|png|avif|bmp|gif|ico|cur|jpe?g|jfif|pjpeg|pjp|svg|tiff?|webp)(\?|\?[-_!~*\'()a-zA-Z0-9;\:\@&=+\$,%#]+)?$/i;

        return regexp.test(path);
    }

    Array.from(images).forEach(
        (elm) => {
            const image = ((obj, base) => {
                const path = getFullPath(obj, "src", base);

                return path;
            })(elm, baseURL);
            const anchor = ((obj, base) => {
                const anc = obj.closest("a");

                if (anc && anc.getAttribute("href")) {
                    const path = getFullPath(anc, "href", base);

                    return path;
                }

                return null;
            })(elm, baseURL);

            imageUrlList.push(image);
            imageUrlList.push(anchor)
        }
    );

    const list   = (imageUrlList).filter(elm => (elm && isImageFile(elm)));
    const result = list.join("\n");

    // Debug, コンソール出力する値は「必ず文字列に変換」する事
    // "toString() or JSON.stringify()" いずれかのメソッドで文字列に変換　
    console.log('Debug : "Get Image URL in Page" >>', result.toString());

    // 必須、必ず1文字以上の文字列で返す事
    return (result ? result : "Not Found Image URL.");
}

Q&A

General

ブラウザの内部URLの詳細は？

chrome://about または chrome://chrome-urls のURLをブラウザで開くと内部URL一覧が表示されます。

ドキュメントが英語・日本語混じりなのは何故？

夏の暑さで気力・体力が落ちたから……

Setting

セーブデータの上限は？

設定の保存に chrome.storage.local を使用している為、上限は 10MByte （JSONへの文字列化換算）です。

UserScript

JavaScript 初心者用に参考になるサイトを教えてください

以下のサイトはどうでしょうか？

Known Issues

Contact

当ページへのリンクは、個人・商用を問わずご自由に。事前の連絡は不要です。

Support

拡張機能「S.G.T.C.」の不具合報告は、

  1. 何が問題なのか
  2. 問題が発生した
    • ユーザースクリプトの名前
    • ページのURL
  3. 再現手順とそれが起こる頻度
  4. ブラウザの種類とバージョン

を添えて報告してください。ブラウザのリリース チャンネル Dev、Canary、それに準ずるバージョンでの不具合は対象外とします。第三者が製作したユーザースクリプトについては、その作者に問い合わせてください。

Donation

サイト維持、継続的な開発の為の寄付を受け付けています。この拡張機能に満足いただけた方、開発を応援しようとされる方はぜひよろしくお願いします。

寄付は、欲しいものリスト - Amazon 経由で送ることができます。