如何将用户脚本注入嵌入式网页内容?

时间:2019-02-01 08:16:25

标签: javascript events dynamic google-chrome-extension user-defined-functions

点击链接打开嵌入式网页后,我想插入一个用户脚本。具体来说,我想知道我应该如何注入该脚本:

this.confirmationDialogService.confirm('Confirm Delete', 'Do you really want to delete this document?')
  .then((confirmed) => {
    this.employeeService.deleteEmployee(id)
    .subscribe(x => {
      this.employeeService.getEmployeeList();
      this.toast.warning("Deleted Sucessfully", 'Employee Register');
    });
  })

进入所有可嵌入Reddit子页面,即从subreddit主页加载的所有链接线程:

与标准的完全加载页面相反,该图像说明了嵌入式Reddit子页面

我认为这需要一个事件侦听器或 grpc@1.10.1 install /myProject/node_modules/grpc node-pre-gyp install --fallback-to-build --library=static_library node-pre-gyp ERR! Tried to download(403): https://storage.googleapis.com/grpc-precompiled-binaries/node/grpc/v1.10.1/node-v64-darwin-x64-unknown.tar.gz node-pre-gyp ERR! Pre-built binaries not found for grpc@1.10.1 and node@10.12.0 (node-v64 ABI, unknown) (falling back to source compile with node-gyp) node-pre-gyp ERR! Pre-built binaries not installable for grpc@1.10.1 and node@10.12.0 (node-v64 ABI, unknown) (falling back to source compile with node-gyp) node-pre-gyp ERR! Hit error Connection closed while downloading tarball file gypgyp ERR!ERR! configure error configure error gyp gypERR! stackERR! Error: Can't find Python executable "C:Python27python.exe", you can set the PYTHON env variable. gypstack Error: Can't find Python executable "C:Python27python.exe", you can set the PYTHON env variable. ERR! gypstack at PythonFinder.failNoPython (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:484:19) ERR!gyp stackERR! at PythonFinder.failNoPython (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:484:19) gypstack at PythonFinder.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:406:16) gypERR! stackERR! at PythonFinder.<anonymous> (/usr/local/lib/node_modules/npm/node_modules/node-gyp/lib/configure.js:406:16) stackgyp at F (/usr/local/lib/node_modules/npm/node_modules/which/which.js:68:16) gypERR! ERR!stack at F (/usr/local/lib/node_modules/npm/node_modules/which/which.js:68:16) stack at E (/usr/local/lib/node_modules/npm/node_modules/which/which.js:80:29) gyp gypERR! ERR! stackstack at E (/usr/local/lib/node_modules/npm/node_modules/which/which.js:80:29) at /usr/local/lib/node_modules/npm/node_modules/which/which.js:89:16 gypgyp ERR! ERR!stack stack at /usr/local/lib/node_modules/npm/node_modules/which/which.js:89:16 at /usr/local/lib/node_modules/npm/node_modules/isexe/index.js:42:5 gypgyp ERR!ERR! stack at /usr/local/lib/node_modules/npm/node_modules/isexe/mode.js:8:5 stackgyp at /usr/local/lib/node_modules/npm/node_modules/isexe/index.js:42:5 gypERR! stack at FSReqWrap.oncomplete (fs.js:154:21) ERR! stack at /usr/local/lib/node_modules/npm/node_modules/isexe/mode.js:8:5 gyp ERR! stackgyp at FSReqWrap.oncomplete (fs.js:154:21) ERR! System Darwin 17.7.0 gypgyp ERR! ERR! System Darwin 17.7.0 command "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "configure" "--fallback-to-build" "--library=static_library" "--module=/myProject/node_modules/grpc/src/node/extension_binary/node-v64-darwin-x64-unknown/grpc_node.node" "--module_name=grpc_node" "--module_path=/myProject/node_modules/grpc/src/node/extension_binary/node-v64-darwin-x64-unknown" "--python=C:Python27python.exe" gyp ERR!gyp cwdERR! /myProject/node_modules/grpc commandgyp "/usr/local/bin/node" "/usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js" "configure" "--fallback-to-build" "--library=static_library" "--module=/myProject/node_modules/grpc/src/node/extension_binary/node-v64-darwin-x64-unknown/grpc_node.node" "--module_name=grpc_node" "--module_path=/myProject/node_modules/grpc/src/node/extension_binary/node-v64-darwin-x64-unknown" "--python=C:Python27python.exe" ERR!gyp ERR! cwd /myProject/node_modules/grpc node -v v10.12.0 gyp gypERR! ERR!node -v v10.12.0 node-gyp -vgyp v3.8.0 gyp ERR!ERR! node-gyp -vnot ok v3.8.0 gyp ERR! not ok node-pre-gyp ERR! build error node-pre-gyp ERR! stack Error: Failed to execute '/usr/local/bin/node /usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --library=static_library --module=/myProject/node_modules/grpc/src/node/extension_binary/node-v64-darwin-x64-unknown/grpc_node.node --module_name=grpc_node --module_path=/myProject/node_modules/grpc/src/node/extension_binary/node-v64-darwin-x64-unknown --python=C:Python27python.exe' (1) node-pre-gyp ERR! stack at ChildProcess.<anonymous> (/myProject/node_modules/grpc/node_modules/node-pre-gyp/lib/util/compile.js:83:29) node-pre-gyp ERR! stack at ChildProcess.emit (events.js:182:13) node-pre-gyp ERR! stack at maybeClose (internal/child_process.js:962:16) node-pre-gyp ERR! stack at Process.ChildProcess._handle.onexit (internal/child_process.js:251:5) node-pre-gyp ERR! System Darwin 17.7.0 node-pre-gyp ERR! command "/usr/local/bin/node" "/myProject/node_modules/grpc/node_modules/.bin/node-pre-gyp" "install" "--fallback-to-build" "--library=static_library" node-pre-gyp ERR! cwd /myProject/node_modules/grpc node-pre-gyp ERR! node -v v10.12.0 node-pre-gyp ERR! node-pre-gyp -v v0.7.0 node-pre-gyp ERR! not ok Failed to execute '/usr/local/bin/node /usr/local/lib/node_modules/npm/node_modules/node-gyp/bin/node-gyp.js configure --fallback-to-build --library=static_library --module=/myProject/node_modules/grpc/src/node/extension_binary/node-v64-darwin-x64-unknown/grpc_node.node --module_name=grpc_node --module_path=/myProject/node_modules/grpc/src/node/extension_binary/node-v64-darwin-x64-unknown --python=C:Python27python.exe' (1) npm ERR! code ELIFECYCLE npm ERR! errno 1 npm ERR! grpc@1.10.1 install: `node-pre-gyp install --fallback-to-build --library=static_library` npm ERR! Exit status 1 npm ERR! npm ERR! Failed at the grpc@1.10.1 install script. npm ERR! This is probably not a problem with npm. There is likely additional logging output above. npm ERR! A complete log of this run can be found in: npm ERR! /Users/.npm/_logs/2019-01-31T13_24_35_078Z-debug.log ,但是我不知道如何指定解决方案。阅读Reddit源码令人深感困惑,我不是编码员。我认为这对自己和其他日常网络用户来说很有用。

解决此类问题的正确步骤是什么?我应该考虑哪种代码?

2 个答案:

答案 0 :(得分:0)

您的问题太笼统了,但我想您要问的是基本问题。如果定位到某个特定平台,请澄清您的问题。

我假设您只是想将javascript代码注入Web HTML页面或HTML页面的一部分。

通常通过脚本标记完成

### conditional plot with connected lines or linespoints
reset
FILE = "SO_Filter.dat"
set datafile separator ":"

set multiplot layout 2,1  title "generated with gnuplot 4.6"

# this works with gnuplot 4.x and 5.x
x0 = y0 = NaN
plot FILE u ($2==15 && $3==8 ? (y0=$4,x0=$1) : x0):(y0) w lp pt 7 ti "works with gnuplot >4.x and 5.x"

# this works with gnuplot >5.x
set datafile missing "NaN"
plot FILE u ($2==15 && $3==8 ? $1 : NaN ):4 w lp pt 7 ti "works only with gnuplot >5.x"

unset multiplot
### end of code

要强制链接调用您的代码,必须将代码包装在函数内,并将标签的href属性格式化为javascript:func_name()

    <script>
    /* Your code is here */
    Array.from(document.querySelectorAll.......
    </script>

答案 1 :(得分:0)

您需要处理关于页面节点的选择的组中userscript。因为您的代码每页的负载事件一次仅执行时,所述节点在负载动态以后不受影响。

有几种方法可以实现您的目标。最简单的方法的涉及使用setInterval功能。这种定期调用你的函数(通过使用一个合理的时间跨度,说500毫秒)。有了这个功能,你必须选择你想要的节点,仅处理新到来的节点。你可以用类似的_is_processed属性标记您节点的DOM对象。最后这可以被包装成另一种功能,比如说doForEachOnce。例如:

function doForEachOnce(list,theFunc) {
    list.forEach(i => {
        if (!i._is_processed) { i._is_processed = true; return theFunc(i); } else { return null; }
    });
}

doForEachOnce(Array.from(document.querySelectorAll('span')).filter(i => /(\d+)\spoint/.test(i.innerHTML)), i => i.style.display = 'none');
doForEachOnce(Array.from(document.querySelectorAll('div')).filter(i => /moreComments-/.test(i.id)), i => i.querySelector('p').click());

setInterval(function() {
  doForEachOnce(Array.from(document.querySelectorAll('span')).filter(i => /(\d+)\spoint/.test(i.innerHTML)), i => i.style.display = 'none');
},500);

我使用Tampermonkey成功测试了该用户脚本。它扩展的所有意见,隐藏在页面加载的业力,然后再隐藏业力为每个新到来。希望这就是您所需要的。