@tapni/auth 1.0.11 → 1.0.13

package/dist/{install-DfWX9rnL.js → install-A3lGv2lC.js}

@@ -1397,7 +1397,7 @@ function pa(n, e, t, r, o, i) {
 const ao = /* @__PURE__ */ _t(oa, [["render", pa], ["__scopeId", "data-v-7aad6400"]]), ha = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   default: ao
-}, Symbol.toStringTag, { value: "Module" })), fa = "1.0.11", cr = {
+}, Symbol.toStringTag, { value: "Module" })), fa = "1.0.12", cr = {
   getMe() {
     return le().get("/users/me");
   },
@@ -5563,7 +5563,7 @@ Tanıştığınız herkesi etkileyin 😎 <br> Kendinize bir tane ayırın 👇`
     choose_other_login_methods: "다른 로그인 방법 선택하기",
     no_sso_logins: "귀하의 회사는 SSO 로그인을 사용하지 않습니다. 관리자에게 문의하십시오."
   }
-}, To = () => Promise.resolve().then(() => ha), ma = () => Promise.resolve().then(() => mc), _a = () => Promise.resolve().then(() => cl), va = () => Promise.resolve().then(() => Xu), ya = () => Promise.resolve().then(() => zc), wa = () => Promise.resolve().then(() => Cl), ba = () => Promise.resolve().then(() => od), ka = () => import("./QR-BxHBi2nV.js"), Ca = () => Promise.resolve().then(() => Cu), Ea = () => import("./Apps-D903yvip.js"), Ta = () => import("./Billing-CQp6b4tB.js"), Sa = () => import("./CustomApp-h6WA5um0.js"), Ia = () => import("./General-DA3IgC3X.js"), Aa = [
+}, To = () => Promise.resolve().then(() => ha), ma = () => Promise.resolve().then(() => mc), _a = () => Promise.resolve().then(() => cl), va = () => Promise.resolve().then(() => Xu), ya = () => Promise.resolve().then(() => zc), wa = () => Promise.resolve().then(() => Cl), ba = () => Promise.resolve().then(() => od), ka = () => import("./QR-ShTn8gSL.js"), Ca = () => Promise.resolve().then(() => Cu), Ea = () => import("./Apps-DeRIQjBx.js"), Ta = () => import("./Billing-DsilesKo.js"), Sa = () => import("./CustomApp-CEzhE2YM.js"), Ia = () => import("./General-C9CUD54h.js"), Aa = [
   {
     path: "/welcome",
     name: "AuthWelcome",
@@ -15218,7 +15218,7 @@ const xs = Ir("MsAuthPlugin", {
       let o = this;
       window.addEventListener("message", async (i) => {
         var a;
-        if (!this.allowedOriginsAuth.includes(i.origin)) return console.log("Origin is not allowed!");
+        if (!this.allowedOriginsAuth.includes(i.origin)) return console.log("Origin is not allowed! " + i.origin);
         if (i.data.type === "saml" && i.data.code) {
           if (this.display === "popup")
             return (a = window.parent) == null ? void 0 : a.postMessage({ code: i.data.code, state: this.$route.query.state, code_verifier: localStorage.getItem("pkce_code_verifier") }, "*");

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@tapni/auth",
-  "version": "1.0.11",
+  "version": "1.0.13",
   "type": "module",
   "main": "./dist/TapniAuth.umd.js",
   "module": "./dist/TapniAuth.es.js",

package/src/mixins/saml.mixin.js

@@ -6,21 +6,30 @@ export default {
 	data () {
 		return {
 			code_verifier: '',
-			code_challenge: ''
-		}
+			code_challenge: '',
+			shouldCloseWindow: false,
+			popupWindow: null,
+			checkInterval: null
+		};
 	},
 	computed: {
 	},
 	watch: {
-		/*
-		'$route.path': async function(routePath) {
-			await this.handleSamlRedirect(routePath)
+		'$route.path' (nv) {
+			if (nv === '/callback/saml') {
+				this.handleSamlRedirect(nv)
+			}
 		}
-		 */
 	},
 	methods: {
-		async samlLogin (loginUrl) {
-
+		closeWindow() {
+			try {
+				window.close()
+			} catch (e) {
+				console.log('Window close error', e);
+			}
+		},
+		async samlLogin(loginUrl) {
 			// Create and store a new PKCE code_verifier (the plaintext random secret)
 			this.code_verifier = UtilService.generateRandomString(28);
 			localStorage.setItem("pkce_code_verifier", this.code_verifier);
@@ -31,57 +40,98 @@ export default {
 			const platform = Capacitor.getPlatform();
 
 			// append public key as relayState
-			let dataString = `code_challenge=${this.code_challenge}&platform=${platform}&redirect_uri=${(location.origin + '/callback/saml')}&realm=${this.$storex.realm}`;
+			let dataString = `code_challenge=${this.code_challenge}&platform=${platform}&redirect_uri=${location.origin + '/callback/saml'}&realm=${this.realm}&display=${this.display}`;
 			let relayState = btoa(dataString);
 
 			loginUrl = `${loginUrl}&RelayState=${relayState}`
 
 			let self = this;
 
-			window.addEventListener("message", async (message)=> {
-				if (!this.allowedOriginsAuth.includes(message.origin)) return console.log('Origin is not allowed!');
-				if(message.data.type === 'saml' && message.data.code) {
-					if (this.display === 'popup') {
-						return window.parent?.postMessage({ code: message.data.code, state: this.$route.query.state, code_verifier: localStorage.getItem("pkce_code_verifier") }, '*');
+			window.addEventListener(
+				'message',
+				async (message) => {
+					if (!this.allowedOriginsAuth.includes(message.origin)) return console.log('Origin is not allowed! ' + message.origin);
+					if (message.data.code) {
+						console.log('post message from opener', message.data, self.display);
+
+						if (self.display === 'popup') {
+							return window.parent?.postMessage({ code: message.data.code, state: message.data.state, code_verifier: localStorage.getItem('pkce_code_verifier') }, '*');
+						}
+						await self.exchangeAuthCode({ code: message.data.code, code_verifier: localStorage.getItem('pkce_code_verifier') });
+						localStorage.removeItem('pkce_code_verifier');
 					}
-					await self.exchangeAuthCode({code: message.data.code, code_verifier: localStorage.getItem("pkce_code_verifier")});
-					localStorage.removeItem("pkce_code_verifier");
-				}
-			}, { once: true });
+				},
+				{ once: true }
+			);
+
+			if (this.isNative) {
+				this.popupWindow = await Browser.open({ url: loginUrl, presentationStyle: 'popover' });
+			} else {
+				this.checkInterval = setInterval(() => {
+					// check localStorage
+					const code = localStorage.getItem('auth_code');
+					const pkce = localStorage.getItem('pkce_code_verifier');
 
-			let popupWindow;
-			if(this.isNative) {
-				popupWindow = await Browser.open({ url: loginUrl, presentationStyle: 'popover'});
+					console.log('interval', code, pkce);
+
+					if (code) {
+						clearInterval(this.checkInterval);
+						localStorage.removeItem('auth_code');
+						localStorage.removeItem('pkce_code_verifier');
+
+						// handle code exchange
+						window.parent?.postMessage({ code: code, state: this.$route.query.state, code_verifier: pkce }, '*');
+
+						// attempt to close child if possible
+						// if (this.popupWindow?.closed === false) this.popupWindow.close();
+					}
+				}, 500);
+
+				this.popupWindow = window.open('https://auth.tapni.com/callback/redirect?uri=' + btoa(loginUrl), 'popup', 'width=600,height=600');
 			}
-			else popupWindow = window.open(loginUrl, 'popup','width=600,height=600')
-			/*
-			popupWindow.addEventListener('beforeunload', () => {
-				console.log('window closed')
-			})
-			 */
+
+			if (this.popupWindow) {
+				this.popupWindow.addEventListener('beforeunload', () => {
+					console.log('popup window closed');
+				})
+			}
+
 		},
 		async handleSamlRedirect() {
 			let code;
-			let postMessageData = {type: 'saml'}
-			if (this.$route.query.code) postMessageData.code = this.$route.query.code;
-			if(window.opener) {
-				window.opener.postMessage(postMessageData, location.origin);
-				window.close()
+			if (this.$route.query.code) {
+				code = this.$route.query.code
+			}
+			console.log('window1', window.opener);
+			console.log('window2', window.parent);
+			if (window.opener) {
+				window.opener.postMessage({ type: 'saml', code }, '*');
+				this.closeWindow();
 			} else {
-				if(this.isNative && this.isiOS) await Browser.close();
-				EventBus.$emit('ssoEvent', {name: 'setLoading', data: true})
-				if (this.$route.query.code) code = this.$route.query.code
+				if (this.isNative && this.isiOS) await Browser.close();
+				EventBus.$emit('ssoEvent', { name: 'setLoading', data: true });
 
-				console.log(this.display, {code});
+				console.log(this.display, { code }, window.parent, window.opener);
 
 				if (code) {
 					if (this.display === 'popup') {
-						return window.parent?.postMessage({ code: code, state: this.$route.query.state }, '*');
+						localStorage.setItem('auth_code', code);
+						this.shouldCloseWindow = true;
+						window.parent?.postMessage({ code: code, state: this.$route.query.state }, '*');
+						this.closeWindow()
+					}
+					// TODO: Replace URLs with .env variables to support staging
+					if (this.display === 'redirect' || location.host === 'auth.tapni.com') {
+						let redirect_url = 'https://auth.tapni.com/callback/auth';
+						if (this.realm === 'dashboard') {
+							redirect_url = 'https://business.tapni.com/login'
+						}
+						return location.href = redirect_url + '?code=' + code + '&code_verifier=' + localStorage.getItem('pkce_code_verifier');
 					}
-					await this.exchangeAuthCode({code, code_verifier: localStorage.getItem("pkce_code_verifier")});
+					await this.exchangeAuthCode({ code, code_verifier: localStorage.getItem('pkce_code_verifier') });
 				}
-				localStorage.removeItem("pkce_code_verifier");
-				EventBus.$emit('ssoEvent', {name: 'setLoading', data: false})
+				// localStorage.removeItem('pkce_code_verifier');
+				EventBus.$emit('ssoEvent', { name: 'setLoading', data: false });
 			}
 		}
 	},