javascript - 将 localStorage 值传递给 php

标签 javascript php ajax html2canvas data-uri

我有一个生成图表的页面。我有一个按钮可以为其生成 pdf 报告。我想创建该图表的图像并将其插入到 pdf 中。为了创建图像,我使用 html2canvas 并获取存储在 localstorage 中的 dataurl。

chart.php
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>

<script type="text/javascript">
   $(document).ready(function() {
        $('#download').click(function() {
             $.ajax({
                type: "POST",
                url: "pdfGen.php",
                data: 'hello',
                success: function(data) {
                    alert("hi");
                }
              });
         });
   }); //END $(document).ready()
</script>

<script>
  //<![CDATA[
  (function() {
     window.onload = function(){
         html2canvas(document.getElementById('chart'), {
              "onrendered": function(canvas) {
                   var img = new Image();
                   img.onload = function() {
                       img.onload = null;
                       console.log(canvas.toDataURL("image/png"));
                       window.localStorage.setItem("imgURL", canvas.toDataURL("image/png"));
                   };
                   img.onerror = function() {
                       img.onerror = null;
                       if(window.console.log) {
                           window.console.log("Not loaded image from canvas.toDataURL");
                       } else {
                           //alert("Not loaded image from canvas.toDataURL");
                       }
                   };
                   img.src = canvas.toDataURL("image/png");
               }
            });
         };
     })();
//]]>
</script>    
<body>
   <a href="pdfGen.php" id="download" class="button">Report</a> 
   ..more code to generate the chart
</body>

下载按钮调用 pdfGen.php 脚本,该脚本使用 fpdf 生成报告。 pdfGen.php

<?php
    echo $_POST['data']; //gives error
    /*$pdf = new FPDF();
    $pdf->AddPage();

    //over here I want to add the image from the chart.php page whose data url is now in the localstorage.
    ..more code to generate report
    $pdf->output();*/
 ?>

如何获取 php 脚本中的图像?我尝试进行 ajax 调用,但在 pdfGen.php 脚本中得到 undefined index 数据。我收到警报 HI,但无法获取服务器上的数据。 好像不行。

最佳答案

你的ajax调用是错误的。

您的调用应该像这样在data变量/键中获取值hello

$('#download').click(function(e) {
    e.preventDefault();
    $.ajax({
        type: "POST",
        url: "pdfGen.php",
       data: 'data=hello',
       success: function(data) {
           alert("hi");
       }
   });
});

了解有关 jQuery Ajax 的更多信息引用这个link .

关于javascript - 将 localStorage 值传递给 php,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/31777250/

相关文章:

php - 从while循环中删除最后一个逗号

javascript - 通过 jQuery 检索输入后触发 Parsley.js 验证错误

javascript - JavaScript 中的 const 和 const {} 有什么区别

JavaScript 在 Firefox 下可以工作,但在 IE 下不起作用

javascript - jQuery .remove() 不工作

PHP,MySQL - 你能区分匹配的行和受影响的行吗?

javascript - JQuery按属性选择按钮元素

php - 从日期=本月的数据库中获取最大行号+1

Ajax 请求不是异步的

javascript - 通过ajax加载图像时出现无限循环