sessionStorage的成功使用

项目中遇到一个场景，index页面有多个入口，每个入口都可以进入主系统，但是需要带上入口id传给主系统里面的所有请求接口，并且进入主系统都是打开新窗口。难点在于如何把入口id传给打开的新窗口，并且会存在有多个新窗口主系统的存在。
 

入口界面.png
image.png

1. 首先系统中的fetch请求必须是公共方法

• 因为我在项目中把所有fetch请求都写成一个公共方法，并且保存在一个名为common的JS文件中，所以我的思路是在打开的新窗口中，只要获取到一次id，并且传到common中的公共fetch方法，就可以实现需求。

2. 使用url的方式向新窗口传递index页面的入口id

• 使用window.open("窗口地址+id")，然后在新窗口中使用window.location.href可以获取到id，并且使用一个公共方法传入fetch中，主系统中所有请求可以带上这个id，但是我发现当通过不同入口打开新窗口时，这个common中获取的id是通过最后入口获取的id，此时所有窗口主系统都是用同一个id，这样就达不到需求

3. 使用sessionStorage传递id

• 在入口页面打开新窗口的同时，将入口id存入sessionStorage，在公共的fetch方法中获取id加入，就完美实现了需求

image.png
image.png