页面重新加载chrome扩展消息发送?

保罗·高德

因此,我正在通过chrome扩展程序将html表单注入第三方网站来运行数据收集项目,该扩展程序指示用户描述他们看到的数据并将其提交给我的服务器。

但是,出于某些奇怪的原因,每当用户单击“提交”按钮以将表单内容发送到后台页面(然后从此页面发送到服务器)时,基础页面就会重新加载,不仅如此,它还会重新加载重新注入后,我注入的表单内容显示在url中。这是一种奇怪的行为。

我不知道这是我的代码中的内容,还是底层网页代码chrome.runtime.sendMessage中的某些内容(也许是重新定义还是某种反扩展技术?!?)。如果可能的话,我真的很想停止这种行为...有人有什么想法吗?

我的代码的相关部分被简化了一些:

var cururl = window.location.href

var codestring= "[A HTML FORM TO INJECT]"
var raformvalues = {};

function codeValues() {
    $.each($('#mainCoding').serializeArray(), function(i, field) {
        raformvalues[field.name] = field.value;
    });
}

function sendValues() {
    let pageinfo = {"page": document.documentElement.outerHTML,
                "url": cururl,
                    "title": document.title,
                    "timestamp": String(Date.now())};
    let tosend = $.extend({"type": "doctype"}, pageinfo, raformvalues);
    chrome.runtime.sendMessage(tosend);
    chrome.storage.local.set({'lasturl': pageinfo.url});
    $("#pgcodediv").empty();
    location.href = cururl; // note: I added this line to try to stop the reloading and url/changing behavior. behavior is the same with and without it.
}

function appendCodingInfo() {
    $("#headerID").append(codestring);
    $( ":checkbox, :radio" ).click( codeValues );
    $( ":text" ).change( codeValues );
    $( "#codingsubmit" ).click(sendValues);
}
appendCodingInfo()

当用户点击“提交”按钮(#codingsubmit,当然)时,消息将被传递,后台页面将对其进行正确处理,但是页面会刷新,并且raformvalues刷新后的页面URL中会显示内容(即,当我打电话时window.location.href从控制台中,该对象的内容将显示为获取请求的参数,即http:// url?prop = value&prop2 = value2-不知道为什么。

海原爱

如果单击type="submit"表单中的按钮,则默认情况下,浏览器将在提交表单后重新加载页面。

为防止页面重新加载,请替换type="submit"type="button"e.preventDefault()在内部sendValues处理程序中调用

附录:

根据MDN,按钮的默认值为submit

类型

按钮的类型。可能的值为:

提交:按钮将表单数据提交到服务器。如果未指定属性,或者将属性动态更改为空或无效值,则这是默认设置

重置:按钮将所有控件重置为其初始值。

按钮:按钮没有默认行为。它可以具有与元素的事件相关联的客户端脚本,这些脚本在事件发生时触发。

菜单:该按钮将打开一个通过其指定元素定义的弹出菜单。

本文收集自互联网,转载请注明来源。

如有侵权,请联系 [email protected] 删除。

编辑于
0

我来说两句

0 条评论
登录 后参与评论

相关文章

Chrome扩展程序消息传递:未发送响应

如何自动重新加载正在开发的Chrome扩展程序?

Chrome扩展程序将消息从iFrame发送到事件页面,然后再发送到内容脚本

页面重新加载后如何显示消息或警报?

保持Chrome扩展程序在页面上重新加载

在html模板中发送响应而无需重新加载页面

Google Chrome扩展程序:页面重新加载后如何立即注入脚本?

在Chrome扩展程序后台页面之间无法正确传递消息

如何在Chrome扩展程序中重新加载某些标签

Chrome扩展程序消息未发送响应(未定义)

如何从Chrome扩展程序向本机应用发送消息?

如何自动重新加载chrome扩展程序?

在Chrome扩展程序的背景页面的onClick事件上将消息发送到内容脚本

从已加载的iframe将消息发送回Chrome扩展程序

Chrome扩展程序在加载错误时重新加载页面

重新发送HTTP源(重新加载页面源代码)

PHP,重新加载页面并显示无效的凭据消息?

扩展表单而无需重新加载页面,导轨

重新加载页面后显示警报消息

表单提交/页面重新加载后的JavaScript成功消息

Chrome扩展页面重新加载

无法在Chrome扩展程序中从后台页面向内容脚本发送消息

Chrome扩展程序-等待页面重新加载以继续执行脚本

在 chrome 扩展中重新加载页面时执行特定的脚本文件

用户重新加载页面后如何执行代码?(Chrome 扩展程序)

无需重新加载页面即可发送通知等即时消息

将数据从页面发送到 chrome 扩展

每次加载页面时,如何从后台向 Chrome 扩展程序中的弹出窗口发送消息?

想在按下回车时发送消息但重新加载