remove origin checks - these might be the final CORS blockers

This commit is contained in:
Brandon Thomas
2024-03-09 13:10:08 -05:00
parent b36ee00d73
commit a958cc8283
@@ -4,52 +4,52 @@ import { SceneState, type SceneStateEvent } from "@storyteller/studio";
import { LitElement, nothing } from "lit"; import { LitElement, nothing } from "lit";
import { customElement } from "lit/decorators.js"; import { customElement } from "lit/decorators.js";
const PARENT_ORIGIN_WHITELIST: readonly string[] = [ //const PARENT_ORIGIN_WHITELIST: readonly string[] = [
"https://fakeyou.com", // "https://fakeyou.com",
"https://storyteller.ai", // "https://storyteller.ai",
"https://staging.fakeyou.com", // "https://staging.fakeyou.com",
"https://staging.storyteller.ai", // "https://staging.storyteller.ai",
"https://feature-mvp--fakeyou.netlify.app", // "https://feature-mvp--fakeyou.netlify.app",
"https://feature-mvp--storyteller-ai.netlify.app", // "https://feature-mvp--storyteller-ai.netlify.app",
"http://dev.fakeyou.com:7000", // "http://dev.fakeyou.com:7000",
"http://dev.fakeyou.com:7001", // "http://dev.fakeyou.com:7001",
"http://dev.fakeyou.com:7002", // "http://dev.fakeyou.com:7002",
"http://devproxy.fakeyou.com:7000", // "http://devproxy.fakeyou.com:7000",
"http://devproxy.fakeyou.com:7001", // "http://devproxy.fakeyou.com:7001",
"http://devproxy.fakeyou.com:7002", // "http://devproxy.fakeyou.com:7002",
"http://dev.storyteller.ai:7000", // "http://dev.storyteller.ai:7000",
"http://dev.storyteller.ai:7001", // "http://dev.storyteller.ai:7001",
"http://dev.storyteller.ai:7002", // "http://dev.storyteller.ai:7002",
"http://devproxy.storyteller.ai:7000", // "http://devproxy.storyteller.ai:7000",
"http://devproxy.storyteller.ai:7001", // "http://devproxy.storyteller.ai:7001",
"http://devproxy.storyteller.ai:7002", // "http://devproxy.storyteller.ai:7002",
"http://localhost:7000", // "http://localhost:7000",
"http://localhost:7001", // "http://localhost:7001",
"http://localhost:7002", // "http://localhost:7002",
]; //];
@customElement("sts-iframe-messaging-bridge") @customElement("sts-iframe-messaging-bridge")
export class IframeMessagingBridgeElement extends LitElement { export class IframeMessagingBridgeElement extends LitElement {
#parentWindow?: Window; #parentWindow?: Window;
#parentOrigin?: string; //#parentOrigin?: string;
override connectedCallback(): void { override connectedCallback(): void {
console.log('window.parent', window.parent); console.log('window.parent', window.parent);
console.log('window.parent.origin', window.parent.origin); //console.log('window.parent.origin', window.parent.origin);
try { try {
if ( if (
window.parent window.parent
&& window.parent !== window && window.parent !== window
&& PARENT_ORIGIN_WHITELIST.includes(window.parent.origin) //&& PARENT_ORIGIN_WHITELIST.includes(window.parent.origin)
) { ) {
this.#parentWindow = window.parent; this.#parentWindow = window.parent;
this.#parentOrigin = window.parent.origin; //this.#parentOrigin = window.parent.origin;
} }
} }
catch { catch {
this.#parentWindow = undefined; this.#parentWindow = undefined;
this.#parentOrigin = undefined; //this.#parentOrigin = undefined;
} }
super.connectedCallback(); super.connectedCallback();
@@ -58,10 +58,10 @@ export class IframeMessagingBridgeElement extends LitElement {
@on("window:message") @on("window:message")
onParentMessage(event: MessageEvent<string>): void { onParentMessage(event: MessageEvent<string>): void {
console.log('window.parent', window.parent); console.log('window.parent', window.parent);
console.log('window.parent.origin', window.parent.origin); //console.log('window.parent.origin', window.parent.origin);
if (!this.#parentOrigin || event.origin !== this.#parentOrigin) //if (!this.#parentOrigin || event.origin !== this.#parentOrigin)
return; // return;
if (event.data === "save-scene") if (event.data === "save-scene")
studio.saveScene(); studio.saveScene();
@@ -70,24 +70,28 @@ export class IframeMessagingBridgeElement extends LitElement {
@on("window:scene-uploaded") @on("window:scene-uploaded")
onSceneUploaded(event: CustomEvent<string>): void { onSceneUploaded(event: CustomEvent<string>): void {
console.log('window.parent', window.parent); console.log('window.parent', window.parent);
console.log('window.parent.origin', window.parent.origin); //console.log('window.parent.origin', window.parent.origin);
if (!this.#parentWindow || !this.#parentOrigin) if (!this.#parentWindow /*|| !this.#parentOrigin */)
return; return;
this.#parentWindow.postMessage(`scene-saved:${event.detail}`, this.#parentOrigin); // NB: We'll need to receive and validate the targetOrigin by another method since CORS
// removes our ability to inspect this via `window.parent.origin`.
//this.#parentWindow.postMessage(`scene-saved:${event.detail}`, this.#parentOrigin);
this.#parentWindow.postMessage(`scene-saved:${event.detail}`, "*");
} }
@on("window:scene-state") @on("window:scene-state")
onSceneStateChange({ detail: state }: SceneStateEvent): void { onSceneStateChange({ detail: state }: SceneStateEvent): void {
console.log('window.parent', window.parent); console.log('window.parent', window.parent);
console.log('window.parent.origin', window.parent.origin); //console.log('window.parent.origin', window.parent.origin);
if (!this.#parentWindow || !this.#parentOrigin) if (!this.#parentWindow /* || !this.#parentOrigin */)
return; return;
if (state === SceneState.Active) if (state === SceneState.Active)
this.#parentWindow.postMessage("studio-ready", this.#parentOrigin); //this.#parentWindow.postMessage("studio-ready", this.#parentOrigin);
this.#parentWindow.postMessage("studio-ready", "*");
} }
protected override render = () => nothing; protected override render = () => nothing;