# 定義限流區(qū)域，每個IP每秒最多允許20次請求
limit_req_zone $binary_remote_addr zone=perip:10m rate=20r/s;

# 針對所有接口執(zhí)行IP限流，允許30個突發(fā)請求，超額請求直接拒絕（不延遲）
limit_req zone=perip burst=30 nodelay;

202X/08/15 14:30:22 [error] 12345#67890: *1000 limiting requests, excess: 30.720 by zone "perip", client: 192.168.1.100, server: _, request: "POST /bff/xxx/rest/xxx/xxx HTTP/1.1", host: "test.example.com", referrer: "https://test.example.com/xxx/xxx/graph"

// 請求隊列類，精準控制最大并發(fā)數(shù)（始終保持最多maxConcurrent個請求在執(zhí)行）
class RequestQueue {
    constructor(maxConcurrent = 10) {
        this.maxConcurrent = maxConcurrent; // 前端自定義最大并發(fā)數(shù)（適配瀏覽器限制：HTTP/1.1下Chrome默認6個同域名并發(fā)TCP連接，隊列自動協(xié)調(diào)；HTTP/2支持多路復用，隊列用于控制請求總量）
        this.running = 0; // 當前正在執(zhí)行的請求數(shù)
        this.queue = []; // 請求等待隊列
    }

    // 新增請求到隊列，自動協(xié)調(diào)并發(fā)執(zhí)行（一個請求完成，立即喚醒下一個，始終保持最多maxConcurrent個）
    async addRequest(requestFn) {
        // 若當前并發(fā)數(shù)達到上限，將請求加入隊列等待
        if (this.running >= this.maxConcurrent) {
            await new Promise(resolve => this.queue.push(resolve));
        }
        this.running++;
        try {
            // 執(zhí)行請求并返回結(jié)果
            return await requestFn();
        } finally {
            this.running--;
            // 隊列中有等待請求時，喚醒下一個請求執(zhí)行，維持最大并發(fā)數(shù)
            if (this.queue.length > 0) {
                this.queue.shift()();
            }
        }
    }
}

// 實例化請求隊列，最大并發(fā)數(shù)設為10（適配場景：HTTP/1.1下兼容Chrome 6個并發(fā)限制，HTTP/2下充分利用多路復用能力，始終保持最多10個請求在執(zhí)行）
const requestQueue = new RequestQueue(10);

// 封裝請求方法，所有請求統(tǒng)一走隊列管控
async function sendRequest(url, data) {
    return requestQueue.addRequest(async () => {
        const response = await fetch(url, {
            method: 'POST',
            body: JSON.stringify(data),
            headers: { 'Content-Type': 'application/json' }
        });
        // 捕獲429限流狀態(tài)碼，便于后續(xù)結(jié)合重試機制處理
        if (!response.ok && response.status === 429) {
            throw new Error('請求頻率過高，已觸發(fā)限流');
        }
        return response.json();
    });
}

// 節(jié)流函數(shù)：控制目標函數(shù)在指定時間間隔內(nèi)最多執(zhí)行一次
function throttle(fn, delay = 200) {
    let timer = null;
    return function(...args) {
        if (!timer) {
            fn.apply(this, args);
            // 延遲指定時間后，釋放下一次請求權(quán)限，控制請求頻率
            timer = setTimeout(() => {
                timer = null;
            }, delay);
        }
    };
}

// 對請求方法做節(jié)流處理，每200ms最多發(fā)送1次（每秒最多5次，遠低于Nginx的20r/s閾值）
const throttledSendRequest = throttle(sendRequest, 200);

// 封裝帶本地緩存的請求方法，適配所有高頻接口，支持自定義緩存時長
async function requestWithCache(url, data, cacheTime = 3600000) {
    // 生成唯一緩存key（基于請求地址+請求參數(shù)，避免不同請求緩存沖突）
    const cacheKey = `req_cache_${url}_${JSON.stringify(data)}`;
    // 先查詢本地緩存（localStorage），若緩存存在且未過期，直接返回緩存數(shù)據(jù)
    const cachedData = localStorage.getItem(cacheKey);
    if (cachedData) {
        const { data: cacheRes, expireTime } = JSON.parse(cachedData);
        if (Date.now() < expireTime) {
            return cacheRes;
        }
        // 緩存過期，刪除舊緩存，避免臟數(shù)據(jù)
        localStorage.removeItem(cacheKey);
    }
    // 緩存不存在或已過期，執(zhí)行請求并緩存結(jié)果
    const response = await throttledSendRequest(url, data);
    // 存入本地緩存，設置過期時間（默認1小時，可根據(jù)業(yè)務場景靈活調(diào)整）
    localStorage.setItem(cacheKey, JSON.stringify({
        data: response,
        expireTime: Date.now() + cacheTime
    }));
    return response;
}

// 帶指數(shù)退避重試的請求方法，適配限流場景的容錯處理
async function fetchWithRetry(url, options = {}, retries = 3, backoff = 500) {
    try {
        const response = await fetch(url, options);
        // 捕獲429狀態(tài)碼（請求過多），拋出錯誤進入重試邏輯
        if (!response.ok && response.status === 429) {
            throw new Error('觸發(fā)限流，準備執(zhí)行重試');
        }
        return response.json();
    } catch (error) {
        // 重試次數(shù)耗盡，拋出最終錯誤，交由業(yè)務層處理
        if (retries <= 0) throw error;
        // 指數(shù)退避策略：每次重試的延遲時間翻倍（500ms → 1000ms → 2000ms），避免加劇限流
        const delay = backoff * Math.pow(2, 3 - retries);
        await new Promise(resolve => setTimeout(resolve, delay));
        // 遞歸執(zhí)行重試，重試次數(shù)遞減
        return fetchWithRetry(url, options, retries - 1, backoff);
    }
}

// 替換原請求方法，整合隊列、節(jié)流與重試機制，形成完整請求鏈路
async function sendRequestWithRetry(url, data) {
    return requestQueue.addRequest(async () => {
        return fetchWithRetry(url, {
            method: 'POST',
            body: JSON.stringify(data),
            headers: { 'Content-Type': 'application/json' }
        });
    });
}