MirrorSave
/
budibase
mirror of https://github.com/Budibase/budibase.git
1
0
Fork 0
Code Issues Packages Projects Releases Wiki Activity

Merge pull request #14411 from Budibase/poc-authenticated-iframe 

Poc authenticated iframe
This commit is contained in:
Martin McKeaveney 2024-09-02 09:08:56 +01:00 committed by GitHub
parent fc367476c1 f7b2c77be4
commit cbf6891c5f
No known key found for this signature in database
GPG Key ID: B5690EEEBB952194
3 changed files with 169 additions and 101 deletions
Show Stats Download Patch File Download Diff File Expand all files Collapse all files

21
packages/builder/src/dataBinding.js
View File

@ -57,6 +57,7 @@ export const getBindableProperties = (asset, componentId) => {
const stateBindings = getStateBindings()
const selectedRowsBindings = getSelectedRowsBindings(asset)
const roleBindings = getRoleBindings()
const embedBindings = getEmbedBindings()
return [
...contextBindings,
...urlBindings,
@ -65,6 +66,7 @@ export const getBindableProperties = (asset, componentId) => {
...deviceBindings,
...selectedRowsBindings,
...roleBindings,
...embedBindings,
]
}
@ -813,6 +815,25 @@ export const getActionBindings = (actions, actionId) => {
return bindings
}
/**
* Gets all device bindings for embeds.
*/
const getEmbedBindings = () => {
let bindings = []
const safeEmbed = makePropSafe("embed")
bindings = [
{
type: "context",
runtimeBinding: `${safeEmbed}`,
readableBinding: `ParentWindow`,
category: "Embed",
icon: "DistributeVertically",
},
]
return bindings
}
/**
* Gets the schema for a certain datasource plus.
* The options which can be passed in are:

6
packages/client/src/components/ClientApp.svelte
View File

@ -42,6 +42,7 @@
import FreeFooter from "components/FreeFooter.svelte"
import MaintenanceScreen from "components/MaintenanceScreen.svelte"
import SnippetsProvider from "./context/SnippetsProvider.svelte"
import EmbedProvider from "./context/EmbedProvider.svelte"
// Provide contexts
setContext("sdk", SDK)
@ -160,6 +161,7 @@
{#if $environmentStore.maintenance.length > 0}
<MaintenanceScreen maintenanceList={$environmentStore.maintenance} />
{:else}
<EmbedProvider>
<DeviceBindingsProvider>
<UserBindingsProvider>
<StateBindingsProvider>
@ -212,7 +214,8 @@
Something went wrong rendering your app
</Heading>
<Body size="S">
Get in touch with support if this issue persists
Get in touch with support if this issue
persists
</Body>
</Layout>
</div>
@ -270,6 +273,7 @@
</StateBindingsProvider>
</UserBindingsProvider>
</DeviceBindingsProvider>
</EmbedProvider>
{/if}
</div>
<KeyboardManager />

43
packages/client/src/components/context/EmbedProvider.svelte Normal file
View File

@ -0,0 +1,43 @@
<script>
import Provider from "./Provider.svelte"
import { onMount } from "svelte"
let data = {}
function extractDomainFromUrl(url) {
const { hostname } = new URL(url)
const parts = hostname.split(".")
const tld = parts.slice(-2).join(".")
return tld
}
function handleMessage(event) {
if (event.data?.type !== "bb-parent-window-event") {
return
}
// Validate the event origin to ensure it's coming from a trusted source
// Allow different subdomains but must match TLD
const appOrigin = extractDomainFromUrl(window.location.origin)
const eventOrigin = extractDomainFromUrl(event.origin)
if (appOrigin === eventOrigin) {
data = event.data
} else {
console.error(
`Embedded budibase app domain ${appOrigin} does not match origin of event ${eventOrigin}.
Top level domains must match`
)
}
}
onMount(() => {
window.addEventListener("message", handleMessage)
return () => window.removeEventListener("message", handleMessage)
})
</script>
<Provider key="embed" {data}>
<slot />
</Provider>