質問するログイン新規登録

質問編集履歴

1

キャプチャ動作のスクリプトを記載しました

2021/03/01 14:34

投稿

tomyy
tomyy

スコア22

title CHANGED
File without changes
body CHANGED
@@ -34,4 +34,46 @@
34
34
  "version": "0.1",
35
35
  "manifest_version": 2
36
36
  }
37
- ```
37
+ ```
38
+
39
+ 【追記】
40
+ 既存システムのイメージは、、、[https://www.sejuku.net/blog/48540](https://www.sejuku.net/blog/48540)
41
+ こちらのページの「window.open()とは?」の項目にある画像のような表示方法で、
42
+ 指定のボタンを押すとvideoタグが含まれたここで言う”サンプル.html”が表示されます。
43
+ この画像をご覧頂くと分かる通り、ポップアップで開いたウインドウにはアドオンボタンが表示されません。
44
+ その為、アドオンにショートカットを割り当てて利用しようと考えました。
45
+ しかし通常タブでは動作しますが、ポップアップでは動作しませんでした。。。
46
+ 実際に動画部分を切り出すスクリプトは以下の様な内容です。
47
+ ↓main.js
48
+ ```js
49
+ javascript: (() => {
50
+ const video = document.querySelector('video');
51
+ if (video) {
52
+ const canvas = document.createElement('canvas');
53
+ canvas.width = video.clientWidth;
54
+ canvas.height = video.clientHeight;
55
+ const context = canvas.getContext('2d');
56
+ context.drawImage(video, 0, 0, canvas.width, canvas.height);
57
+ const image = new Image();
58
+ image.src = canvas.toDataURL('image/jpeg');
59
+ const a = document.createElement('a');
60
+ a.download = `${location.host}_${new Date().toISOString()}.jpeg`;
61
+ a.target = '_blank';
62
+ a.href = image.src;
63
+ a.click();
64
+ } else {
65
+ alert('There is no video tag.');
66
+
67
+ }
68
+ })();
69
+ void 0;
70
+ ```
71
+ こちらはブックマークレットで公開されていたものをjsファイルとして保存し、background.jsで読み出しているものです。
72
+ ↓background.js
73
+ ```js
74
+ chrome.browserAction.onClicked.addListener(function(tab) {
75
+ chrome.tabs.executeScript(tab.id, {file: "main.js"})
76
+
77
+ });
78
+ ```
79
+ ファイルは以上となります。