Rails:服务器端运行HTML和Javascript

Rails: Server side run HTML and Javascript

本文关键字:Javascript HTML 运行 服务器端 Rails      更新时间:2023-11-02

我有一个应用程序,可以通过Google图表API创建图表。现在我想通过电子邮件或Telegram信使将图表的图像发送给用户。这是在浏览器中显示图像图表并通过AJAX将该图像发送到控制器的一个动作的代码。如何在服务器上运行此html脚本?

<html>
<head>
</head>
<body>
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script type="text/javascript" src="https://www.gstatic.com/charts/loader.js"></script>
  <script type="text/javascript">
    google.charts.load("current", {packages:['corechart']});
    google.charts.setOnLoadCallback(drawChart);
    function drawChart() {
      data2 = [['Time', 'Temp'],[1456099200,7.4],[1456102800,7.7],[1456106400,8.6],[1456110000,8.6],[1456113600,9.4]]
      var data = google.visualization.arrayToDataTable(
        data2
      );
      var options = {
        title: "Darestan Monitoring",
        legend: 'none',
        hAxis: {
          ticks: [{v: 1456099200, f: '1'},{v: 1456102800, f: '2'},{v: 1456106400, f: '3'},{v: 1456110000,f: '4'},{v: 1456113600, f: '5'}]
        },
        annotations: {
          style: 'line'
        }
      };
      var chart_div = document.getElementById('chart_div');
      var chart = new google.visualization.LineChart(chart_div);
      // Wait for the chart to finish drawing before calling the getImageURI() method.
      google.visualization.events.addListener(chart, 'ready', function () {
        var image_tag = '<img src="' + chart.getImageURI() + '">';
        chart_div.innerHTML = image_tag;
        console.log(chart_div.innerHTML);
        $.ajax({
          url: '/generate_chart/image_data',
          type: 'POST',
          data: {"image_data_tag": chart.getImageURI()},
          dataType: 'json',
          beforeSend: function(xhr) {xhr.setRequestHeader('X-CSRF-Token', $('meta[name="csrf-token"]').attr('content'))}
        });
      });
      chart.draw(data, options);
    }
  </script>
<div id='chart_div'></div>
</body>
</html>

wkhtml2image正是您想要的。

我们在ruby应用程序中使用了大量的PDFkit+wkhtml2pdf。

我们的设置:

ActiveJob+SuckerPunch+PDFKit。render_to_string有助于创建HTML文件,然后通过PDFKit将其传递给wkhtml2pdf。获取PDF,用回形针将其保存到模型中。确保等待javascript(wkhtml2image/pdf选项)

这不是那么琐碎,但效果很好,

祝你好运,

亚辛。