問(wèn)題描述

有許多在線(xiàn)資源提供 JavaScript API 來(lái)訪(fǎng)問(wèn)他們的服務(wù).為了更清楚，我的問(wèn)題將基于 MapBox 的示例，但這適用于許多其他服務(wù)在各個(gè)領(lǐng)域.

There are numerous online resources which provide JavaScript APIs to access their services. To be more clear, I will base my question on the example of MapBox, but this applies well to many other services in various domains.

當(dāng)有人想在 Web 應(yīng)用程序中使用此類(lèi)服務(wù)??(例如 MapBox 中的地圖圖像)時(shí)，他們通常需要注冊(cè)/注冊(cè)并獲取 訪(fǎng)問(wèn)令牌 才能訪(fǎng)問(wèn)該服務(wù).

When someone wants to use such a service in a web application (like the map imagery from MapBox for example), they typically need to Register/Sign Up and obtain an access token to access the service.

現(xiàn)在，如果我從服務(wù)器端使用 API - 沒(méi)有問(wèn)題:我知道我的令牌安全地存儲(chǔ)在服務(wù)器上的某個(gè)位置，并且僅在我的服務(wù)器和服務(wù)提供商之間進(jìn)行通信時(shí)公開(kāi)，這可以長(zhǎng)是 HTTPS.但是，對(duì)于 JavaScript API(例如，如果我使用 Leaflet 從 MapBox 呈現(xiàn)地圖)，我是應(yīng)該在暴露給用戶(hù)的網(wǎng)絡(luò)瀏覽器的 JavaScript 中具有 我的訪(fǎng)問(wèn)令牌 - 因此它可以非常容易地找到某人的訪(fǎng)問(wèn)令牌.我的用戶(hù)，或者在公共服務(wù)的情況下，實(shí)際上是任何人，都可以在瀏覽器的開(kāi)發(fā)工具"中找到令牌.

Now, if I would use the API from the server side - there is no issue: I know my token is stored securely somewhere on the server and is only exposed upon communication between my server and the service provider, which is OK as long it is HTTPS. However, in case of a JavaScript API (for example if I use Leaflet to render a map from MapBox), I am supposed to have my access token in a JavaScript which is exposed to the user's web browser - and so it makes it extremely easy to find someone's access token. My users, or in a case of a public service, literally anyone, would be able to find the token in the browser's "Dev Tools".

然而，就我而言，這個(gè)令牌應(yīng)該被視為一種有意義的數(shù)據(jù)——服務(wù)使用情況是根據(jù)這個(gè)令牌提供的身份驗(yàn)證來(lái)跟蹤的.如果您根據(jù)使用情況為服務(wù)付費(fèi)，這將變得至關(guān)重要，但即使您不這樣做(例如，如果您使用免費(fèi)/入門(mén)/非付費(fèi)計(jì)劃) - 服務(wù)使用是有限的，我想確定一下只有我使用它.

This token however, as for me, should be considered as a sensetive data - service usage is tracked based on the authentication this token provides. If you pay for the service based on its usage it becomes critical, but even if you don't (like, if you use a Free/Starter/Non Paid plan) - service usage is limited and I'd like to be sure it is only me who uses it.

我唯一的選擇是通過(guò)我自己的網(wǎng)絡(luò)服務(wù)器代理嗎?

Is my only option a proxy via my own web server?

如果 JavaScript 在用戶(hù)的瀏覽器中執(zhí)行，有沒(méi)有辦法保護(hù) JavaScript API 用來(lái)訪(fǎng)問(wèn)外部服務(wù)的訪(fǎng)問(wèn)令牌?

Is there a way to secure the access token used by a JavaScript API to access an external service, provided that JavaScript is executed in a user's browser?

推薦答案

使用 CORS 限制訪(fǎng)問(wèn)

使用 CORS 設(shè)置讓您的網(wǎng)絡(luò)服務(wù)器在 ajax 請(qǐng)求中返回訪(fǎng)問(wèn)令牌.可以使用此方法訪(fǎng)問(wèn)您的應(yīng)用程序來(lái)捕獲令牌.

Make your web server return the access tokens on an ajax request from you javascript with CORS setup. Token can be captured with this method visiting your app.

向授權(quán)用戶(hù)提供令牌

您還可以在您的網(wǎng)絡(luò)服務(wù)器上添加身份驗(yàn)證，以向您允許的用戶(hù)提供有限的訪(fǎng)問(wèn)權(quán)限.令牌可以使用此方法獲取，但只能由授權(quán)用戶(hù)獲取.

You can also add authentication on your webserver to provide limited access to the users you allow. Token can be captured with this method but only by authorized users.

代理請(qǐng)求

完全保護(hù)該令牌的唯一方法是通過(guò)您的服務(wù)器代理請(qǐng)求.使用此方法無(wú)法捕獲令牌.請(qǐng)注意，這可能違反服務(wù)條款.

The only way to completely protect that token is to proxy the requests through your server. Token cannot be captured with this method. Note that this may be against terms of service.

這篇關(guān)于如何保護(hù) JavaScript API 訪(fǎng)問(wèn)令牌?的文章就介紹到這了，希望我們推薦的答案對(duì)大家有所幫助，也希望大家多多支持html5模板網(wǎng)！