diff --git a/.temp/iframe-inner.html b/.temp/iframe-inner.html new file mode 100644 index 0000000..02494c7 --- /dev/null +++ b/.temp/iframe-inner.html @@ -0,0 +1,22 @@ + + + +
+ + + \ No newline at end of file diff --git a/src/Embed/Embed.php b/src/Embed/Embed.php index 80ab284..c8e6023 100644 --- a/src/Embed/Embed.php +++ b/src/Embed/Embed.php @@ -2,6 +2,7 @@ namespace Hyvor\Unfold\Embed; +use Hyvor\Unfold\Embed\Iframe\PrivacyIframe; use Hyvor\Unfold\Exception\EmbedUnableToResolveException; use Hyvor\Unfold\Exception\EmbedParserException; use Hyvor\Unfold\Exception\UnfoldException; @@ -19,11 +20,11 @@ public static function getParsers(): array $namespace = __NAMESPACE__ . '\\Platforms\\'; $parsers = array_map( - fn ($file) => $namespace . pathinfo((string)$file, PATHINFO_FILENAME), + fn($file) => $namespace . pathinfo((string)$file, PATHINFO_FILENAME), (array)glob(__DIR__ . '/Platforms/*.php') ); - usort($parsers, fn ($a, $b) => $b::PRIORITY <=> $a::PRIORITY); + usort($parsers, fn($a, $b) => $b::PRIORITY <=> $a::PRIORITY); return $parsers; } @@ -73,6 +74,10 @@ public static function getUnfoldedObject( ): Unfolded { $oembed = self::parse($url, $context->config); + if ($context->config->embedIframeEndpoint && $oembed->html) { + $oembed->html = PrivacyIframe::wrap($oembed->html); + } + return Unfolded::fromEmbed( $oembed, $url, diff --git a/src/Embed/Iframe/PrivacyIframe.php b/src/Embed/Iframe/PrivacyIframe.php index 907c834..b5876c2 100644 --- a/src/Embed/Iframe/PrivacyIframe.php +++ b/src/Embed/Iframe/PrivacyIframe.php @@ -5,4 +5,25 @@ class PrivacyIframe { + public static function wrap(string $html): string + { + $encoded = base64_encode($html); + + return << + + +`} +/> + +

PHP Library

+ +

+ If you are using the PHP Library, you have to set up an endpoint for the + iframe. Here is an example with Laravel: +

+ +input('url'); + + try { + $data = Unfold::unfold($url); + return PrivacyIframe::inner($data); + } catch (UnfoldException) { + // handle the exception + } + } + +} +`} + language="js" +/> diff --git a/website/src/routes/[[slug]]/Introduction.svelte b/website/src/routes/[[slug]]/Introduction.svelte index e6d4666..498c4a9 100644 --- a/website/src/routes/[[slug]]/Introduction.svelte +++ b/website/src/routes/[[slug]]/Introduction.svelte @@ -2,7 +2,7 @@ import { CodeBlock } from '@hyvor/design/components'; -

Introduction

+

Hyvor Unfold

Hyvor Unfold is an open-source API that can fetch metadata from URLs for acc.concat(category.pages), [] as Page[]); diff --git a/website/src/routes/iframe-test/+page.svelte b/website/src/routes/iframe-test/+page.svelte new file mode 100644 index 0000000..5ecafff --- /dev/null +++ b/website/src/routes/iframe-test/+page.svelte @@ -0,0 +1,8 @@ +

This is an iframe that changes its height every time you click on it.

+ + + + + + diff --git a/website/src/routes/iframe-test/inner/+page.svelte b/website/src/routes/iframe-test/inner/+page.svelte new file mode 100644 index 0000000..47fc03e --- /dev/null +++ b/website/src/routes/iframe-test/inner/+page.svelte @@ -0,0 +1,25 @@ + + + + + + + + {#each Array(items) as _, i} +
+ {/each} + + + diff --git a/website/static/child.js b/website/static/child.js new file mode 100644 index 0000000..2b6bce6 --- /dev/null +++ b/website/static/child.js @@ -0,0 +1,42 @@ +(function () { + function sendHeight() { + const height = document.documentElement.scrollHeight; + + try { + const iframe = window.frameElement; + if (iframe) { + iframe.style.height = `${height}px`; + } else { + throw new Error('iframe not found'); + } + } catch (e) { + window.parent.postMessage( + { + type: 'unfold-iframe-resize', + height + }, + '*' + ); + } + } + + let mutationCallTimeout = null; + + function processMutations() { + if (mutationCallTimeout) { + clearTimeout(mutationCallTimeout); + } + mutationCallTimeout = setTimeout(sendHeight, 100); + } + + function init() { + const mutation = new window.MutationObserver(processMutations); + mutation.observe(document.body, { + childList: true, + subtree: true + }); + sendHeight(); + } + + document.addEventListener('DOMContentLoaded', init); +})(); diff --git a/website/static/parent.js b/website/static/parent.js new file mode 100644 index 0000000..b061fb9 --- /dev/null +++ b/website/static/parent.js @@ -0,0 +1,15 @@ +(function () { + window.addEventListener('message', function (event) { + const source = event.source; + const iframes = document.querySelectorAll('iframe'); + + for (let iframe in iframes) { + if (iframes[iframe].contentWindow === source) { + console.log('found the source', event.data); + if (event.data.type === 'unfold-iframe-resize') { + iframes[iframe].style.height = `${event.data.height}px`; + } + } + } + }); +})();