如何使用javascript读取post请求参数

时间:2009-09-11 04:46:37

标签: javascript html

我正在尝试从我的html中读取post请求参数。我可以使用javascript中的以下代码读取get请求参数。

$wnd.location.search

但是对于帖子请求它不起作用。任何人都可以告诉我如何使用javascript阅读我的html中的post请求参数值。

18 个答案:

答案 0 :(得分:144)

POST数据是服务器端处理的数据。 Javascript在客户端。因此,您无法使用JavaScript阅读帖子数据。

答案 1 :(得分:20)

让服务器填充JavaScript变量的一小段PHP快速而简单:

var my_javascript_variable = <?php echo $_POST['my_post'] ?>;

然后以正常方式访问JavaScript变量。

答案 2 :(得分:7)

JavaScript是一种客户端脚本语言,这意味着所有代码都在Web用户的计算机上执行。另一方面,POST变量转到服务器并驻留在那里。浏览器不会将这些变量提供给JavaScript环境,任何开发人员也不应期望它们神奇地存在。

由于浏览器不允许JavaScript访问POST数据,因此几乎不可能在没有外部actor(如PHP)将POST值回显到脚本变量或捕获传输中POST值的扩展/插件的情况下读取POST变量。 GET变量可通过变通方法获得,因为它们位于可由客户端计算机解析的URL中。

答案 3 :(得分:6)

  

为什么不使用localStorage或任何其他方式设置您的值   想通过?

这样你就可以从任何地方访问它了!

答案 4 :(得分:4)

使用sessionStorage!

<svg version="1.1" style="position: absolute; width: 1000px; height: 1000px; top: -0.457382px; left: -0.002841px;" xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink">
<g opacity="1" aria-label=": 24.38% 84 " visibility="visible" transform="translate(0,0)">
  <path cs="1000,1000" d=" M450.03754782613004,498.06263767618003 L375.0938695653251,495.1565941904501 A125,125,0,0,1,499.99999999999994,375 L500,450 A50,50,0,0,0,450.03754782613004,498.06263767618003 Z" fill="#741010" stroke="#000" stroke-width="2" stroke-opacity="1" fill-opacity="1" id="chart2-0"></path>
</g>
<g visibility="visible" transform="translate(0,0)" opacity="1">
   <text y="5" fill="#fff" font-family="Verdana" font-size="9px" opacity="1" text-anchor="middle" transform="translate(552,554)" style="cursor: default;" visibility="visible">
      <textpath xlink:href="#chart2-0">
          <tspan y="5" x="0">$260.5B</tspan>
          <tspan y="16" x="0">Satellite</tspan>
          <tspan y="27" x="0">Industry</tspan>
      </textpath>
   </text>
</g>
</svg>

在另一个page.html:

$(function(){
    $('form').submit{
       document.sessionStorage["form-data"] =  $('this').serialize();
       document.location.href = 'another-page.html';
    }
});

参考链接 - https://developer.mozilla.org/en-US/docs/Web/API/Window/sessionStorage

答案 5 :(得分:1)

我有一个简单的代码可以实现:

在您的index.php中:

<input id="first_post_data" type="hidden" value="<?= $_POST['first_param']; ?>"/>

在您的main.js中:

let my_first_post_param = $("#first_post_data").val();

因此,当将main.js包括在index.php(<script type="text/javascript" src="./main.js"></script>)中时,您将获得包含输入数据的隐藏输入的值。

答案 6 :(得分:1)

<script>
<?php
if($_POST) { // Check to make sure params have been sent via POST
  foreach($_POST as $field => $value) { // Go through each POST param and output as JavaScript variable
    $val = json_encode($value); // Escape value
    $vars .= "var $field = $val;\n";
  }
  echo "<script>\n$vars</script>\n";
}
?>
</script>

或使用它将它们放在函数可以检索的字典中:

<script>
<?php
if($_POST) {
  $vars = array();
  foreach($_POST as $field => $value) {
    array_push($vars,"$field:".json_encode($value)); // Push to $vars array so we can just implode() it, escape value
  }
  echo "<script>var post = {".implode(", ",$vars)."}</script>\n"; // Implode array, javascript will interpret as dictionary
}
?>
</script>

然后用JavaScript:

var myText = post['text'];

// Or use a function instead if you want to do stuff to it first
function Post(variable) {
  // do stuff to variable before returning...
  var thisVar = post[variable];
  return thisVar;
}

这只是一个示例,不应用于任何敏感数据,例如密码等。POST方法的存在是有原因的;将数据安全地发送到后端,这样会达到目的。

但是,如果您只需要一堆不敏感的表单数据即可进入下一个页面,而您的URL中没有/page?blah=value&bleh=value&blahbleh=value,那么这将使URL更加整洁,并且JavaScript可以立即与POST数据进行交互。

答案 7 :(得分:1)

如果您正在使用Java / REST API,则可以轻松解决此问题。在JSP页面中,您可以执行以下操作:

    <%
    String action = request.getParameter("action");
    String postData = request.getParameter("dataInput");
    %>
    <script>
        var doAction = "<% out.print(action); %>";
        var postData = "<% out.print(postData); %>";
        window.alert(doAction + " " + postData);
    </script>

答案 8 :(得分:1)

您可以使用jQuery-PostCapture(@ssut/jQuery-PostCapture)阅读post请求参数。

PostCapture插件由一些技巧组成。

单击“提交”按钮后,将调度onsubmit事件。

当时,PostCapture将序列化表单数据并保存到html5 localStorage(如果可用)或cookie存储。

答案 9 :(得分:1)

POST是浏览器从客户端(您的broswer)发送到Web服务器的内容。发布数据通过http标头发送到服务器,并且仅在服务器端或从客户端(您的浏览器)到Web服务器的路径(例如:代理服务器)之间可用。因此无法从JavaScript等客户端脚本处理。您需要通过CGI,PHP,Java等服务器端脚本来处理它。如果您仍然需要使用JavaScript编写,则需要一个能够在服务器中理解和执行JavaScript的Web服务器,如Node.js

答案 10 :(得分:0)

你可以&#39; json_encode&#39;首先通过PHP编码你的帖子变量。 然后从JSON编码的post变量创建一个JS对象(数组)。 然后使用JavaScript循环来操作这些变量......比如 - 在下面的例子中 - 填充HTML表单表单:

<script>

    <?php $post_vars_json_encode =  json_encode($this->input->post()); ?>

    // SET POST VALUES OBJECT/ARRAY
    var post_value_Arr = <?php echo $post_vars_json_encode; ?>;// creates a JS object with your post variables
    console.log(post_value_Arr);

    // POPULATE FIELDS BASED ON POST VALUES
    for(var key in post_value_Arr){// Loop post variables array

        if(document.getElementById(key)){// Field Exists
            console.log("found post_value_Arr key form field = "+key);
            document.getElementById(key).value = post_value_Arr[key];
        }
    }


</script>

答案 11 :(得分:0)

一种选择是在PHP中设置cookie。

例如:一个名为 invalid 的cookie,其值$invalid将在1天后到期:

setcookie('invalid', $invalid, time() + 60 * 60 * 24);

然后在JS中阅读它(使用JS Cookie插件):

var invalid = Cookies.get('invalid');

if(invalid !== undefined) {
    Cookies.remove('invalid');
}

您现在可以通过JavaScript中的invalid变量访问该值。

答案 12 :(得分:0)

这取决于您定义为JavaScript的内容。如今,实际上我们在诸如NodeJS之类的服务器端程序中都有JS。它与您在浏览器中编码的JavaScript完全相同,例如作为服务器语言。 因此,您可以执行以下操作:( Casey Chu的代码: https://stackoverflow.com/a/4310087/5698805

var qs = require('querystring');

function (request, response) {
    if (request.method == 'POST') {
        var body = '';

        request.on('data', function (data) {
            body += data;

            // Too much POST data, kill the connection!
            // 1e6 === 1 * Math.pow(10, 6) === 1 * 1000000 ~~~ 1MB
            if (body.length > 1e6)
                request.connection.destroy();
        });

        request.on('end', function () {
            var post = qs.parse(body);
            // use post['blah'], etc.
        });
    }
}

然后使用post['key'] = newVal;等...

答案 13 :(得分:-1)

function getParameterByName(name, url) {
            if (!url) url = window.location.href;
            name = name.replace(/[\[\]]/g, "\\$&");
            var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
                results = regex.exec(url);
            if (!results) return null;
            if (!results[2]) return '';
            return decodeURIComponent(results[2].replace(/\+/g, " "));
        }
var formObj = document.getElementById("pageID");
formObj.response_order_id.value = getParameterByName("name");

答案 14 :(得分:-1)

如果相同的浏览器首先发送它们,则POST变量仅对浏览器可用。如果另一个网站表单通过POST提交到另一个URL,浏览器将不会看到POST数据进入。

站点A:使用POST将表单提交到外部URL(站点B) 站点B:将接收访问者,但只有GET变量

答案 15 :(得分:-2)

$(function(){
    $('form').sumbit{
        $('this').serialize();
    }
});

在jQuery中,上面的代码将为您提供URL中带有POST参数的URL字符串。 提取POST参数并非不可能。

要使用jQuery,您需要包含jQuery库。请使用以下内容:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.1/jquery.min.js" type="text/javascript"></script>

答案 16 :(得分:-3)

我们可以使用serialize概念收集使用POST提交的表单参数。

试试这个:

$('form').serialize(); 

只需附上警报,它会显示所有参数,包括隐藏。

答案 17 :(得分:-4)

<head><script>var xxx = ${params.xxx}</script></head>

<head>中使用EL表达式$ {param.xxx}从post方法获取params,并确保在<head>之后包含js文件,以便您可以处理类似&#的参数39; XXX&#39;直接在你的js文件中。