介绍
本文介绍如何通过 rk-boot 快速配置服务端 CORS。
什么是 CORS? 跨源资源共享 (CORS) (或通俗地译为跨域资源共享)是一种基于HTTP 头的机制,该机制通过允许服务器标示除了它自己以外的其它origin(域,协议和端口),这样浏览器可以访问加载这些资源。
请访问如下地址获取完整教程:
- https://rkdocs.netlify.app/cn
安装
代码语言:go复制go get github.com/rookie-ninja/rk-boot/gf
快速开始
1.创建 boot.yaml
boot.yaml 文件会告诉 rk-boot 如何启动 gogf/gf 服务。
在这个例子中,我们只允许 localhost:8080 发送过来的请求,通过验证。
代码语言:yaml复制---
gf:
- name: greeter # Required
port: 8080 # Required
enabled: true # Required
interceptors:
cors:
enabled: true # Optional, default: false
allowOrigins:
- "http://localhost:8080" # Optional, default: *
2.创建 main.go
代码语言:go复制// Copyright (c) 2021 rookie-ninja
//
// Use of this source code is governed by an Apache-style
// license that can be found in the LICENSE file.
package main
import (
"context"
"github.com/gogf/gf/v2/net/ghttp"
"github.com/rookie-ninja/rk-boot"
"github.com/rookie-ninja/rk-boot/gf"
"net/http"
)
func main() {
// Create a new boot instance.
boot := rkboot.NewBoot()
// Register handler
entry := rkbootgf.GetGfEntry("greeter")
entry.Server.BindHandler("/v1/hello", hello)
// Bootstrap
boot.Bootstrap(context.TODO())
boot.WaitForShutdownSig(context.TODO())
}
func hello(ctx *ghttp.Request) {
ctx.Response.WriteHeader(http.StatusOK)
ctx.Response.WriteJson(map[string]string{
"message": "hello!",
})
}
3.创建 cors.html
让我们创建一个简单网页,网页里会调用 localhost:8080/v1/hello,我们通过返回结果来验证 CORS。
代码语言:html复制<!DOCTYPE html>
<html>
<body>
<h1>CORS Test</h1>
<p>Call http://localhost:8080/v1/hello</p>
<script type="text/javascript">
window.onload = function() {
var apiUrl = 'http://localhost:8080/v1/hello';
fetch(apiUrl).then(response => response.json()).then(data => {
document.getElementById("res").innerHTML = data["message"]
}).catch(err => {
document.getElementById("res").innerHTML = err
});
};
</script>
<h4>Response: </h4>
<p id="res"></p>
</body>
</html>
4.文件夹结构
代码语言:txt复制.
├── boot.yaml
├── cors.html
├── go.mod
├── go.sum
└── main.go
0 directories, 5 files
5.验证
打开 cors.html,cors.html 会从非 8080 端口发送请求,所以无法通过验证。
6.给 CORS 添加白名单
这次,我们把 allowOrigins 配置成 localhost:*,即,让所有从 localhost 发送的请求,均可以通过。
代码语言:yaml复制---
gf:
- name: greeter # Required
port: 8080 # Required
enabled: true # Required
interceptors:
cors:
enabled: true # Optional, default: false
allowOrigins:
- "http://localhost:*" # Optional, default: *
7.验证
打开 cors.html
完整参数
请参考 gf-cors 获取完整参数列表。
名字 | 描述 | 类型 | 默认值 |
---|---|---|---|
gf.interceptors.cors.enabled | 启动 CORS 拦截器 | boolean | false |
gf.interceptors.cors.allowOrigins | 可通过验证的 Origin 地址。 | []string | * |
gf.interceptors.cors.allowMethods | 可通过的 http method, 会包含在 OPTIONS 请求的 Header 中。 | []string | All http methods |
gf.interceptors.cors.allowHeaders | 可通过的 http header, 会包含在 OPTIONS 请求的 Header 中。 | []string | Headers from request |
gf.interceptors.cors.allowCredentials | 会包含在 OPTIONS 请求的 Header 中。 | bool | false |
gf.interceptors.cors.exposeHeaders | 会包含在 OPTIONS 请求的 Header 中的 Header。 | []string | "" |
gf.interceptors.cors.maxAge | 会包含在 OPTIONS 请求的 Header 中的 MaxAge。 | int | 0 |