Question

我正在尝试从json对象中获取信息。我从API获取信息并将其保存到我的localStorage。

我会在这里展示我的代码的一部分，并保存在localStorage中：

这是我在JavaScript中编写的一个函数，它从API获取信息并在网站上显示。它工作正常。

function showWeather(latitude, longitude, city) {
	var xhttp = new XMLHttpRequest();
	xhttp.onreadystatechange = function() {
		if (this.readyState == 4 && this.status == 200) {
			//console.log(this.responseText);
			var json = JSON.parse(this.responseText);
			document.getElementById("temperatuur").innerHTML = "Temperatuur: " + "&nbsp;" + (json.main.temp - 273).toFixed(1);
			document.getElementById("luchtvochtigheid").innerHTML = "Luchtvochtigheid: " + "&nbsp;" + json.main.humidity;
			document.getElementById("windsnelheid").innerHTML = "Windsnelheid: " + "&nbsp;" + json.wind.speed;
			function windrichting(){
				if (json.wind.deg > 0 && json.wind.deg < 90) {
					return "Noord-Oost";
				}
				else if (json.wind.deg > 90 && json.wind.deg < 180) {
					return "Zuid-Oost";
				} 
				else if (json.wind.deg > 180 && json.wind.deg < 270) {
					return "Zuid-West";
				}
				else if (json.wind.deg > 270 && json.wind.deg < 360) {
					return "Noord-West";
				}
				else if (json.wind.deg = 0) {
					return "Noord";
				}
				else if (json.wind.deg = 90) {
					return "Oost";
				}
				else if (json.wind.deg = 180) {
					return "Zuid";
				}
				else if (json.wind.deg = 270) {
					return "West";
				}
			}
			document.getElementById("windrichting").innerHTML = "Windrichting: " + "&nbsp;" + windrichting();
			var sunRiseA = new Date(json.sys.sunrise * 1000);
			var sunSetA = new Date(json.sys.sunset* 1000);
			sunRiseB = sunRiseA.toGMTString();
			sunSetB = sunSetA.toGMTString();
			document.getElementById("zonsopgang").innerHTML = "Zonsopgang: " + "&nbsp;" + sunRiseB;
			document.getElementById("zonsondergang").innerHTML = "Zonsondergang: " + "&nbsp;" + sunSetB;
			document.getElementById("titel2").innerHTML = "&nbsp;" + "<h3>Het weer in " + city + "</h>";
			
			
			var user1 = this.responseText;
			window.sessionStorage.setItem("user", JSON.stringify(user1));
			
			var user2 = JSON.parse(window.sessionStorage.getItem("user"));
			console.log(user2);
			
//			var user1 = { "firstname": "Joe", "my_apikey" : "secret" };
//			window.sessionStorage.setItem("user", JSON.stringify(user1));
//
//			var user2 = JSON.parse(window.sessionStorage.getItem("user"));
//			console.log(user2.firstname);

		}
	};

这是我最近添加的这部分代码：

      var user1 = this.responseText;
			window.localStorage.setItem("user", JSON.stringify(user1));
			
			var user2 = JSON.parse(window.localStorage.getItem("user"));
			console.log(user2);

当你看到我从API获取响应并将其添加到我的localStorage时，它工作正常，当我在控制台上打印对象时，我看到它们：

控制台日志：

{"coord":{"lon":7.29,"lat":9.4},"weather":[{"id":801,"main":"Clouds","description":"few clouds","icon":"02d"}],"base":"stations","main":{"temp":299.722,"pressure":967.13,"humidity":95,"temp_min":299.722,"temp_max":299.722,"sea_level":1023.55,"grnd_level":967.13},"wind":{"speed":4.23,"deg":214.001},"clouds":{"all":12},"dt":1525343157,"sys":{"message":0.0033,"country":"NG","sunrise":1525324408,"sunset":1525369321},"id":2322794,"name":"Suleja","cod":200}

localstorage日志：

"{\"coord\":{\"lon\":7.29,\"lat\":9.4},\"weather\":[{\"id\":801,\"main\":\"Clouds\",\"description\":\"few clouds\",\"icon\":\"02d\"}],\"base\":\"stations\",\"main\":{\"temp\":299.722,\"pressure\":967.13,\"humidity\":95,\"temp_min\":299.722,\"temp_max\":299.722,\"sea_level\":1023.55,\"grnd_level\":967.13},\"wind\":{\"speed\":4.23,\"deg\":214.001},\"clouds\":{\"all\":12},\"dt\":1525343157,\"sys\":{\"message\":0.0033,\"country\":\"NG\",\"sunrise\":1525324408,\"sunset\":1525369321},\"id\":2322794,\"name\":\"Suleja\",\"cod\":200}"

我习惯于在函数中看到：json.wind.deg。它从响应中提供了信息。

现在，当我尝试通过写入来获取本地存储的信息时：

的console.log（user2.main.temp）;

我收到了这个错误：

p2_functies.js：79未捕获的TypeError：无法读取未定义的属性'temp' 在XMLHttpRequest.xhttp.onreadystatechange（p2_functies.js：79）

是因为存储在本地/会话存储中的所有内容都保存为String吗？有没有其他方法来获取信息呢？

为什么我不能从localstorage中取出已解析的JSON对象？

0 个答案: