javascript - XMLHttpRequest POST _self 使用 localStorage 和 PHP

Question

我正在使用 PHP 7.3 和 MySQL v5.6。

浏览目录页面，我将一些项目 id 存储到localStorage.wishlistStorage.data，现在在愿望清单页面上，我想检索这个 id 列表以进行显示。我正在使用 PHP，因为稍后我将从数据库中发送和检索项目。此外，使用 PHP 和 POST 数组动态构建 HTML 也很容易。不幸的是，我正在为 AJAX XMLHttpRequest 苦苦挣扎。

我在页面底部加载一个 Javascript 文件来检索 localStorage 数据：

var wishlistStorage = {};

window.addEventListener("load", function() {
  wishlistStorage.get();
  loadWishlist();
});

wishlistStorage = {
  data : null, // empty storage
  get : function() {
    wishlistStorage.data = localStorage.getItem("wishlistStorage");
    if(wishlistStorage.data === null) { 
      wishlistStorage.data = { items: [], item_notes: [], comments: '' };
      wishlistStorage.save();
    }
    else { 
      wishlistStorage.data = JSON.parse(wishlistStorage.data); 
    }
  }
};

// get wishlist contents
function loadWishlist() {
  var items = wishlistStorage.data.items.join("%20");
  var wishlistRequest;
  if(window.XMLHttpRequest) {
    wishlistRequest = new XMLHttpRequest();
  } else {
    wishlistRequest = new ActiveXObject("Microsoft.XMLHTTP");
  }
  wishlistRequest.onreadystatechange = function() {
    if(wishlistRequest.readyState == 4 && wishlistRequest.status == 200) {
      console.log("Got them.");
    } else {
      console.log("I see nothing.");
    }
    wishlistRequest.open("POST", "_self", true);
    wishlistRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
    wishlistRequest.send("wishlist_items=" + encodeURIComponent(items));
  }
}

在 wishlist.php 的正文中

<?php
  if (array_key_exists('wishlist', $_POST)) {
    $temporary_wishlist = $_POST['wishlist'];
    echo "Yes, it works! $temporary_wishlist";
  } else {
    echo 'Invalid parameters!';
  }
?>

我得到的只是“无效参数”消息。没有任何 console.log 消息出现。我哪里错了？

资源

标签： javascriptphpajax