gpt4 book ai didi

javascript - 如何在新页面加载时执行脚本

转载 作者:行者123 更新时间:2023-11-28 05:20:46 25 4
gpt4 key购买 nike

我正在尝试构建一个扩展程序,当单击扩展程序按钮时,该扩展程序会下载当前页面元标记中具有 URL 的图像。不幸的是,每次导航到新页面时,我都无法弄清楚如何获取图像的 URL。

换句话说,我的扩展部分正常工作。当我从第一页导航到链接到第一页的页面时,它总是从我访问的第一页下载图像,而不是下载新图像。

这是我的代码:
manifest.json

{
"manifest_version": 2,

"name": "Image downloader",
"description": "This extension alows you to download your images",
"version": "1.0",

"browser_action": {
"default_icon": "icon.png",
"default_popup": "popup.html",
"default_title": "Download Picture"
},
"permissions": [
"tabs",
"activeTab",
"downloads"
]
}

popup.html

<!doctype html>
<html>
<head>
<title>Getting Started Extension's Popup</title>
<style>
body {
font-family: "Segoe UI", "Lucida Grande", Tahoma, sans-serif;
font-size: 100%;
}
#status {
white-space: pre;
text-overflow: ellipsis;
overflow: hidden;
max-width: 400px;
}
</style>

<script src="popup.js"></script>
</head>
<body>
<div id="status"></div>
</body>
</html>

popup.js

/**
*Download images
*
*/
function getCurrentTabUrl(callback) {
var queryInfo = {
active: true,
currentWindow: true
};
chrome.tabs.query(queryInfo, function (tabs) {
var tab = tabs[0];
var url = tab.url;
console.assert(typeof url == 'string', 'tab.url should be a string');

callback(url);
});
}

function renderStatus(statusText) {
document.getElementById('status').textContent = statusText;
}

function getImage() {
var imgUrl = "";
var url = "";
var title;

getCurrentTabUrl(function (url) {
if (url.substring(0, 13) != 'https://page1') {
renderStatus('Please navigate to page1 ');
} else {
chrome.tabs.executeScript(null, {
file: 'script.js'
},
function (result) {
imgUrl = result[0];
var filenametimestamp = Math.floor(Date.now() / 1000);
if (imgUrl == null) {
renderStatus('Not Found... ');
} else {
renderStatus('Downloading... ');
console.log('URL: ' + imgUrl);
chrome.downloads.download({
url: imgUrl,
filename: filenametimestamp + ".jpg"
});
}
});
}
});
};

window.onload = function () {
console.log('onload');
getImage();
};

script.js

var picUrl
//location.reload();
var metas = document.getElementsByTagName('meta');
for (var i = 0; i < metas.length; i++) {
if (metas[i].getAttribute("property") == "og:image") {
picUrl = metas[i].getAttribute("content");
imgUrl = picUrl;
i = metas.length + 1;
}
}
picUrl;

我尝试了window.onclik,但发生了同样的问题。

以下是该问题的屏幕录制(单击可查看完整尺寸的录制内容,由于太大而无法在此处上传,该录制内容存储在异地):

screen-recording of the issue

最佳答案

我进一步调查了这个问题,发现浏览器扩展在其他网站上运行良好。所以这一定是我最初测试它的网站的限制。感谢您的帮助!

关于javascript - 如何在新页面加载时执行脚本,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/40576635/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com