上一主题 下一主题
ScriptCat,新一代的脚本管理器脚本站,与全世界分享你的用户脚本油猴脚本开发指南教程目录
12
返回列表 发新帖
楼主: lucas - 

获取iframe中元素,提示跨域访问出错

[复制链接]
  • TA的每日心情
    慵懒
    2022-3-8 11:41
  • 签到天数: 2 天

    [LV.1]初来乍到

    22

    主题

    857

    回帖

    1356

    积分

    荣誉开发者

    积分
    1356

    荣誉开发者卓越贡献油中2周年生态建设者油中3周年挑战者 lv2

    发表于 2022-8-10 11:30:23 | 显示全部楼层
    lucas 发表于 2022-8-10 08:04
    感谢大佬指点,作为一个小白,太感谢了,确实解决了我的困扰,之前悬赏的20元,看怎么给方便点,请大佬喝 ...

    不用不用,我都不知道有悬赏这回事。
    回复
    订阅

    使用道具 举报

  • TA的每日心情
    开心
    2022-8-28 08:36
  • 签到天数: 17 天

    [LV.4]偶尔看看III

    1

    主题

    8

    回帖

    16

    积分

    助理工程师

    积分
    16

    新人报道

    发表于 2022-8-11 12:57:20 | 显示全部楼层
    cxxjackie 发表于 2022-8-9 18:06
    iframe内部可以理解为另一个网页,如果网页跨域,那无论如何也是不能直接操作其中的元素的。跨域页面可以通 ...

    记录一下对这个的理解,还有最后那行return _load.call(this, pdfDocument);没看懂,大佬能再讲下吗?this是指向哪里?pdfDocument是原来函数有的一个属性,哪里来的值传进去的
    1. // iframe内有一个全局对象PDFViewerApplication,可对其进行劫持来判断pdf加载完毕,也可以用其他方法。
    2.     // 1-保存原有函数
    3.     var _load = window.PDFViewerApplication.load;
    4.     // 2-改写原有函数
    5.     window.PDFViewerApplication.load = function(pdfDocument) {
    6.       // 3-在改写后的函数中执行原有函数的逻辑
    7.       // 获取页码数,发送给主页面
    8.       window.top.postMessage({
    9.         numPages: pdfDocument._pdfInfo.numPages
    10.       }, 'https://ctbpsp.com');
    11.       // 4-采用 call 方法劫持,将函数的调用者改为this
    12.       return _load.call(this, pdfDocument);
    复制代码

    回复

    使用道具 举报

  • TA的每日心情
    慵懒
    2022-3-8 11:41
  • 签到天数: 2 天

    [LV.1]初来乍到

    22

    主题

    857

    回帖

    1356

    积分

    荣誉开发者

    积分
    1356

    荣誉开发者卓越贡献油中2周年生态建设者油中3周年挑战者 lv2

    发表于 2022-8-11 22:22:48 | 显示全部楼层
    lucas 发表于 2022-8-11 12:57
    记录一下对这个的理解,还有最后那行return _load.call(this, pdfDocument);没看懂,大佬能再讲下吗?thi ...

    这句就是调用原函数的意思,this指向PDFViewerApplication,因为load是PDFViewerApplication的一个属性,正常调用PDFViewerApplication.load()的话,函数内的this会指向其所属的对象,而我们保存了_load以后,直接调用_load()的话this会指向window(因为_load不是PDFViewerApplication的属性),这显然是不对的,所以需要人为改变this的指向。下面的例子可以帮助你理解这一点:
    1. const obj = {
    2.     a: 123,
    3.     b: function(n) {
    4.         console.log(this.a + n);
    5.     }
    6. };
    7. const fn1 = obj.b;
    8. const fn2 = obj.b.bind(obj);
    9. fn1(321); // NaN
    10. fn2(321); // 444
    复制代码

    pdfDocument参数来自load函数的调用者,网页内部在加载pdf时会自己调用这个load并传参,这个劫持就是在中间把他拦下来,读取我们需要的参数后再原样调用原函数。那句call不仅改变了this指向,也包含了把参数传递回去的操作,如果将其拆分成2步来写,就是这个意思:
    1. const __load = _load.bind(this);
    2. return __load(pdfDocument);
    复制代码
    回复

    使用道具 举报

  • TA的每日心情
    开心
    2022-6-2 15:24
  • 签到天数: 3 天

    [LV.2]偶尔看看I

    13

    主题

    56

    回帖

    79

    积分

    初级工程师

    积分
    79

    油中2周年

    发表于 2022-8-31 15:08:46 | 显示全部楼层
    发现一个有用的帖子,记在小本本里
    回复

    使用道具 举报

    12
    返回列表 发新帖

    发表回复

    本版积分规则

    快速回复 返回顶部 返回列表