javascript 在选项卡之间同步代码执行

Question

我陷入了两难的境地。我使用此代码生成唯一 ID 并将其存储在 cookie 或本地存储中。仅当之前没有设置 ID 时，我才会生成此 ID。

//read the ID from cookie or local storage
var id=readID();
if(id==null){
   //no ID found, generate an ID
   id=generateID();

   //store the ID to use it when we come back
   storeID(id);
}

这段代码在大约 90% 的情况下按我的预期工作，仅生成一个 ID，但有时当没有 ID 的用户同时(或以非常短的时间间隔)打开 2 个或更多选项卡时，它最终会生成 2 个选项卡身份证。 我感兴趣的是一些黑客策略，可以在读取、生成和存储 ID 时锁定代码，并且仅在一个选项卡中执行。直到锁被释放。

我知道这可能行不通，因为选项卡是分开的，但我在想是否可以锁定本地存储对象以进行读取和写入？

我也愿意接受其他解决方案。

更新:有人问我generateID算法是怎样的。我说这并不重要，但为了简化这一点，我们将使用 Math.random() ，如下所示:

function generateID(){
   return Math.random();
}

Answer 1

假设你的 readID 函数很快。试试这个:

const now = new Date().getTime() // Number -> 1471016775000 (ms since epoch)
const id = readID()
if (!id) {
    storeID(now)
    id = generateID()
    const lookup = readID()
    if (lookup === now) {
        // this confirms this is the window that started generating the ID
        storeID(id)
    }

}