SQLFailover页面Toggle按钮POST数据至SQLAction页面时参数值为Undefined的问题排查与修复

咱们先揪出问题根源：你在构建POST表单的JavaScript循环逻辑写错了，导致传递的参数键名不对，进而在SQLAction.php里拿不到预期的键值对。

问题所在 #

看这段构建表单的代码：

for (key in Object.keys(payload)) {
  var input = document.createElement('input');
  input.name = key;
  input.value = payload[key];
  form.appendChild(input);
}

Object.keys(payload)会返回数组['server', 'username']，但你用for...in遍历这个数组时，拿到的key其实是数组的索引（0和1），而不是数组里的键名。这就导致你创建的input标签name属性是0和1，而不是你期望的server和username。当SQLAction.php读取$_POST['server']时自然就会返回Undefined了。

修复方案 #

有两种简单的修复方式，选一种就行：

方式1：用for...of遍历键名数组

把循环改成这样：

for (const key of Object.keys(payload)) {
  var input = document.createElement('input');
  input.name = key;
  input.value = payload[key];
  form.appendChild(input);
}

for...of会直接遍历数组里的元素（也就是server和username），这样input的name就正确了。

方式2：直接遍历payload对象

如果不想用数组，也可以直接遍历payload本身：

for (const key in payload) {
  // 确保只遍历对象自身的属性，避免原型链污染
  if (payload.hasOwnProperty(key)) {
    var input = document.createElement('input');
    input.name = key;
    input.value = payload[key];
    form.appendChild(input);
  }
}

额外的小修复 #

还有两个细节需要调整：

1. SQLAction.php里的重定向语句有多余空格，会导致重定向失败，改成：

header('refresh:5; url=/SQLFailover.php');

2. 可以在JavaScript的change事件里加个调试日志，确认参数是否正确：

$('.toggle-event').change(function() {
  var serverName = $(this).data('server-name');
  var mode = $(this).prop('checked');
  var username = '<?=$UserSession?>';
  // 调试用，确认参数值
  console.log('serverName:', serverName, 'username:', username);
  var payload = { server: serverName, username: username };
  // ... 剩下的表单构建代码
})

修复后的完整SQLFailover.php脚本（关键部分） #

<script>
$(function() {
  $('.toggle-event').change(function() {
    var serverName = $(this).data('server-name');
    var mode = $(this).prop('checked');
    var username = '<?=$UserSession?>';
    console.log('serverName:', serverName, 'username:', username); // 调试日志
    var payload = { server: serverName, username: username };
    var form = document.createElement('form');
    form.style.visibility = 'hidden';
    form.method = 'POST';
    form.action = '/SQLAction.php';
    // 修复后的循环
    for (const key of Object.keys(payload)) {
      var input = document.createElement('input');
      input.name = key;
      input.value = payload[key];
      form.appendChild(input);
    }
    document.body.appendChild(form);
    form.submit();
  })
})
</script>

修复后的SQLAction.php #

<?php 
echo "<b>begin POST values</b><br><br>"; 
foreach ($_POST as $key => $value) { 
    echo "<tr>"; 
    echo "<td>"; echo $key; echo "</td>"; 
    echo " : "; 
    echo "<td>"; echo $value; echo "</td>"; 
    echo "</tr>"; 
    echo "<br>"; 
} 
echo "<b>end of POST values</b><br><br>"; 
// 修正重定向语句
header('refresh:5; url=/SQLFailover.php'); 
?>

这样修改后，POST参数就能正确传递到SQLAction.php，你应该能看到server和username对应的键值对了。

内容的提问来源于stack exchange，提问作者Fixxer