是否可以将从Javascript中的API调用接收的var传递给php?

时间:2017-05-17 00:24:44

标签: javascript php ajax api

我正在进行API调用并收到回复。我在Javascript中的变量中保存了部分响应。我想将该变量传递给php文件“main_page.php”。我试图在函数内部使用ajax来使用变量并将其传递给php文件,然后在php文件中回显它但它似乎不起作用。甚至可能吗?如果是这样,请告诉我如何。谢谢!

这是我的javascript文件,它进行API调用并返回响应正文。我试图将var urlVal传递给我的php文件。我不需要在php中打印出来。它仅用于测试目的。我回应它以确保它在那里。到目前为止,我无法将其传递给php,因为我在控制台中看不到任何内容。

//s is the Sheet
WorksheetPart wsPart = workBookPart.GetPartById(s.Id) as WorksheetPart;

foreach (var control in wsPart.ControlPropertiesParts)
{
    string ctrlId = wsPart.GetIdOfPart(control);
    Console.Write("Control Id: {0}", ctrlId);
    if (control.FormControlProperties.Checked != null)
        Console.Write("Checked");
    Console.WriteLine();
}

这是我在php文件“main_page.php”中的一些代码:

document.addEventListener('DOMContentLoaded', bindButtons); 

    function bindButtons(){
            document.getElementById('submit').addEventListener('click',function(event){

                    var req = new XMLHttpRequest();
                    req.open("GET","https://api.nasa.gov/planetary/apod?api_key=" + apiKey, true);


                    req.addEventListener('load', function(){
                    if(req.status >= 200 && req.status < 400)
                        {
                            var response = JSON.parse(req.responseText);
                            console.log(response);
                            var urlVal = document.getElementById('showname').textContent = response.hdurl;


                            $.ajax({
                             type: 'POST',
                             url:'main_page.php', 
                                 data:{
                                    'total' : $("#showname").textContent(),},
                                 success: function(response){
                            }} );

                    req.send(null);


                    event.preventDefault(); }
                    )
                    }

1 个答案:

答案 0 :(得分:0)

是的,这是可能的。虽然,究竟要做什么还不清楚。这是建立......的一种工作方法。

main_page.php:

<?php
      if($_SERVER['REQUEST_METHOD'] === 'POST') {
        echo $_POST['total'];
      }
?>

的index.html:

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</head>
<body>
  <button id='submit'> SUBMIT! </button>
  <BR><BR><BR>
  <div id= "second">
    <h2>PREVIEW</h2>
    <p class = "api_desc"> <span id= "showname"> </span> </p> 
  </div>
</body>

<script>
document.addEventListener('DOMContentLoaded', bindButtons); 
function bindButtons(){
    document.getElementById('submit').addEventListener('click',function(event){
        var req = new XMLHttpRequest();
        req.onreadystatechange = function() {
            if (this.readyState == 4 && this.status == 200) {
              var response = JSON.parse(req.responseText);
              console.log(response.hdurl);
              var urlVal = document.getElementById('showname').innerText = response.hdurl;
              //console.log($("#showname").text());

              $.ajax({
                type: 'POST',
                url:'main_page.php', 
                data: {'total' : $("#showname").text()},
                success: function(response,status,xhr){
                    alert(response)
                }
              });
          }
        };
        req.open("GET", "api.json", true);
        req.send();
      });
    }
</script>
</html>

api.json:

{"id":"one","data":"stuff","hdurl":"http://www.example.com/"}