通过ajax发送一个js数组答案

【问题标题】：Send an JS array through Ajax通过ajax发送一个js数组
【发布时间】：2020-09-28 01:27:43
【问题描述】：

我在 JS 中有这种类型的数组：

[{
  websitetype: "onepager"
}, {
  layout: "provided"
}, {
  layout_provided: "wireframes"
}, {
  languages: "single"
}, {
  client_name: "dasda"
}, {
  client_email: "asdasd@asdasd.fr"
}, {
  client_conditions: "on"
}, {
  client_newsletter: "on"
}]

如何通过 Ajax 发送？

我尝试的是：

$.ajax({
    type: 'POST',
    url: 'assets/send.php',
    data: {datas},
    success: function(response) { },
});

这是我想在 PHP 中得到的：

[datas] => Array
    (
        [websitetype] => onepager
        [layout] => provided
        [layout_provided] => wireframes
        [languages] => single
        [client_name] => dasda
        [client_email] => asdasd@asdasd.fr
        [client_conditions] => on
        [client_newsletter] => on
    )

请问我在这里缺少什么？

谢谢。

【问题讨论】：

这完全取决于您的 send.php 脚本所期望的内容
datas 定义了吗？它是否包含您期望的数据？在浏览器的调试工具中，在网络选项卡上，请求中是否存在数据？这具体是如何失败的？
@Phil，用 PHP 中的所需输出更新了代码。其实我在一个数组中有一个数组。
你不能通过 ajax 发送整个数组。这就是我在answer 中所说的 - 使用 formData 对象发送所有 HTML 数据，无论您需要什么，都可以让您轻松。 查看您发布的问题他们都谈到了将数据发送到 PHP 的一件事 - 它可以简化为 uisng formData。没有必要将数据存储在 ARRAY 中（除非它也在其他地方使用）然后循环该数组以在 formData 中发送数据并发送到 PHP。希望这一切都有意义。 :)
@AlwaysHelping “你不能像这样通过 ajax 发送整个数组”。你当然可以。这就是 application/json 内容类型的用途

标签： javascript arrays ajax

【解决方案1】：

您应该做的第一件事是将数组缩减为与您想要的格式匹配的对象

const dataObject = Object.fromEntries(datas.flatMap(o => Object.entries(o)))

如下所示

{
  "websitetype": "onepager",
  "layout": "provided",
  "layout_provided": "wireframes",
  "languages": "single",
  "client_name": "dasda",
  "client_email": "asdasd@asdasd.fr",
  "client_conditions": "on",
  "client_newsletter": "on"
}

然后你有两个选项可以将它发布到 PHP

以原始 JSON 格式发送

$.ajax({
  method: "POST",
  url: "assets/send.php",
  contentType: "application/json",
  data: JSON.stringify(dataObject),
  processData: false
})

然后在PHP中读取并解析JSON

$datas = json_decode(file_get_contents("php://input"), true);

// example
echo $datas["websitetype"]; // "onepager"

或者，让 jQuery 将数据格式化为关联的 PHP 数组

$.ajax({
  method: "POST",
  url: "assets/send.php",
  data: {
    datas: dataObject
  }
})

这将发布一个application/x-www-form-urlencoded 的请求正文

datas%5Bwebsitetype%5D=onepager&datas%5Blayout%5D=provided&datas%5Blayout_provided%5D=wireframes&datas%5Blanguages%5D=single&datas%5Bclient_name%5D=dasda&datas%5Bclient_email%5D=asdasd%40asdasd.fr&datas%5Bclient_conditions%5D=on&datas%5Bclient_newsletter%5D=on

PHP 可以通过 $_POST 将其作为数组读取

print_r($_POST['datas']);

结果

Array
(
    [websitetype] => onepager
    [layout] => provided
    [layout_provided] => wireframes
    [languages] => single
    [client_name] => dasda
    [client_email] => asdasd@asdasd.fr
    [client_conditions] => on
    [client_newsletter] => on
)

【讨论】：

【解决方案2】：

将您的数据字符串编码为 JSON。

const datas = [{
  websitetype: "onepager"
}, {
  layout: "provided"
}, {
  layout_provided: "wireframes"
}, {
  languages: "single"
}, {
  client_name: "dasda"
}, {
  client_email: "asdasd@asdasd.fr"
}, {
  client_conditions: "on"
}, {
  client_newsletter: "on"
}]
const jsonString = JSON.stringify(datas)

$.ajax({
    type: 'POST',
    url: 'assets/send.php',
    data: { datas: jsonString },
    success: function(response) { },
});

在你的 PHP 中：

$data = json_decode(stripslashes($_POST['datas']));

// here i would like use foreach:

foreach($datas as $data){
   echo $data;
}

【讨论】：

为什么要通过 application/x-www-form-urlencoded 发送 JSON？