如何使用 GM_xmlhttpRequest 提交到基本的外部表单页面？答案

【问题标题】：How to submit to a basic, external form page using GM_xmlhttpRequest?如何使用 GM_xmlhttpRequest 提交到基本的外部表单页面？
【发布时间】：2014-10-14 16:09:25
【问题描述】：

我为 Greasemonkey 创建了一个基本脚本，以便在 Stack Overflow 上搜索单词 test。

根据GM_xmlhttpRequest documentation，请求的参数应该在data参数中指明。

// ==UserScript==
// @name        Test Search SO
// @namespace   Test Search SO
// @description Test Search SO
// @include     http://YOUR_SERVER.COM/YOUR_PATH/*
// @version     1
// @grant       GM_xmlhttpRequest
// ==/UserScript==

alert("Ready?");

GM_xmlhttpRequest({
  url: "http://stackoverflow.com/search",
  method: "GET",
  data: "q=test",
  onload: function(response) {
    document.getElementsByTagName("html")[0].innerHTML = response.responseText;
    alert("Done.");
  }
});

不幸的是，结果只是页面http://stackoverflow.com/search，就像data 被忽略时一样。

请问我该如何解决这个问题？

【问题讨论】：

标签： javascript forms greasemonkey gm-xmlhttprequest

【解决方案1】：

要将数据发送到表单页面，通常必须使用POST。
要使用 POST，您通常还必须确保编码符合页面的预期。

这行得通：

GM_xmlhttpRequest ( {
    url:        "http://stackoverflow.com/search",
    method:     "POST",
    data:       "q=" + encodeURIComponent ("test"),
    headers:    {
        "Content-Type": "application/x-www-form-urlencoded"
    },
    onload:     function (response) {
        document.getElementsByTagName ("html")[0].innerHTML = response.responseText;
        alert ("Done.");
    }
} );

（不要忘记对参数进行 URI 编码。）

或者，许多此类页面将接受 GET 请求，但随后您将数据作为 URL 参数发送：

GM_xmlhttpRequest ( {
    url:        "http://stackoverflow.com/search?q=" + encodeURIComponent ("test"),
    method:     "GET",
    onload:     function (response) {
        document.getElementsByTagName ("html")[0].innerHTML = response.responseText;
        alert ("Done.");
    }
} );

【讨论】：