-
-
Save jherax/a81c8c132d09cc354a0e2cb911841ff1 to your computer and use it in GitHub Desktop.
/** | |
* Lightweight script to detect whether the browser is running in Private mode. | |
* @returns {Promise<boolean>} | |
* | |
* Live demo: | |
* @see https://output.jsbin.com/tazuwif | |
* | |
* This snippet uses Promises. If you want to run it in old browsers, polyfill it: | |
* @see https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.min.js | |
* | |
* More Promise Polyfills: | |
* @see https://ourcodeworld.com/articles/read/316/top-5-best-javascript-promises-polyfills | |
* | |
* Disclaimer: | |
* No longer maintained, last updated: Feb 2020 | |
*/ | |
function isPrivateMode() { | |
return new Promise(function detect(resolve) { | |
var yes = function() { resolve(true); }; // is in private mode | |
var not = function() { resolve(false); }; // not in private mode | |
function detectChromeOpera() { | |
// https://developers.google.com/web/updates/2017/08/estimating-available-storage-space | |
var isChromeOpera = /(?=.*(opera|chrome)).*/i.test(navigator.userAgent) && navigator.storage && navigator.storage.estimate; | |
if (isChromeOpera) { | |
navigator.storage.estimate().then(function(data) { | |
return data.quota < 120000000 ? yes() : not(); | |
}); | |
} | |
return !!isChromeOpera; | |
} | |
function detectFirefox() { | |
var isMozillaFirefox = 'MozAppearance' in document.documentElement.style; | |
if (isMozillaFirefox) { | |
if (indexedDB == null) yes(); | |
else { | |
var db = indexedDB.open('inPrivate'); | |
db.onsuccess = not; | |
db.onerror = yes; | |
} | |
} | |
return isMozillaFirefox; | |
} | |
function detectSafari() { | |
var isSafari = navigator.userAgent.match(/Version\/([0-9\._]+).*Safari/); | |
if (isSafari) { | |
var testLocalStorage = function() { | |
try { | |
if (localStorage.length) not(); | |
else { | |
localStorage.setItem('inPrivate', '0'); | |
localStorage.removeItem('inPrivate'); | |
not(); | |
} | |
} catch (_) { | |
// Safari only enables cookie in private mode | |
// if cookie is disabled, then all client side storage is disabled | |
// if all client side storage is disabled, then there is no point | |
// in using private mode | |
navigator.cookieEnabled ? yes() : not(); | |
} | |
return true; | |
}; | |
var version = parseInt(isSafari[1], 10); | |
if (version < 11) return testLocalStorage(); | |
try { | |
window.openDatabase(null, null, null, null); | |
not(); | |
} catch (_) { | |
yes(); | |
} | |
} | |
return !!isSafari; | |
} | |
function detectEdgeIE10() { | |
var isEdgeIE10 = !window.indexedDB && (window.PointerEvent || window.MSPointerEvent); | |
if (isEdgeIE10) yes(); | |
return !!isEdgeIE10; | |
} | |
// when a browser is detected, it runs tests for that browser | |
// and skips pointless testing for other browsers. | |
if (detectChromeOpera()) return; | |
if (detectFirefox()) return; | |
if (detectSafari()) return; | |
if (detectEdgeIE10()) return; | |
// default navigation mode | |
return not(); | |
}); | |
} |
/** | |
* Lightweight script to detect whether the browser is running in Private mode. | |
* | |
* Live demo: | |
* @see https://output.jsbin.com/tazuwif | |
* | |
* This snippet uses Promises. If you want to run it in old browsers, polyfill it: | |
* @see https://cdn.jsdelivr.net/npm/es6-promise@4/dist/es6-promise.auto.min.js | |
* | |
* More Promise Polyfills: | |
* @see https://ourcodeworld.com/articles/read/316/top-5-best-javascript-promises-polyfills | |
* | |
* Disclaimer: | |
* No longer maintained, last updated: Feb 2020 | |
*/ | |
export function isPrivateMode(): Promise<boolean> { | |
return new Promise<boolean>(resolve => { | |
const yes = () => resolve(true); // is in private mode | |
const not = () => resolve(false); // not in private mode | |
function detectChromeOpera(): boolean { | |
// https://developers.google.com/web/updates/2017/08/estimating-available-storage-space | |
const isChromeOpera = /(?=.*(opera|chrome)).*/i.test(navigator.userAgent) && navigator.storage?.estimate; | |
if (isChromeOpera) { | |
navigator.storage.estimate().then(({ quota }) => { | |
quota < 120000000 ? yes() : not(); | |
}); | |
} | |
return !!isChromeOpera; | |
} | |
function detectFirefox(): boolean { | |
const isMozillaFirefox = 'MozAppearance' in document.documentElement.style; | |
if (isMozillaFirefox) { | |
if (indexedDB == null) yes(); | |
else { | |
const db = indexedDB.open('inPrivate'); | |
db.onsuccess = not; | |
db.onerror = yes; | |
} | |
} | |
return isMozillaFirefox; | |
} | |
function detectSafari(): boolean { | |
const isSafari = navigator.userAgent.match(/Version\/([0-9\._]+).*Safari/); | |
if (isSafari) { | |
const testLocalStorage = () => { | |
try { | |
if (localStorage.length) not(); | |
else { | |
localStorage.setItem('inPrivate', '0'); | |
localStorage.removeItem('inPrivate'); | |
not(); | |
} | |
} catch (_) { | |
// Safari only enables cookie in private mode | |
// if cookie is disabled, then all client side storage is disabled | |
// if all client side storage is disabled, then there is no point | |
// in using private mode | |
navigator.cookieEnabled ? yes() : not(); | |
} | |
return true; | |
}; | |
const version = parseInt(isSafari[1], 10); | |
if (version < 11) return testLocalStorage(); | |
try { | |
(window as any).openDatabase(null, null, null, null); | |
not(); | |
} catch (_) { | |
yes(); | |
} | |
} | |
return !!isSafari; | |
} | |
function detectEdgeIE10(): boolean { | |
const isEdgeIE10 = !window.indexedDB && (window.PointerEvent || window.MSPointerEvent); | |
if (isEdgeIE10) yes(); | |
return !!isEdgeIE10; | |
} | |
// when a browser is detected, it runs tests for that browser | |
// and skips pointless testing for other browsers. | |
if (detectChromeOpera()) return; | |
if (detectFirefox()) return; | |
if (detectSafari()) return; | |
if (detectEdgeIE10()) return; | |
// default navigation mode | |
return not(); | |
}); | |
} |
/** | |
* Live demo: | |
* @see https://output.jsbin.com/tazuwif | |
* | |
* Disclaimer: | |
* No longer maintained, last updated: Feb 2020 | |
*/ | |
isPrivateMode().then(function (isPrivate) { | |
console.log('Browsing in private mode? ', isPrivate); | |
}); |
I would like to highlight this comment from the same stackoverflow question :
Promises aren't natively supported in IE10 or 11. I'd assume you used a polyfill here
It fails to detect Private mode in Safari Version 11.0.2
Suggest: fix Chrome and Opera handler... using RequestFileSystem
third param is targed to success and last for error, like:
return void window.webkitRequestFileSystem(0, 0, on, off);
- Incognito mode detection
- Detection of bot browsing
- You can ignore mode(normal or incognito) detection if is a bot browsing
- Configure custom callbacks when private or not (you can implement a paywall in a callback when incognito detected)
https://github.com/Maykonn/js-detect-incognito-private-browsing-paywall
It fails to detect Private mode in Safari Version 11.0.2
try {
window.openDatabase(null, null, null, null);
} catch (_) {
isPrivate = true;
};
Use this code for iOS > 11
for safari
const isSafari = navigator.userAgent.match(/Version\/([0-9\._]+).*Safari/);
if (isSafari) {
const version = parseInt(isSafari[1], 10);
if (version >= 11) {
try {
window.openDatabase(null, null, null, null);
return off();
} catch (_) {
return on();
};
} else if (version < 11) {
return testLocalStorage();
}
}
This is not working for me on Mobile Chrome v 74.0.3729.155.
This is not working for me on Mobile Chrome v 74.0.3729.155.
@msmith7904 I updated snippet for chrome detection:
// Chrome & Opera
var fs = window.webkitRequestFileSystem || window.RequestFileSystem;
if (fs) {
return void fs(window.TEMPORARY, 100, not, yes);
}
However, take into account what people from Chrome said, paraphrasing...
Google is removing the ability to detect Private Browsing Mode permanently in Chrome 76 onwards. So, if you're wanting to detect private browsing it's now impossible (unless you find a way to do it that Google hasn't found). The ability to detect private browsing mode has been acknowledged as a bug and was never intended.
There should never be a situation where needing to detect private browsing mode on a normal day-to-day website is ever needed. People are choosing to browse anonymously and or not anonymously for their own reasons.
Browsers like Chrome and Firefox do not disable functionality like localStorage any more. They simply namespace it in a temporary location to prevent websites that use it from erroring out. Once you're finished browsing, the namespace is erased and nothing is saved. If you are testing for localStorage support regardless of mode, it will always return true for browsers that support it.
Other means of detecting private mode in Chrome specifically have been completely patched and will no longer work.
If it is required internally by a company, you should develop a browser plugin. Chrome and Firefox, in particular, expose internal API's which allow plugins to check if the user is in private browsing/incognito mode and action accordingly. It cannot be done outside of a plugin.
See the following links:
I wrote a JSBin (which works with IE), check it out:
Chrome 76 solved this issue :'( (https://www.androidpolice.com/2019/07/31/chrome-76/)
@dphans it was announced long time ago. We know eventually this could happen.
What we must to take into account is: What is the purpose to detect private mode? What do I want to achieve?
In my case, I initially created this snippet to detect if I was able to use localStorage
, so this snippet help me a lot. Later I used it to detect other features not present in Private Mode, always as a mechanism to provide a fallback or a Mock in order to keep consistency in the application.
Now most of APIs work also in Private Mode, and some that not works has related mechanisms to overcome the issue. What we must to do, is to detect a specific feature instead of detecting the global Private Mode, and then create a fallback mechanism, to keep working the app.
Hope this might help the new issue about the chrome private mode detection :
(https://gist.github.com/Choy-lingling/071aa8ca03ebaba3fe0278376f2321ba)
@feelinc nice article, Thank you very much. I'll be running tests and adding that snippet into this. 🎉
@jherax The snippet does not work for Safari 13.0.3. window.openDatabase(null, null, null, null)
returns {}
in both cases.
@jherax Updated snippet for chrome & opera. For this to work, you will need to add async
before (resolve) => {
// Chrome & Opera
// https://developers.google.com/web/updates/2017/08/estimating-available-storage-space
if (/(?=.*(opera|chrome)).*/i.test(navigator.userAgent) && 'storage' in navigator && 'estimate' in navigator.storage) {
const {quota} = await navigator.storage.estimate();
return (quota < 120000000) ? yes() : not();
}
💡 Thanks @kchecoMP.
I have implemented the suggested solution, keeping it with promises instead of async-await.
It is working as expected! 🎉
I also downgraded the ES syntax to be compatible with IE10+.
If you want to test new ES2015+ syntax, you can transpile it with Babel:
Additionally, I added a TypeScript source file, which can be transpiled with TSC:
@jherax The snippet does not work for Safari 13.0.3.
window.openDatabase(null, null, null, null)
returns{}
in both cases.
Same for me on Safari 13.3
It doesn't work with iOS 13
Update for Chrome and Safari?
Error in line https://gist.github.com/jherax/a81c8c132d09cc354a0e2cb911841ff1#file-is-private-mode-js-L33 with Tor Browser:
Uncaught (in promise) DOMException: The operation is insecure.
Always return false on Chrome 89.x
While this is a very cool bit of code...
I worry about the ethics of detecting a user trying to see an unfiltered view of the world and maintaining their privacy. Perhaps it's best it doesn't work now?
tested on chrome 92, doesn't work anymore.
Doesn't work on Safari anymore either.
Chrome 100, 2022, not working
For everyone, please read the following:
This script was created to detect the access to WebStorage
API, which most browsers changed in last years. The script was last updated on Feb 2020. The recommendation for everyone is to follow a "detect API" approach, working with fallbacks.
E.g.
async function isAvailableSomeApi (params) {
// detect access to the API according to your use case.
const isChrome = ...;
const isFirefox = ...;
const isSafari = ...;
const isIE10 = ...;
if (isChrome) {
return await testApiForChrome(params); // Promise<boolean>
}
if (isFirefox) {
return await testApiForFirefox(params); // Promise<boolean>
}
if (isSafari) {
return await testApiForSafari(params); // Promise<boolean>
}
if (isIE10) {
return await testApiForIE10(params); // Promise<boolean>
}
// default is treated as "api not available"
return Promise.resolve(false);
}
async function getSomeApiWithFallback() {
// use the fallback of the API according to your use case
const isAvailable = await isAvailableSomeApi(params);
if (!isAvailable) {
return buildSomeApiFallback();
}
return theRealWorkingAPI;
}
function buildSomeApiFallback() {
// implement the fallback of your missing API
// or just throw custom managed errors
}
function mainEntryPoint() {
const apiProxy = getSomeApiWithFallback();
// use safely your API
// ...
}
If anyone is looking for a solution in 2022, I have a repo available: https://github.com/Joe12387/detectIncognito
Ideas were gathered from this post on stackoverflow: Detecting if a browser is using Private Browsing mode