This is a window launcher for front-end compatibility with browser issues when using window.open.
- Supports window.open after asynchronous requests in iOS Safari.
- Supports whether to close the old window when opening a new one
- Provides browser detection (Safari, Firefox, IE, Wechat, Line, Facebook), default is Chrome.
yarn add @acrool/window-launcheruse in your page/component:
import {Launcher} from '@acrool/window-launcher';
const launcher = new Launcher({
readyUrl: '/loading.html',
isEnableCatchClose: true,
});- open loading page
- xhr requet
- replace loading page to new url
launcher
.open(async () => {
const json = await axios.get('/url1.json');
return json.data.gameUrl;
// or
// return {
// type: 'url',
// value: json.data.html,
// };
})
.catch(e => {
logRef.current.append('\ncatch...');
})
.finally(() => {
logRef.current.append('\nfinally...');
});launcher
.open(async () => {
const json = await axios.get('/html.json');
return {
type: 'html',
value: json.data.html,
};
})
.catch(e => {
logRef.current.append('\ncatch...');
})
.finally(() => {
logRef.current.append('\nfinally...');
});ex: pdf preview
let url = '';
launcher
.open(async () => {
const json = await axios.get('/blob.json');
url = URL.createObjectURL(base64ToBlob(res.buffer, res.mimeType));
return url;
})
.catch(e => {
logRef.current.append('\ncatch...');
})
.finally((url) => {
URL.revokeObjectURL(url);
logRef.current.append('\nfinally...');
});import Launcher, {
checkIsMobile,
checkIsAndroid,
checkIsIOS,
getBrowser,
checkIsChromeBrowser,
checkIsSafariBrowser,
checkIsFirefoxBrowser,
checkIsEdgeBrowser,
checkIsLineBrowser,
checkIsFacebookBrowser, checkIsWebview, checkIsPWA
} from '@acrool/window-launcher';import Launcher, {
checkIsMobile,
checkIsAndroid,
checkIsIOS,
} from '@acrool/window-launcher';Here, declare things that go in the global namespace, or augment existing declarations in the global namespace
typings/global.d.ts
import {Launcher} from '@acrool/window-launcher';
declare global {
interface Window {
ActiveXObject: string
dataLayer: any[]
launcher: Launcher
}
}tsconfig.json
{
"files": [
"typings/global.d.ts"
]
}There is also a example that you can play with it: