使用来自 Firebase 身份验证流程的访问令牌提供对 Google 云存储桶的读取访问权限(用于 Mapbox GL Vector Tile 托管)

Providing Read Access to Google Cloud Storage Bucket with Access Token from Firebase Authentication Flow (for Mapbox GL Vector Tile Hosting)

我的应用程序使用 firebase 身份验证,只有来自我的 G Suite 域的用户才能成功通过身份验证。我的范围设置如下:

var provider = new firebase.auth.GoogleAuthProvider();
provider.addScope('https://www.googleapis.com/auth/admin.directory.user')
provider.addScope('https://www.googleapis.com/auth/admin.directory.user.readonly')
provider.addScope('https://www.googleapis.com/auth/devstorage.read_only')
firebase.auth().signInWithRedirect(provider)

我的理解是,我可以使用从上述登录流程返回的访问令牌进行 http 请求,以从我的 Google 云存储存储桶中读取 objects。我将访问令牌作为 header 插入,如下所示:

Authorization: 'Bearer xyz123'

对于我的 non-public 存储桶,我启用了统一 bucket-level 访问权限,并使用 IAM 角色允许我的 G Suite 域中的用户从存储桶中读取数据。

但是,这不起作用,因为我收到了 403 个 HTTP 请求响应。对于更多上下文,我在存储桶中托管矢量切片,这些切片被 mapbox-gl.

使用

知道我哪里出错了吗?

P.S。我相信这是一个权限问题,而不是 mapbox 配置或矢量切片本身的问题。当我完全制作桶 public 时,一切正常。我正在努力解决的问题是如何将对矢量图块的访问限制为仅限我的 G Suite 域内的用户。

所以,我上面做的是正确的。但是,我遗漏了一点:我的 Google Cloud Storage 存储桶的 cors 设置需要更新以替换

origin: "*"

origin: ["https://domain-name-where-request-comes-from.com", "https://and-dev-site-for-that-domain.com"]

根据 REST 规范,当需要凭据作为请求的一部分时,* 通配符可接受。

我还需要更新我的 cors 设置的 responseHeader:

"responseHeader": ["X-Requested-With", "Access-Control-Allow-Origin", "Content-Type", "Authorization"]

通过在 mapbox-gl 请求的 headers 中插入 OAuth 令牌(通过 transformRequset 方法),我可以成功请求和接收图块。