Polyfill launchWebAuthFlow
with popups or browser tabs.
npm install webext-launch-web-auth-flow
// With ESM Modules
import launchWebAuthFlow from "webext-launch-web-auth-flow";
// With CommonJS
const launchWebAuthFlow = require("webext-launch-web-auth-flow");
If you use TypeScript, you have to install @types/webextension-polyfill
:
npm install @types/webextension-polyfill
You can find it under the dist
folder, or download from unpkg.
- Builtin
launchWebAuthFlow
doesn't reuse the browser session. This library does. - Builtin
launchWebAuthFlow
doesn't allow custom redirect_uri. This library does.
{
"background": {
...
"persistent": true
},
"permissions": [
"webRequest",
"webRequestBlocking",
"webNavigation",
"https://my.redirect.uri/*"
]
}
To polyfill launchWebAuthFlow
, this library uses following API/permissions:
windows
andtabs
- this library launches a window dialog (or tab in Firefox android) to login. Most methods from these APIs can be used without explicitly declaring any permissions in the extension's manifest file, therefore there's no need to mention them in the code above.webRequest
- this library cannot be used with event pages, otherwise you'll get this error. To avoid it, set your background pagepersistent
key totrue
.webRequestBlocking
this cancels the request toredirect_uri
so it won't leak the token/code toredirect_uri
(orredirect_uri
is unresolveable e.g. the URL fromidentity.getRedirectURL
).webNavigation
- the login dialog is minimized unless there is no redirect. It checks the loading state usingwebNavigation.onDOMContentLoaded
.
This library references the browser
global variable, which is from Firefox. To make it work on Chrome (which uses the chrome
global variable instead) install webextension-polyfill.
- Currently there is no good way to create an "inactive minimized dialog" on both Chrome and Firefox. Ref: https://crbug.com/783827 & https://bugzilla.mozilla.org/show_bug.cgi?id=1659190.
This module exports a single function.
async launchWebAuthFlow({
url: String,
redirect_uri: String,
interactive?: Boolean = false,
alwaysUseTab?: Boolean = false,
windowOptions?: Object
}) => finalUrl: String
See the official document for url
, redirect_uri
, and interactive
options. Note that redirect_uri
is required in this library.
By default, this library uses a popup to display the login page. If popups are unavailable (which usually happens on mobile browsers), it uses a tab instead. Set alwaysUseTab
to true
to always use a tab.
Use windowOptions
to set extra properties that will be sent to browser.windows.create
.
-
0.1.2 (Nov 28, 2022)
- Add: TypeScript declaration file.
-
0.1.1 (Feb 18, 2021)
- Add:
alwaysUseTab
option. - Add:
windowOptions
option.
- Add:
-
0.1.0 (Aug 15, 2020)
- First release.