在外部 Javascript 文件中使用 Ajax 将 Javascript 嵌套数组传递给 PHP

Question

我想将动态生成的嵌套 javascript 数组传递给 php 文件，以便稍后将其插入数据库。

数组是在 Javascript 文件中动态生成的。现在我想将该数组传递给一个 php 文件，该文件将该数据动态插入到数据库中。

我在 stackoverflow 上找到了这个问题的多个示例，但没有一个适合我的情况（它们都在 HTML 文件中工作）。

我要传递的数组：

1.  0:
  1.    cleintDate:"31/08/17"
  2.    cleintExpirydate:"29/11/17"
  3.    cleintState:"Department"
  4.    clientCode:"clientcode"
  5.    clientName:"Name"
  6.    messages:Array(2)
1.  0:
   1.   messageClient:"Name"
   2.   messageDate:"2017-08-31T00:00:00"
   3.   messageSubject:"subject "
   4.   messageText:"messageText "
   5.   messageTime:"13:22"
   6.   messageType:"link"
   7.   __proto__:Object
   2.   1:
   1.   messageClient:"Name"
   2.   messageDate:"2017-08-31T00:00:00"
   3.   messageSubject:"subject "
   4.   messageText:"messageText "
   5.   messageTime:"13:22"
   6.   messageType:"link"
   7.   __proto__:Object
   3.   length:2

**注意：**上面的示例在数组中包含 2 条消息，但在数组中存在 54 条消息的示例。 （数组文本略微编辑以隐藏个人信息）。

我如何生成这个数组：

matches[0].forEach(function(match, index) {
var cleintcode = /<div\s*class="t_seg_codCliente">(.*?)<\/div>/.exec(match)[1];
var cleintname = /<div\s*class="t_seg_nomCliente">(.*?)<\/div>/.exec(match)[1];
var taxId = /<div\s*class="t_seg_nifCliente">(.*?)<\/div>/.exec(match)[1];
var date = /<div\s*class="t_seg_fechaPresCliente">(.*?)<\/div>/.exec(match)[1];
var state = /<div\s*class="t_seg_estadoCliente">(.*?)<\/div>/.exec(match)[1];
var expirydate = /<div\s*class="t_seg_fechaCadCliente">(.*?)<\/div>/.exec(match)[1];
var communications = /<div\s*class="t_seg_comCliente"><a .*;">(.*?)<\/a>/.exec(match)[1];
var comclient = /<div\s*class="t_seg_comCliente"><a href="javaScript:popupComs\('(.*?)'/.exec(match)[1];
var messages = "link" + comclient;

var html1 = httpGet(messages);

const cleanupDocString = html1.replace(/(?:<!--|-->)/gm, '');

parser = new DOMParser();

htmlDoc = parser.parseFromString(cleanupDocString, "text/html");

var communicationsvalue = htmlDoc.getElementsByClassName("valorCampoSinTamFijoPeque")[0].textContent;

if (communicationsvalue.indexOf('No existen comunicaciones asociadas a este cliente.') !== -1) {
  console.log("This chat does not contain any communiction!");
} else {

  var adiv = document.createElement("div"),
    msgs = [],
    trs;

  adiv.innerHTML = cleanupDocString;
  trs = adiv.querySelectorAll('tr[bgcolor="#FFFFFF"]');
  trs.forEach(function(tr) {
    var d = [];
    tr.querySelectorAll("td")
      .forEach(function(td) {
        var img = td.querySelector("img"),
          src = img && img.attributes.getNamedItem("src").value;
        d.push(src || td.textContent);
      });
    msgs.push(d);
  });

  var mappedArray = msgs.map((msg) => {
    return {
      messageDate: msg[0],
      messageTime: msg[1],
      messageType: msg[2],
      messageClient: msg[3],
      messageSubject: msg[4],
      messageText: msg[5]
    }
  });

  var messageData = [{
    clientCode: cleintcode,
    clientName: cleintname,
    taxID: taxId,
    cleintDate: date,
    cleintState: state,
    cleintExpirydate: expirydate,
    messages: mappedArray
  }];

  console.log(messageData);
}
});

我试图用来传递数组的代码：

$.ajax({
      type: "POST",
      url: "../php/messageProcessing.php",
      data: {
        "id": 1,
        "myJSArray": JSON.stringify(messageData)
      },
      success: function(data) {
        alert(data);
      }
    });

它给我的错误：

Uncaught ReferenceError: $ is not defined
at ProcessAJAXRequest (getPagesSource.js:126)
at getPagesSource.js:139
at Array.forEach (<anonymous>)
at DOMtoString (getPagesSource.js:62)
at getPagesSource.js:150

总结：

如何使用 Ajax（或任何其他解决方案）从外部 Javascript 文件传递​​ Javascript 数组。

以及如何从消息中动态获取每条数据以插入数据库。

感谢您的任何帮助！

Answer 1

问题似乎是您使用了JQuery，而没有在页面上包含JQuery 库。 JQuery 库公开了一个全局变量 $，并且必须在被其他 javascript 文件使用之前加载到全局上下文中。

$.ajax({
  type: "POST",
  url: "../php/messageProcessing.php",
  data: {
    "id": 1,
    "myJSArray": JSON.stringify(messageData)
  },
  success: function(data) {
    alert(data);
  }
});

您可以通过在 cdn（最新版本）的页面中的某处包含 jQuery 来解决此问题：

<script
  src="https://code.jquery.com/jquery-3.2.1.min.js"
  integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
  crossorigin="anonymous"></script>

或者，如果您不打算使用 JavaScript 库，则必须研究如何使用 XmlHttpRequest 来完成您正在寻找的工作。这是内置在 javascript 语言本身中的。

如何从消息中动态获取要插入的每条数据 进入数据库？

您将在 PHP 脚本中收到一个 POST 请求，其中 myJSArray 在正文中。您将能够通过 $_POST['myJSArray'] 访问它，然后需要将其解析为 JSON，然后将其视为任何其他类型的 PHP 对象。