0

大変お世話になっております。

あるサイト①から他のサイト②を開く際に①の値をget送信し、その開いたサイト②にて、urlから値を取得し、更に他のサイト③にその値を送信するために、その値を②にて代入する以下の様な設定が機能しております。

これをget送信でなく、method="post"の様にpost送信にした場合、サイト②ではどのように取得し、値を代入すれば宜しいかご教授頂けませんでしょうか。

つまり、以下のサイト①でmethod="post"を使用した場合のサイト②内でのjavascriptの記述方法をご教授頂けませんでしょうか。

サイト①
<form name="reserve" method="get" action="http://xxxx.com/send.html">
<input type="hidden" name="id" value="{$product.id}" />
<input type="submit" value="送信する" class="sendButton">
</form>


サイト②
http://xxxx.com/send.html?id=7

<script type="text/javascript"> 
const url = new URL(location.href);
const id = url.searchParams.get("id");
</script>

<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() {
document.getElementById('id').value = id;
  });
</script>

<form id="Form" method="post" action="xxxxxxx">
<input name="id" id="id" type="hidden" value="" />
<input type="submit" value="送信する" class="sendButton">
</form>

追記:

サイト①
php:
<?php
    $post_json_data = json_encode($_POST);
?>


<form name="reserve" method="post" action="http://xxxx.com/send.html">
<input type="hidden" name="id" value="{$product.id}" />
<input type="hidden" name="cusotmer_id" value="{$smarty.get.cusotmer_id}" />
<input type="submit" value="送信する" class="sendButton">
</form>


サイト②
http://xxxx.com/send.html

<script type="text/javascript"> 
const post_data = <?php echo $post_json_data; ?>;
</script>

***
<h1><input type="text" disabled name="cusotmer_id" id="cusotmer_id" value=""></h1>

<form id="Form" method="post" action="xxxxxxx">
<input name="id" id="id" type="hidden" value="" />
<input name="customer_id" id="customer_id" type="hidden" value="" />
<input type="submit" value="送信する" class="sendButton">
</form>

頂きました記述をもとに、json_encode、およびもう一方の個々に取得する方法の両者を試しておりますが、どうしても両者とも値を取得、そして設定できません。

実際は、値が複数存在しますので、json_encodeで試した記述を追記に補足しました。サイト②のjavascriptで取得した値であるpost_dataはどのようにhtml上でそれぞれのvalueに設定されるのでしょうか。試しにサイト②の***でcusotmer_idを表示させてみると[object HTMLCollection] と表示されます。

2 件の回答 2

1

PHPからHTML側のJavascriptにサーバ側のデータを渡す方法はいくつかありますが、
一般的にはjson_encodeを利用することが多いと思います。

<?php
    $post_json_data = json_encode($_POST);
?><html>
  <head>
  <head>
  <body>
    <script type="text/javascript"> 
        const post_data = <?php echo $post_json_data; ?>;
    </script>
  <body>
<html>

ただ今回の場合のように特定の値一つだけで、値の無害化を確実にもれなく十分に実行できるような場合は直接渡してしまっても良いとは思います。

<?php
    //例として必ずidにはint型しか入らないという前提の弱い無害化
    $id = (int)$_POST["id"];
?><html>
  <head>
  <head>
  <body>
   <script type="text/javascript"> 
        const id = <?php echo $id;?>;
    </script>
  <body>
<html>

以下はWebのサーバとクライアントの基礎知識です。
もしご存知の場合は、飛ばして頂いてOKです。

クライアントはサーバにリクエストします。
サーバはリクエストに対してレスポンスを返します。

PHPはサーバサイドの言語、HTML側のJavascriptはクライアントサイドの言語です。
そしてPOSTとはクライアントサイドからリクエストする方式の一つです

そのためイメージとしては
(HTML+Javascript)→(PHP)→(HTML+Javascript)→(PHP)→(HTML+Javascript)→…
とデータをクライアントに返す、データをサーバに送るを繰り返します。

1
  • keitaro_so様、ご教授頂きまして感謝致します。追記致しました。どこに問題があるかお教え願いませんでしょうか。 Commented 2018年12月25日 11:38
0

単純にpostで'data1=a1&data2=a2&data3=a3&data4=a4'を送り、サーバからの結果をjsonで受けるサンプルを書いて見ました。

<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<script type="text/javascript">
    var xhr = new XMLHttpRequest();

    xhr.onreadystatechange = function() {
        if (xhr.readyState === 4) {
            if (xhr.status === 200) {
                console.log(xhr.response);
                var datas = xhr.response;
                console.log(' data1:'+datas.data1);
                console.log(' data2:'+datas.data2);
                console.log(' data3:'+datas.data3);
                console.log(' data4:'+datas.data4);

            } else {
                console.log("status = " + xhr.status);
            }
        }
    };

    var senddata = 'data1=a1&data2=a2&data3=a3&data4=a4';

    xhr.open("POST", 'index.php');
    xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
    xhr.responseType = "json";
    xhr.send(senddata);
</script>
</body>
</html>

index.phpは

<?php

$data1 = $_POST['data1'];
$data2 = $_POST['data2'];
$data3 = $_POST['data3'];
$data4 = $_POST['data4'];

$arr_data = array('data1'=>$data1,'data2'=>$data2,'data3'=>$data3,'data4'=>$data4);

$json_str = json_encode($arr_data);

echo $json_str;
1
  • yyz様、ご教授頂きまして本当に感謝いたします。頂いた記述をもとに、私のケースに合う様に様々な方法で試しておりますが、もう一方の記述も含め、どうしてもhtml側で値を取得できません。 具体的には頂いた記述をまずはどの様にform内のvalueに当てはめ、そして送信する様に設定すれば宜しいのでしょうか。 (私の上記の質問に合う様に設定すれば宜しいでしょうか) Commented 2018年12月27日 10:44

この質問に回答するには、ログインする必要があります。

求めていた回答ではありませんか? のタグが付いた他の質問を参照する。