存储和调用 Cookie Javascript 时出现问题

Issue with storing and recalling cookies Javascript

提问人:Jobalisk 提问时间:5/28/2018 最后编辑:IvanJobalisk 更新时间:6/6/2018 访问量:279

问:

因此,我正在尝试保存并加载包含产品详细信息列表的 cookie,然后将这些产品详细信息显示到页面上。

但是,当我运行它时,我收到的是一个

ReferenceError:找不到变量:GetProductPrice

尝试读取我使用该函数存储的 cookie 时。GetProductPrice()

cookie 存储器在网站首次加载时运行。它创建了一个产品列表,我以后打算将其用作购物车的一部分。然后,它应该保存此 cookie,以便在用户转到其他页面时可以再次访问它。这样,如果用户将商品添加到购物车,则以后不会重置购物车变量。但是,正如我之前所说,这是行不通的。加载和保存 cookie 函数是由其他人在 Stack Overflow 上创建的,并且工作正常。

以下是 Cookie 保护程序的代码,该代码应仅在用户首次访问网站时运行:

function setUpProducts() { //in here we define each of the products when we first start up. This way we know what products the customer has access to.
  setUpPages();
  try {
    hasRun = getCookie('hasRunCookie'); //get the has run cookie from before, or at least try to
  } catch {
    hasRun = 0;
  }
  //if (hasRun != 1){ //only run this the first time, otherwise we dont need to.
  if (hasRun != 1) {
    hasRun = 1;
    createCookie('hasRunCookie', hasRun);
    var dataList = []; //array for holding the raw data
    var nameList = [];
    var priceList = [];
    var amountList = []; //lists for temporrily holding data before it is put in the product list's product objects.
    var set1 = 0; //allows differentiating between different values in the raw data
    var productIds = 0; //product ID to differentiate between products easily

    $.get('../productdata.txt', function(data) { //the text file product data contains all the product infomation so that it can be changed at a moments notice.
      //var fileDom = $(data);

      dataList = data.split("\n");
      $.each(dataList, function(n, elem) {
        $('#myid').append('<div>' + elem + '</div>');
      });
    });

    var i;
    for (i = 0; i < dataList.length; i++) { //this gets the infomation from the text file and loads it into the products
      if (set1 == 0) {
        nameList.push(dataList[i]);
        set1 = 1;
      } else if (set1 == 1) {
        priceList.push(dataList[i]);
        set1 = 0;
      }
    }
    while (productIds != 8) { //make the products, programing counting always starts at 0, so 8 is actually the 9th number.
      var productObject = {
        productID: productIds,
        productName: nameList[productIds],
        productPrice: priceList[productIds],
        purchasedAmount: 0
      };
      productList.push(productObject); //put each product into the product list.
      productIds += 1;
    }
    var json_str = JSON.stringify(productList); //bottle and store our list of products
    createCookie('ProductListCookie', json_str);
    //}

  }

以下是用于加载 cookie 并在相关产品页面上显示产品价格的代码:

function GetProductPrice(productIdz) {
  var json_str = getCookie('hasRunCookie');
  productList = JSON.parse(json_str);
  for (i = 0; i < productList.length; i++) {
    if (productList[i].productID == productIdz) {
      productHolder = productList[i];
      document.getElementById("price").innerHTML = productHolder.productPrice;
    }
  }
}
JavaScript 饼干

评论

1赞 charlietfl 5/28/2018
强烈建议使用 localStorage 而不是 cookie。请记住,对服务器的每个请求(图像、css、数据、脚本文件、html 等)都必须发送该 cookie
0赞 Jaromanda X 5/28/2018
EOF error哼?cookie 不会产生 EOF 错误 - 也许是垃圾?load and save cookie functions are
0赞 Jobalisk 5/28/2018
不,它们运行良好,EOF 是我尝试加载包含产品的列表后生成的。我正在研究本地存储,但是,如果我错了,请纠正我,它不适用于较旧的浏览器,对吗?
0赞 Jobalisk 5/28/2018
Cookie 功能记录在此处:stackoverflow.com/questions/4825683/...
0赞 Jobalisk 5/29/2018
好的,我现在有一个不同的错误,更新这个线程。

答:

5赞 lucchi 5/31/2018 #1

本来会发表评论,但不能。

首先,如果得到: ReferenceError: Can't find variable: GetProductPrice,则可能是该页面中未定义 GetProductPrice 函数,或者可能尚未定义,请检查脚本的加载顺序。

第二:

function GetProductPrice(productIdz){
  var json_str = getCookie('hasRunCookie'); // this is 1
  productList = JSON.parse(json_str) // this also is 1

getCookie('ProductListCookie')

会起作用吗?

5赞 ssten 5/31/2018 #2

使用 localStorage

//Set
localStorage.setItem('ProductListCookie', json_str);

//Get
var json_str = localStorage.getItem('ProductListCookie');
1赞 Minderov 6/5/2018 #3

正如其他人所提到的,这意味着 JS 根本找不到你的函数。确保调用的代码可以访问该函数。ReferenceError: Can't find variable: GetProductPriceGetProductPrice()

另外,您不应该为此使用 cookie。Cookie 会随每个请求一起发送到服务器,这将增加服务器的负载并减慢用户的页面加载速度。

出于您的目的,请考虑使用 localStorage,所有现代浏览器甚至 IE 8+ 都支持它,并且可以完成您需要的一切,而无需向服务器发送不必要的信息。而且您几乎不需要更改代码。

0赞 Armin Ghasemi 6/6/2018 #4

我认为您正在定义发生时的功能。 如果,您必须像这样定义您的函数:page.onload

window.GetProductPrice = function(productIdz){

检查一下,让我知道结果。

0赞 R.hui 6/6/2018 #5

一般来说,cookie 限制为 4k,因此 localStorage 更好。