论坛 › 问答互助 › 如何做到当浏览器地址栏中的url变化后重新加载脚本？

木羊羽 发表于 2022-2-8 15:39:43

如何做到当浏览器地址栏中的url变化后重新加载脚本？

本帖最后由 木羊羽 于 2022-2-8 15:45 编辑

#### 如何做到当浏览器地址栏中的url变化后重新加载脚本？

#### 我是在哔哩哔哩视频播放界面点击视频后油猴脚本并没有重新加载，请问哥哥们代码应该怎么写呢？

[](https://)

[图片](https://gitee.com/myy_321/images/raw/master/picture/diy/Snipaste_2022-02-08_15-37-04.png)

李恒道 发表于 2022-2-8 16:29:34

bilibili使用的是vue框架
vue-router是vue框架的路由，主要有hash，histroy，abstract三种模式
b站我记着是用的history模式
对pushState api可以尝试劫持一下看看‘
mdn来自https://developer.mozilla.org/en-US/docs/Web/API/History/pushState
或者拿到vue对象之后，在vue-router修改出来一个跳转路由，每一次进行路由跳转的时候回调你函数也是OK的

李恒道 发表于 2022-2-8 16:43:58

```javascript
router.afterEach((to, from) => {
sendToAnalytics(to.fullPath)
})
```

查看vuerouter源码

https://github.com/vuejs/vue-router/blob/dev/dist/vue-router.js

```javascript
VueRouter.prototype.afterEach = function afterEach (fn) {
    return registerHook(this.afterHooks, fn)
};
```


往afterhooks丢个函数应该就好了

木羊羽 发表于 2022-2-8 17:06:50

李恒道 发表于 2022-2-8 16:43
```javascript
router.afterEach((to, from) => {
sendToAnalytics(to.fullPath)


哥哥 我努力一下我看能不能搞懂

李恒道 发表于 2022-2-8 17:17:49

木羊羽 发表于 2022-2-8 17:06
哥哥 我努力一下我看能不能搞懂

https://bbs.tampermonkey.net.cn/forum.php?mod=viewthread&tid=1727
document.querySelector('#app').__vue__.$router.afterHooks.push(()=>{console.log('路由发生改变')})

木羊羽 发表于 2022-2-8 17:24:07

李恒道 发表于 2022-2-8 16:43
```javascript
router.afterEach((to, from) => {
sendToAnalytics(to.fullPath)


需要首先在脚本里面引入这个vue-router.js吗？

李恒道 发表于 2022-2-8 17:28:02

木羊羽 发表于 2022-2-8 17:24
需要首先在脚本里面引入这个vue-router.js吗？

不用
document.querySelector('#app').__vue__.$router.afterHooks.push(()=>{console.log('路由发生改变')})
主要是看对应的源码，找注入点一点一点跳进去

木羊羽 发表于 2022-2-8 17:51:29

李恒道 发表于 2022-2-8 17:28
不用
document.querySelector('#app').__vue__.$router.afterHooks.push(()=>{console.log('路由发生改变 ...

https://s2.loli.net/2022/02/08/yMI9N7HSQ46wU5g.png在脚本里面使用出错，在命令行使用成功https://s2.loli.net/2022/02/08/ACqZ8SLkrdXfpnO.png

李恒道 发表于 2022-2-8 18:06:16

木羊羽 发表于 2022-2-8 17:51
在脚本里面使用出错，在命令行使用成功

要看脚本执行时机以及页面初始化时机的

李恒道 发表于 2022-2-8 18:06:38

木羊羽 发表于 2022-2-8 17:51
在脚本里面使用出错，在命令行使用成功

可以setinterval循环一下

查看完整版本: 如何做到当浏览器地址栏中的url变化后重新加载脚本？