<script>
import { onMount } from "svelte";
let titulo = "titulo"
Dentro de Svelte
onMount(() => {
var iframe = document.getElementById("app-frame");
iframe.onload = () => {
console.log("el iframe está cargado");
iframe.contentWindow.postMessage({ score: 10 }, "*");
};
});
</script>
<h1>Welcome to SvelteKit</h1>
<!-- <p>{titulo}</p> -->
<p>
Visit <a href="https://kit.svelte.dev">kit.svelte.dev</a> to read the documentation
</p>
<iframe
src="https://playcanv.as/e/p/DvhXkh4S/"
id="app-frame"
width="1820"
height="800"
title="aplicación de playCavnas"
>
<!-- frameborder="1020" -->
<!-- loading="lazy" -->
</iframe>
And this is the code from playCanvas:
var ApiText = pc.createScript(‘apiText’);
ApiText.prototype.initialize = function() {
console.log(“inicializado el script”);
window.addEventListener('message', function(e) {
console.log("mensaje recibido", e.data);
});
};
What I’ve tried so far is to make a new whole playCanvas project and a new skeleton-project in Svelte so I can get rid off any other entity problem.
The first code is written is Svelte and I’ve used the /e in the src attribute on iframe as I saw on another topic here in the forum.
Then, from pC I’ve used an event listener for the message.
I get the console.log inicializando el script (meaning script initialized in english), I also get the “el iframe está cargado” which means “iframe is loaded” because of the onload.
But I still not getting the “e.data” from the listener, what can I do?