我们的h5是通过localstorage来存储token的,每次加载h5都会通过js来取localstorage中存储的token,然后通过token去访问服务器接口取数据。
- 页面加载完成后取token
$(document).ready(function(){
token = localStorage.getItem("token");
})
- 使用token访问服务器接口
$.ajax({
headers: {
Authorization: "Token " + token
},
type:"get",
dataType:"json",
data:{timestamp:Date.parse(new Date())},
url:server_host,
success:function(data){}
}
自从把iOS中的WebView换成WKWebView后,首次加载h5页面,h5页面中的js就拿不到localstorage了。
后来突然想出来个解决方法,即访问服务器的时候先判断一个token,token为空则自动刷新一下页面,这样就相当于非首次加载h5了,就可以拿到localstorage中的token了。
function get_gold_num(){
if (token === null) {
window.location.reload()
}
$.ajax({
headers: {
Authorization: "Token " + token
},
type:"get",
dataType:"json",
data:{timestamp:Date.parse(new Date())},
url:server_host,
success:function(data){}
}
- 如果是在react中
componentWillMount() {
if (token === null) {
token = localStorage.getItem("token")
if (token === null) {
window.location.reload()
}
}
}
经过研究,Android也是一样的毛病,问题在于写localstorage是在而且必须是在页面加载完成后完成
webView.setWebViewClient(new WebViewClient() {
@Override
public void onPageFinished(WebView view, String url) {
super.onPageFinished(view, url);
if (Build.VERSION.SDK_INT >= Build.VERSION_CODES.KITKAT) {
webView.evaluateJavascript("window.localStorage.setItem('" + key + "','" + value + "');", null);
} else {
webView.loadUrl("javascript:(function({window.localStorage.setItem('" + key + "','" + value + "')})()");
webView.reload();
}
//webView.destroy();
}
});
所以导致页面中的js执行完了才写localstorage,所以页面中的js首次加载是拿不到localstorage的。用本文的方法可以解决问题。
网友评论