用于刷新页面的 Chrome 扩展

     2023-05-08     93

关键词:

【中文标题】用于刷新页面的 Chrome 扩展【英文标题】:Chrome extension used to refresh pages 【发布时间】:2012-02-11 02:13:54 【问题描述】:

我正在尝试开发一个 Chrome 扩展程序,它可以通过每 5 分钟刷新一次来向我显示来自足球新闻网站的最近 3 条新闻(显然该页面未在任何选项卡中打开)。我的想法是在 iframe 中加载页面,一旦加载页面,访问页面 DOM 并仅提取带有新闻的文本节点。我已经尝试了多种方式使用 readyload 功能,我尝试遵循这个解决方案here,但我总是收到警告。我的问题是:有没有一种方法可以做到这一点而不会遇到跨域安全问题?有什么简单的例子可以用吗?

【问题讨论】:

【参考方案1】:

这是使用 JQuery 的方法(请记住,我不了解 JQuery,只是在某处看到这种方法并认为它可能对您有用)。 我把它放在一个弹出窗口中,它起作用了....

<!DOCTYPE html>
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script>

function renderNews(newsList)
      $('#news').html('');
      $(newsList).each(function(i,item)
         var link = document.createElement('a');
         $(link).attr('href',item.link);
         $(link).html(item.description);
         $(link).click(function()
            chrome.tabs.create(url:$(this).attr('href'));
         );

         var linksDate = document.createElement('span');
         //$(linksDate).text(item.date);
         $(linksDate).text(item.day + '-' + item.month + ' ' + item.hour + ':' + item.minute+' - ');

         var listItem = document.createElement('li');
         $(listItem).append(linksDate).append(link);

         $("#news").append(listItem);
       );



  function getNews() 
   $.get("http://www.milannews.it/?action=search&section=32", null,  function(data, textStatus)
    

        if(data) 
        var news=$(data).find(".list").find('li').slice(0,3) ;
        $("#status").text('');

      var newsList=[];
      $(news).each(function(i, item)
       var newsItem=;
       newsItem.description=$(item).find('a').html();
       newsItem.link='http://www.milannews.it/'+$(item).find('a').attr('href');
       newsItem.date=$(item).find('span').first().text();
       newsItem.day=newsItem.date.split(' ')[0].split('.')[0];
       newsItem.month=newsItem.date.split(' ')[0].split('.')[1];
       newsItem.hour=newsItem.date.split(' ')[1].split(':')[0];
       newsItem.minute=newsItem.date.split(' ')[1].split(':')[1];
       newsList[i]=newsItem;
      );
      renderNews(newsList);
      localStorage.setItem('oldNews',JSON.stringify(newsList));
        
    );
  

  function onPageLoad()
   if (localStorage["oldNews"]!=null) renderNews(JSON.parse(localStorage["oldNews"]));
   getNews();
  
</script>
</head>
<body onload="onPageLoad();" style="width: 700px">
<ul id="news"></ul>
<div id="status">Checking for new news...</div>
</body>
</html>

并且不要忘记将您通过 xhr 获得的网址放在清单的权限部分中......http://code.google.com/chrome/extensions/xhr.html

【讨论】:

非常感谢。这就是我想要做的。效果很好。 知道为什么当我点击其中一个链接时,这只是刷新了 popup.html 页面吗?我想用我点击的链接中的页面打开一个新的 chrome 选项卡。我尝试将每个“a”元素的“target”属性设置为“_blank”,但结果是在新选项卡中打开了 popup.html。谢谢 抱歉,是的,您需要放置一个使用创建选项卡打开链接的 onClick 事件。我已经更改了代码来为您执行此操作,并添加了记住以前的新闻并显示您想要单击多个选项的功能,因为当您单击一个时弹出窗口会关闭....实际上有点忘乎所以,是良好的学习体验; 非常感谢。我正在自己处理它,您的代码解决了我遇到的许多其他问题。再次感谢。 太棒了,很高兴听到它有帮助。我这样做的一个原因是我认为现在将其粘贴在后台页面中并每五分钟左右进行一次检查并在有新项目时使用桌面通知会相当容易。只需创建一个新列表并将旧列表链接的第一项与从末尾开始的新列表进行比较。如果你没有发现它们都是新的,如果你发现它上面的那些(如果有的话)是新的。那么你永远不会错过重要的足球新闻(我认为就是这样,我不懂意大利语;))【参考方案2】:

使用 xhr 加载页面并使用 jQuery 或正则表达式解析原始 HTML 以获取您要查找的数据。

请记住,目标网站可能不希望您以这种自动方式访问他们的网站。尊重他们的网站和资源。

【讨论】:

我尝试像您说的那样加载页面,但尝试调试时遇到异常:xhr 状态:[异常:DOMException]。我遵循了 Hello world google 示例link。我要加载的页面是“milannews.it/?action=search&section=32&”。 您将不得不更具体地了解错误。

Chrome 扩展:如何禁用页面可见性 API

...ate(即使它是只读属性)。如果不可能,因为这个扩展仅用于我 查看详情

Chrome 扩展:加载不同的内容脚本

...的内容脚本。现在,我有三个内容脚本。我想将其中两个用于一页,第三个用于另一页。属于第1页:content_script.jsload_content_script.js属于page2:newtab_c 查看详情

chrome谷歌浏览器怎么设置网页定时自动刷新

...--扩展程序2、选择扩展程序3、选择获取4、在市场里找到刷新软件5、安装扩展程序6、点击图标打开,点close7、设置刷新间隔8、点击start,开始倒计时刷新参考技术A可以安装chrome插件,也可以用pagerefresh工具 参考技术B参考下面百... 查看详情

前端开发都有哪些工具可以提高效率

掘金Chrome插件Vue.jsdevtools。 Chrome开发者工具扩展,用于调试Vue.js应用。ReactDeveloperTools,可以在Chrome和Firefox开发者工具审查React组件的浏览器扩展。AngularJSBatarang ,是适用于Chrome的AngularJSWebInspector扩展。AngularJSBatarang是开... 查看详情

如何链接到 chrome 扩展中的选项页面?

】如何链接到chrome扩展中的选项页面?【英文标题】:Howdoyoulinktotheoptionspageinachromeextension?【发布时间】:2013-01-2914:03:49【问题描述】:我有一个带有optionspage的chrome扩展程序。选项页面可以正常工作,我可以从扩展页面访问它... 查看详情

用于拦截/修改 websockets UA 的 Chrome 扩展 API

】用于拦截/修改websocketsUA的Chrome扩展API【英文标题】:ChromeextensionAPIforintercepting/modifyingwebsocketsUA【发布时间】:2015-05-0812:28:00【问题描述】:我正在尝试编写一个扩展来修改来自Chrome的所有传出请求的用户代理。对于http://、htt... 查看详情

iOS 共享扩展在 Chrome 中不起作用

...kinginChrome【发布时间】:2016-07-2813:14:03【问题描述】:适用于Safari,不适用于Chrome也许这个问题既简单又愚蠢,但我是iOS开发的新手,我找不到任何合适的解决方案来解决这个问题。我需要得到:1)页面网址2)页面名称扩展Info.pli... 查看详情

chromium内核浏览器刷新扩展列表(代码片段)

chromium内核浏览器刷新扩展列表文档说明:仅仅记录关键点方;2023-04-18缘由:用shell脚本批量更新扩展更新方法是:替换整个文件夹;更新完毕,扩展功能并不会生效还需逐个刷新扩展环境要求:chromium内核浏览器版本>87打开... 查看详情

使用 chrome 扩展修改加载页面的 HTML

】使用chrome扩展修改加载页面的HTML【英文标题】:ModifyHTMLofloadedpagesusingchromeextensions【发布时间】:2012-12-1316:21:31【问题描述】:如果页面标题包含特定文本,我如何向加载的页面添加一些HTML代码?Chrome扩展程序对我来说是新... 查看详情

用于收听和捕获流式音频的 Chrome 扩展程序

】用于收听和捕获流式音频的Chrome扩展程序【英文标题】:Chromeextensiontolistenandcapturestreamingaudio【发布时间】:2013-03-0819:39:13【问题描述】:Chrome扩展程序是否可以从浏览器的任何选项卡中侦听流式音频?我想捕获流式音频数据... 查看详情

Chrome 后退按钮页面刷新 - ASP.net

】Chrome后退按钮页面刷新-ASP.net【英文标题】:ChromeBackbuttonpagerefresh-ASP.net【发布时间】:2011-02-1319:22:24【问题描述】:我有一个ASP.net应用程序(c#)。当用户在特定页面上时,他们单击此页面上的链接,将他们带到子页面,显示产... 查看详情

Chrome扩展将侧边栏注入页面

】Chrome扩展将侧边栏注入页面【英文标题】:Chromeextensioninjectsidebarintopage【发布时间】:2012-04-2310:32:42【问题描述】:我希望我的chrome扩展程序在激活时能够在任何页面的右侧注入一个300像素的侧边栏。我正在寻找将整个页面限... 查看详情

markdown用于软件开发的chrome扩展程序(代码片段)

查看详情

为啥我的页面在刷新期间会在 Chrome 中触发“就绪”事件?

】为啥我的页面在刷新期间会在Chrome中触发“就绪”事件?【英文标题】:Whydoesmypagefire"ready"eventinChromeduringrefresh?为什么我的页面在刷新期间会在Chrome中触发“就绪”事件?【发布时间】:2014-09-1708:22:50【问题描述】:... 查看详情

window.location.reload 不适用于 Firefox 和 Chrome

】window.location.reload不适用于Firefox和Chrome【英文标题】:window.location.reloadnotworkingforFirefoxandChrome【发布时间】:2013-09-2820:07:01【问题描述】:我想在单击按钮时更改用户状态,所以我要做的就是检测当前状态并在需要时进行更改... 查看详情

Chrome 扩展程序:如何在 chrome 扩展程序更新后删除孤立的脚本

...时间】:2019-12-1910:45:25【问题描述】:我有一个带有弹出页面的chrome扩展,它通过简单的一次性请求将布尔变量传递给我的内容页面。然后,内容页面将根据从弹出页面传递的布尔变量的状态执行一些操作。在我 查看详情

为啥在chrome中刷新页面时宽度的值设置为零?

】为啥在chrome中刷新页面时宽度的值设置为零?【英文标题】:Whydoesthevalueofwidthgetssettozerowhenthepageisrefreshedinchrome?为什么在chrome中刷新页面时宽度的值设置为零?【发布时间】:2012-03-3002:13:36【问题描述】:我编写了一些jQuery代... 查看详情

用于刷新页面和/或 Telerik 网格的 JavaScript 代码

】用于刷新页面和/或Telerik网格的JavaScript代码【英文标题】:JavaScriptcodetorefreshpageandortelerikgrid【发布时间】:2011-07-3017:33:03【问题描述】:我需要某种代码,它会每5分钟刷新一次页面,如果不是页面,则只显示Telerik网格,因为... 查看详情