uniapp的webview 嵌入商城登录异常cookie丢失

背景

公司一个uniapp开发的聊天系统， 其中用webview嵌入了一个商城，这个商城代码比较老是前后端不分离的，使用的是cookie进行的用户数据流转。实际过程中不管用户是否登录，只要进入到需要验证用户信息的页面就不停的跳登录框，不管用户是否已经登录过了。这个商城在H5浏览器上面运行是正常的。

原因

我觉得是uniapp 实现webview和原生还是有点区别的 原生是直接用了一个浏览器 uniapp 是用了浏览器然后里面嵌套了一个iframe 从而导致了问题的发生

解决方案

最最重要的一点 如果是打包app的，打成app cookie的问题就不存在，所以用不到本方案
本方案仅仅适用于前后端不分离，而且接口都没有封装的那些老程序，如果您的商城是前后端分离，对接口进行了封装，请直接在封装的接口用一个命令把cookie 加进去就行，下面的方法比这个复杂多了 请不要使用。

思路
1、拦截所有的a标签跳转（因为是不分离的 a标签有时候就返回的是网页，还需要用户信息），把跳转地址上面加上用户信息
给所有的form请求的地址加上需要的用户信息
2、给所有的请求携带用户信息

拦截a标签，给form地址加上需要的用户信息

//这里要获取一下，防止那手特别快的 页面还没渲染完就点跑了 第一次的localStorage.setItem("storeUserId", theRequest.user_id);是在登录页完成的，请自行补充，尽量让修改后的程序结实一点
var link_user_id = localStorage.getItem("storeUserId");
if (!link_user_id) {
	let url = window.location.search
	var theRequest = new Object();
	if (url.indexOf("?") != -1) {
		var str = url.substr(1);
		strs = str.split("&");
		for (var i = 0; i < strs.length; i++) {
			theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
		}
	}
	link_user_id = theRequest.user_id
	 localStorage.setItem("storeUserId", theRequest.user_id);
}



setUserId4store()//页面进入就为a标签加一次user_id
$(document).ajaxStop(function() {//所有通信完成再为a标签加载一次user_id
	setUserId4store()
});
document.onreadystatechange = function(){//页面加载完成再为a标签加载一次user_id
    if(document.readyState == 'complete'){
        setUserId4store()
    }
}
function setUserId4store() {
    
	var link = document.getElementsByTagName("a")
	var formlist=document.getElementsByTagName("form")
// 	console.log("setUserId4store",formlist,link_user_id)
	if (link_user_id) {
		for (let i = 0; i < link.length; i++) {
			let aElement = link[i]
			aElement.addEventListener("click", function(e) {
				stopADefault(e, this)
			})
		}
		for (let i = 0; i < formlist.length; i++) {
			let aElement = formlist[i]
			console.log(aElement.action)
			if (aElement.action.indexOf("?") != -1){
		        aElement.action= aElement.action + "&user_id="+link_user_id
        	}else {
        	    aElement.action = aElement.action+ "?user_id="+link_user_id
        	}
		}
	}
	
	
}

function stopADefault(e, aElement) {
	e.preventDefault();
	if(aElement.attributes["href"]){
	    	console.log('aElement.attributes["href"].nodeValue',aElement.attributes["href"].nodeValue)
	if (aElement.attributes["href"].nodeValue.indexOf("?") != -1){
		window.location.href = aElement.attributes["href"].nodeValue + "&user_id="+link_user_id
	}else if(aElement.attributes["href"].nodeValue.indexOf("mobile") != -1){
		window.location.href = aElement.attributes["href"].nodeValue + "?user_id="+link_user_id
	}else if(aElement.attributes["href"].nodeValue.indexOf("history.go(-1)") != -1){
		history.go(-1)
	}
	}

}

修改jquery 源码

失败的尝试
//document.cookie = “user_id=”+link_user_id+";path=/";这个不可行请不要使用 请使用下面的修改jquery 源码的方法 这样一劳永逸 当然如果贵公司没使用jquery 我就也帮不到你了
如果贵公司所有通信是封装的，请改封装代码 不要改jquery 源码 走下面这步是不得已而为之的！！！！

在jquery 源码里面搜索setRequestHeader
然后找到如下一段代码 for (s in u.headers) w.setRequestHeader(s, u.headers[s]);
在这段代码之后添加你要携带的信息 比我们公司 需要的key值名字是 user_id 值是link_user_id

var link_user_id = localStorage.getItem("storeUserId"); // 获取link_user_id
if (!link_user_id) { // 获取如果不存在 就从地址上面读取，这个最好是引入webview的时候拼在地址后面 这样第一次就能从这里读了
	let url = window.location.search
	var theRequest = new Object();
	if (url.indexOf("?") != -1) {
		var str = url.substr(1);
		strs = str.split("&");
		for (var i = 0; i < strs.length; i++) {
			theRequest[strs[i].split("=")[0]] = unescape(strs[i].split("=")[1]);
		}
	}
	link_user_id = theRequest.user_id
	 localStorage.setItem("storeUserId", theRequest.user_id);
}

//下面这句是关键 如果您的代码在别的地方可以获取到你的信息 上面这部分不要也罢
w.setRequestHeader("user_id",link_user_id);

这样改完以后 每次请求的时候请求头都会带着你要的信息了 好像下面这样
Accept: application/json, text/javascript, /; q=0.01
Accept-Encoding: gzip, deflate
Accept-Language: zh-CN,zh;q=0.9
Connection: keep-alive
Host:
Referer:
User-Agent: Mozilla/5.0 (Linux; Android 5.0; SM-G900P Build/LRX21T) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/88.0.4324.182 Mobile Safari/537.36
user_id: 132 这里就是你带的
X-Requested-With: XMLHttpRequest