虛擬鍵盤 API 的妙用
你是否在遇到過這樣的問題：移動設(shè)備上有一個固定元素，當激活虛擬鍵盤時，該元素被隱藏在了鍵盤下方？多年來，這一直是 Web 上的默認行為，在本文中，我們將探討這個問題、為什么會發(fā)生
在互聯(lián)網(wǎng)飛速發(fā)展的今天，隨著系統(tǒng)用戶規(guī)模的不斷擴大和分布式架構(gòu)的廣泛應(yīng)用，API 接口的穩(wěn)定性和性能成為系統(tǒng)設(shè)計中至關(guān)重要的因素。無論是應(yīng)對突發(fā)的流量高峰，還是防止惡意爬蟲的惡意請求，限流策略都已成為現(xiàn)代系統(tǒng)不可或缺的一部分。
為什么需要接口限流？
為了解決上述問題，我們可以在 API 接口上實施限流策略，使得系統(tǒng)能夠在高并發(fā)環(huán)境下保持穩(wěn)定，并且能夠合理應(yīng)對各類突發(fā)情況。在本文中，我們將探討如何在 SpringBoot 3.3 中，通過簡單的配置和代碼實現(xiàn) API 接口的限流。
運行效果：
圖片
圖片
若想獲取項目完整代碼以及其他文章的項目源碼，且在代碼編寫時遇到問題需要咨詢交流，歡迎加入下方的知識星球。
我們將從項目的結(jié)構(gòu)開始，先了解一下本示例項目的文件布局。
rate-limiter/├── src/│ ├── main/│ │ ├── java/com/icoderoad/ratelimiter/│ │ │ ├── controller/│ │ │ │ └── RateLimiterController.java│ │ │ ├── config/│ │ │ │ └── RateLimiterConfig.java│ │ │ ├── properties/│ │ │ │ └── RateLimiterProperties.java│ │ │ └── application/│ │ │ └── SpringBootRateLimiterApplication.java│ │ ├── resources/│ │ │ ├── templates/│ │ │ │ └── index.html│ │ │ └── application.yml└── pom.xml接下來，我們將逐步搭建項目，實現(xiàn) API 接口限流功能。
在 pom.xml 中引入以下依賴：
<?xml versinotallow="1.0" encoding="UTF-8"?><project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 https://maven.apache.org/xsd/maven-4.0.0.xsd"> <modelVersion>4.0.0</modelVersion> <parent> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-parent</artifactId> <version>3.3.3</version> <relativePath/> <!-- lookup parent from repository --> </parent> <groupId>com.icoderoad</groupId> <artifactId>ratelimiter</artifactId> <version>0.0.1-SNAPSHOT</version> <name>ratelimiter</name> <description>Demo project for Spring Boot</description> <properties> <java.version>17</java.version> <guava.version>31.1-jre</guava.version> </properties> <dependencies> <!-- Spring Boot Web Starter --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-web</artifactId> </dependency> <!-- Guava 用于限流 --> <dependency> <groupId>com.google.guava</groupId> <artifactId>guava</artifactId> <version>${guava.version}</version> </dependency> <!-- Thymeleaf 模板引擎 --> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency> <dependency> <groupId>org.projectlombok</groupId> <artifactId>lombok</artifactId> <optional>true</optional> </dependency> <dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-test</artifactId> <scope>test</scope> </dependency> </dependencies> <build> <plugins> <plugin> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-maven-plugin</artifactId> </plugin> </plugins> </build></project>在 src/main/resources/application.yml 中配置限流參數(shù)：
server: port: 8080rate-limiter: permits-per-second: 5 # 每秒許可數(shù) warmup-period: 0 # 預(yù)熱時間（秒） timeout: 0 # 獲取許可的超時時間（秒）參數(shù)說明：
在 src/main/java/com/icoderoad/ratelimiter/properties/RateLimiterProperties.java 中創(chuàng)建配置屬性類，用于映射 application.yml 中的配置：
package com.icoderoad.ratelimiter.propertie;import org.springframework.boot.context.properties.ConfigurationProperties;import org.springframework.stereotype.Component;import lombok.Data;@Data@Component@ConfigurationProperties(prefix = "rate-limiter")public class RateLimiterProperties { /** * 每秒許可數(shù) */ private double permitsPerSecond; /** * 預(yù)熱時間（秒） */ private long warmupPeriod; /** * 獲取許可的超時時間（秒） */ private long timeout;}說明：
在 src/main/java/com/icoderoad/ratelimiter/config/RateLimiterConfig.java 中創(chuàng)建限流器配置：
package com.icoderoad.ratelimiter.config;import java.util.concurrent.TimeUnit;import org.springframework.context.annotation.Bean;import org.springframework.context.annotation.Configuration;import com.google.common.util.concurrent.RateLimiter;import com.icoderoad.ratelimiter.propertie.RateLimiterProperties;@Configurationpublic class RateLimiterConfig { /** * 配置 RateLimiter Bean * * @param properties 注入的限流配置屬性 * @return RateLimiter 實例 */ @Bean public RateLimiter rateLimiter(RateLimiterProperties properties) { if (properties.getWarmupPeriod() > 0) { // 創(chuàng)建帶有預(yù)熱期的 RateLimiter return RateLimiter.create( properties.getPermitsPerSecond(), properties.getWarmupPeriod(), TimeUnit.SECONDS ); } else { // 創(chuàng)建標準的 RateLimiter return RateLimiter.create(properties.getPermitsPerSecond()); } }}說明：
在 src/main/java/com/icoderoad/ratelimiter/controller/RateLimiterController.java 中創(chuàng)建控制器，處理 API 請求：
package com.icoderoad.ratelimiter.controller;import java.util.concurrent.TimeUnit;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.http.ResponseEntity;import org.springframework.stereotype.Controller;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.ResponseBody;import com.google.common.util.concurrent.RateLimiter;import com.icoderoad.ratelimiter.propertie.RateLimiterProperties;@Controllerpublic class RateLimiterController { @Autowired private RateLimiter rateLimiter; @Autowired private RateLimiterProperties properties; /** * 測試限流接口 * * @return 請求結(jié)果 */ @GetMapping("/api/test") @ResponseBody public ResponseEntity<String> testApi() { boolean acquired = rateLimiter.tryAcquire(properties.getTimeout(), TimeUnit.SECONDS); if (acquired) { // 允許請求，返回成功響應(yīng) return ResponseEntity.ok("請求成功！"); } else { // 拒絕請求，返回限流響應(yīng) return ResponseEntity.status(429).body("請求過多，請稍后再試！"); } }}說明：
成功獲取：返回 200 狀態(tài)碼和成功消息。
獲取失敗：返回 429 狀態(tài)碼和錯誤提示。
在 src/main/resources/templates/index.html 中創(chuàng)建前端頁面，使用 Thymeleaf、Bootstrap 和 jQuery 實現(xiàn)：
<!DOCTYPE html><html xmlns:th="http://www.thymeleaf.org"><head> <meta charset="UTF-8"> <title>API 限流測試</title> <!-- 引入 Bootstrap CSS --> <link rel="stylesheet" > <!-- 自定義樣式 --> <style> body { padding-top: 50px; } </style></head><body><div class="container"> <h1 class="mb-4">API 限流測試</h1> <button id="testButton" class="btn btn-primary">發(fā)送請求</button> <div id="alertPlaceholder" class="mt-3"></div></div><!-- 引入 jQuery --><script src="https://code.jquery.com/jquery-3.6.0.min.js"></script><!-- 引入 Bootstrap JS --><script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0/dist/js/bootstrap.bundle.min.js"></script><script> $(document).ready(function () { $('#testButton').click(function () { $.ajax({ url: '/api/test', method: 'GET', success: function (response) { showAlert(response, 'success'); }, error: function (xhr) { if (xhr.status === 429) { showAlert(xhr.responseText, 'danger'); } else { showAlert('發(fā)生未知錯誤，請稍后重試。', 'warning'); } } }); }); /** * 顯示提示信息 * @param message 消息內(nèi)容 * @param type 提示類型（'success', 'danger', 'warning' 等） */ function showAlert(message, type) { const alertHtml = ` <div class="alert alert-${type} alert-dismissible fade show" role="alert"> ${message} <button type="button" class="btn-close" data-bs-dismiss="alert" aria-label="Close"></button> </div> `; $('#alertPlaceholder').html(alertHtml); } });</script></body></html>說明：
使用 CDN 加載 Bootstrap 和 jQuery，確保資源的快速和穩(wěn)定加載。
一個按鈕用于觸發(fā) API 請求。
一個占位符 div 用于顯示提示信息。
JavaScript 邏輯：
使用 jQuery 監(jiān)聽按鈕點擊事件，發(fā)送 AJAX 請求到 /api/test 接口。
根據(jù)響應(yīng)結(jié)果，調(diào)用 showAlert 函數(shù)，在頁面上顯示不同類型的提示信息。
showAlert 函數(shù)使用 Bootstrap 的 Alert 組件，提供友好的用戶提示。
效果展示：
在 src/main/java/com/icoderoad/ratelimiter/application/SpringBootRateLimiterApplication.java 中啟動 Spring Boot 應(yīng)用：
package com.icoderoad.ratelimiter;import org.springframework.boot.SpringApplication;import org.springframework.boot.autoconfigure.SpringBootApplication;@SpringBootApplication(scanBasePackages = "com.icoderoad.ratelimiter")public class RatelimiterApplication { public static void main(String[] args) { SpringApplication.run(RatelimiterApplication.class, args); }}說明：
步驟：
示例演示：
通過本文的示例，我們成功地在 Spring Boot 3.3 中實現(xiàn)了簡單而有效的 API 接口限流功能。我們利用了 Guava 提供的 RateLimiter 工具，結(jié)合 Spring Boot 的配置屬性管理和依賴注入機制，實現(xiàn)了靈活可配的限流策略。同時，通過前端頁面的簡單設(shè)計和友好提示，使得用戶能夠清晰地感知到限流機制的存在和作用。
本文鏈接：http://www.www897cc.com/showinfo-26-112716-0.htmlSpringBoot 3.3 中實現(xiàn) API 接口限流就是這么簡單
聲明：本網(wǎng)頁內(nèi)容旨在傳播知識，若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系，我們將在第一時間刪除處理。郵件：2376512515@qq.com
Copyright ? 2016-2023 天津谷騏科技有限公司 版權(quán)所有 sitemap.xml
違法及侵權(quán)請聯(lián)系：2376512515@qq.com 津ICP備18001702號
津公網(wǎng)安備 12010102000574號