OpenLayers 加载 GeoServer WFS 服务
OpenLayers 加载 GeoServer WFS 服务的标准做法，是用 ol.source.Vector 搭配 ol.format.GeoJSON 与 bbox 加载策略，按当前地图视图范围向 WFS GetFeature 动态请求矢量要素。推荐使用 WFS 1.1.0、outputFormat=application/json，srsname 与地图投影保持一致（常用 EPSG:3857）。截至 2026 年 11 月，OpenLayers 最新稳定版为 v10.11.0，GeoServer 稳定版为 3.0.2，按此组合即可完成只读矢量加载；生产环境务必先解决跨域并控制返回要素数量。
GeoServer 端如何发布可用的 WFS 图层
先确认 GeoServer 已安装并运行（稳定版 3.0.2 需 Java 17 或 21，可从官方下载页获取 Binary 或 WAR）。在 Web 管理界面完成以下操作，才能让 OpenLayers 正确请求到要素：
- 新建 Workspace，勾选启用 WFS 服务。
- 新建 Store（PostGIS、Shapefile 等均可），连接数据源。
- 发布 Layer：设置正确的原生 SRS（如 EPSG:4326 或 EPSG:3857），在 WFS 设置中启用该图层，必要时限制图层最大要素数。
- 全局 WFS 设置里查看最大要素数（默认通常为 1,000,000）与预览条数；服务级别保持 Basic（只读）即可，若需事务再开 Transactional。
发布完成后，WFS 端点一般为 http://localhost:8080/geoserver/workspace/wfs 或 /geoserver/wfs。GetFeature 请求必须带上 typeName（workspace:layer）、version、outputFormat 等参数。详细输出格式说明可参考 GeoServer 文档，常用且与 OpenLayers 配合最好的是 application/json（GeoJSON）。
| 常用 GetFeature 参数 | 作用 | 典型取值 |
|---|---|---|
| service | 服务类型 | WFS |
| version | 协议版本 | 1.1.0（OpenLayers 默认友好） |
| request | 操作 | GetFeature |
| typeName | 图层名 | workspace:layername |
| outputFormat | 返回格式 | application/json |
| srsname | 输出坐标系 | EPSG:3857 |
| bbox | 空间范围 | minx,miny,maxx,maxy,EPSG:3857 |
WFS 2.0 用 count 限制条数，早期版本用 maxFeatures。轴顺序在 1.1.0/2.0 下需注意，建议发布时统一好投影。
OpenLayers 加载 WFS 的具体实现步骤
推荐模块化引入（npm install ol），版本对齐 v10.11.0。核心是 VectorSource 的 url 写成函数，内部拼接当前 extent 的 WFS 请求，并用 bbox 策略按需加载，避免一次拉全量数据。
- 创建地图与 View，投影设为 EPSG:3857（与 srsname 一致）。
- 实例化 VectorSource：format 用 new GeoJSON()，strategy 用 bbox，url 函数接收 extent、resolution、projection，返回完整 GetFeature URL（含 bbox=extent.join(‘,’)+’,EPSG:3857’）。
- 把 VectorSource 交给 VectorLayer，加入 map。可选加 style 区分要素。
- 监听错误与 loadend，方便调试；大图层可再叠加 CQL_FILTER。
官方完整可运行示例见 OpenLayers 官方 vector-wfs 示例（基于最新稳定版）。也可用 ol/format/WFS 直接读写 GML，但 GeoJSON 解析更轻、浏览器友好，多数场景优先选它。若需写入，可再配合 WFS-T 事务，但本教程聚焦只读加载。
跨域 CORS 与输出格式怎么选
浏览器直接请求 GeoServer WFS 时最常见报错是缺少 Access-Control-Allow-Origin。WMS 图片请求通常无此问题，矢量 GetFeature 会触发。解决优先在 GeoServer Web Admin 的 Server → Global Settings → CORS Settings 里启用，Allowed Origins 可先设 *，Methods 包含 GET、POST、OPTIONS，保存后重启生效。也可用 web.xml 手动放开 CorsFilter，或以代理转发。
输出格式优先选 application/json。JSONP（text/javascript）默认禁用，需改 web.xml 并加 format_options=callback，现代浏览器已不推荐。GML 体积大、解析慢，仅在必须兼容旧客户端时使用。坐标系必须匹配：若图层是 EPSG:4326 而地图是 3857，要么在请求里指定 srsname，要么在 OpenLayers 侧用 transformExtent 转换 bbox。
大数据量优化、分页与验收标准
bbox 策略已经能显著减少一次请求的数据量，但仍要注意全局/图层最大要素数限制，以及网络与浏览器渲染压力。若卡顿或加载过慢，可结合本站已有实践：先看 OpenLayers加载慢：性能优化、海量点和GeoJSON加载 与 OpenLayers加载GeoJSON卡顿？性能优化秘籍（含：代码示例），再按需引入简化、抽稀或分块。
需要筛选、分页或编辑时，直接参考 GeoServer WFS分页：筛选、编辑和查询参数，合理使用 count/maxFeatures、CQL_FILTER、startIndex 等。验收标准建议固定三条：① 地图缩放/平移后对应范围内要素正确出现且无重复；② 浏览器控制台无 CORS 与 4xx/5xx；③ 单次请求返回要素数可控，界面不卡顿。
- 开发阶段可用 CDN 引入 ol，生产务必打包并开启压缩。
- 大图层务必开 bbox，禁止无 bbox 的全量 GetFeature。
- 发布前在 GeoServer Layer Preview 验证 GeoJSON 输出是否正常。
常见问题
为什么 WMS 能显示但 WFS 报跨域？
WMS 返回的是图片，浏览器同源策略对 canvas/img 更宽松；WFS 是 XML/JSON 的 XHR/fetch，必须有 CORS 头。在 GeoServer 全局 CORS 设置里启用并重启即可。
请求成功但地图上没有要素？
优先检查 typeName 是否写成 workspace:layer、srsname 与地图投影是否一致、bbox 是否带正确的 EPSG 后缀，以及图层是否真正启用了 WFS。用浏览器直接打开拼接好的 GetFeature URL，看返回的 GeoJSON 里 features 数组是否为空。
返回的要素数量突然变少或被截断？
通常是触发了全局或图层的最大要素数限制。到 WFS Settings 或图层发布页调高，或改用 bbox + 分页参数（WFS 2.0 的 count）按需拉取。
OpenLayers 该用哪个 format？
日常推荐 GeoJSON（ol/format/GeoJSON），体积小、解析快；只有需要完整 GML 读写或事务时才用 ol/format/WFS（默认支持 1.1.0，可指定 1.0.0/2.0.0）。
总结：OpenLayers 加载 GeoServer WFS 的关键是 VectorSource + GeoJSON + bbox，并在服务端正确发布图层、开启 CORS、控制要素上限。建议先按官方示例跑通一个小图层，再对照本站性能与分页文章做优化；版本请以 OpenLayers v10.11.0 与 GeoServer 3.0.2 为准，正式上线前务必用真实数据验收跨域与加载流畅度。