localStorage的不工作,如果一个网页已经打开
问题描述:
我创建了一个谷歌的Chrome扩展,从企业获取的商家信息的详细信息页面,并获取城市,州和邮编使用企业的地址与谷歌的地理编码的帮助API。我使用localStorage
像下面存储城市,州和销值:localStorage的不工作,如果一个网页已经打开
var city = "", state = "", pin = "";
var url = "https://maps.googleapis.com/maps/api/geocode/json?address="+encodeURIComponent(laddress[1].replace(/<.*?>/g,'').replace('&','&').trim())+"&sensor=false&key=AIzaSyCAQmrAKh0jzNVcT1VqTUhjB5Oh_dxl1zA";
console.log(url);
var xhr = new XMLHttpRequest();
var resp;
xhr.open("GET", url, true);
xhr.setRequestHeader("Content-Type", "*/*");
xhr.onload = function() {
var json = xhr.responseText; // Response
json = json.replace(/^[^(]*\(([\S\s]+)\);?$/, '$1'); // Turn JSONP in JSON
json = JSON.parse(json);
console.log(json.results[0].address_components);
for(var i=0;i<json.results[0].address_components.length;i++){
if(json.results[0].address_components[i].types[0]=="administrative_area_level_2")
city = json.results[0].address_components[i].long_name;
if(json.results[0].address_components[i].types[0]=="administrative_area_level_1")
state = json.results[0].address_components[i].long_name;
if(json.results[0].address_components[i].types[0]=="postal_code")
pin = json.results[0].address_components[i].long_name;
}
localStorage.setItem("city", city);
localStorage.setItem("state", state);
localStorage.setItem("pin", pin);
}
xhr.send();
lcity = localStorage.getItem("city");
lstate = localStorage.getItem("state");
lpin = localStorage.getItem("pin");
问题出现时
- 业务页面已经打开,我尝试单击扩展,localStorage的不会工作
- 有时,它没有表现出任何价值,有时它显示了值。
我应该怎么做才能在访问多个业务页面时获得localStorage
的完美值?
答
我相信你使用了错误的localStorage。虽然localStorage是按照HTML5定义的,但它需要像wwww.something.com这样的根源环境。
尝试使用chrome.storage。
要从文档修改的例子。让我们使用本地存储。
var city = "", state = "", pin = "";
var url = "https://maps.googleapis.com/maps/api/geocode/json?address="+encodeURIComponent(laddress[1].replace(/<.*?>/g,'').replace('&','&').trim())+"&sensor=false&key=AIzaSyCAQmrAKh0jzNVcT1VqTUhjB5Oh_dxl1zA";
console.log(url);
var xhr = new XMLHttpRequest();
var resp;
xhr.open("GET", url, true);
xhr.setRequestHeader("Content-Type", "*/*");
xhr.onload = function() {
var json = xhr.responseText; // Response
json = json.replace(/^[^(]*\(([\S\s]+)\);?$/, '$1'); // Turn JSONP in JSON
json = JSON.parse(json);
console.log(json.results[0].address_components);
for(var i=0;i<json.results[0].address_components.length;i++){
if(json.results[0].address_components[i].types[0]=="administrative_area_level_2")
city = json.results[0].address_components[i].long_name;
if(json.results[0].address_components[i].types[0]=="administrative_area_level_1")
state = json.results[0].address_components[i].long_name;
if(json.results[0].address_components[i].types[0]=="postal_code")
pin = json.results[0].address_components[i].long_name;
}
chrome.storage.local.set({“city”: city,
"state”: state,
"pin”: pin}, function(){
// Do stuff here after set.
chrome.storage.local.get(["city", "state", "pin",
function(items) {
lcity = items.city;
lstate = items.state;
lpin = items.pin;
}
});
}
xhr.send();
请记住修改清单中的权限以使用存储。
快速点: xhr.send()是一个异步调用。立即设置l *变量是您有时显示数据的问题。处理卸载或local.set回调。上面的例子在回调中有设置。
你的情况相当于https://*.com/questions/14220321/how-to-return-the-response-from-an-ajax-call - 你试图将它设置之前使用的值。 – Xan 2015-02-10 15:54:14