Hi, I’d like to embed a form that I’ve built with Five on our existing website. Is there a way for me to embed this as an iframe?
Hi TheMaskedDev,
The easiest way to allow embedding a form from our Five Application is to use external URL’s. External URLs allow you to expose a form/query/process to the world in a public manner.
-
First, ensure you have a form already setup that you wish to expose to the web.
-
Select on the lefthand side in the menu ‘URLs’.
-
Click on the Add Item button.
-
Fill in the URL field the name of the URL you would like to expose it as, for example: reservations (We will discuss this further)
-
Choose the Action of the form in the Action field.
-
Optionally you can have a different theme to the main application.
-
Save this URL configuration.
-
Next run your application.
All URL’s are externally available via the /url/ navigation path on your running application, therefor to gain access to your new public URL navigate in a browser to http://your-application-id.five.dev/url/reservations
Now you can use this URL in another remote website via an iFrame.
<iframe src=“http://your-application-id.five.dev/url/reservations”></iframe>
Please note, this feature only exists in the cloud-hosted version of Five.
1 Like
Hi: If we are publishing embed URL’s then can we access the HTTP headers so we can control the allowed frame ancestors using the Content Security Policies
Hi Michael, thanks for the question. Unfortunately, I’m not 100% sure I understand the question regarding Custom URLs. - would you mind clarifying please?
Thanks!
Hi:
This all comes about when using a FileMaker web server (Web Direct). I do not know if the same kind of problems would occur in an Apache/ LAMP environment.
When embedding a page or site into an iFrame many servers default settings (such as IIS) will restrict the ancestor frame to “self”. This will avoid cross site security vulnerabilities. (Not my expertise) . This is a browser function so you need to tell the browser all is well. - its complicated.
To relax the allowable source domains you can add HTTP headers. A typical use case would be to allow a customer domain such as client.sharepoint.com to be able to access the iFrame content using an iFrame embed web part. One of our customers access some of our application pages that way.
xxxxxxxcontent-security-policy.com/frame-ancestorsxxxxxxxx
It would be helpful to have access to the http headers of the web server hosting the Five solution.
It could be that the default server settings Five are using may be different to IIS.
The server settings can be checked with this tool.
THIS POST DOES NOT ALLOW LINKS
This is a bit of a difficult subject because many browsers disable cross site tracking by default which can defeat some iFrame solutions. I have found that trial and error is the only way which is made easier if we have access to the CSP settings.
There are often further issues where cookies are expected to be sent out by the target server and the browser [via the iFrame portal] does not receive the cookie so the application will then refuse to proceed. The solution to that is also fairly complicated and may require some custom in the page containing the iFrame
Michael
Hi Michael,
You can add additional headers to external URLs using the Additional Headers field on the URL form. You can create URLs in the Desktop version, however, they are only accessible when deployed in the cloud.
I hope this covers what you asking, please see below for an example.
Add a Header to a URL
- Navigate to the URL form.
- Click in the Additional Headers field.
- Add the header name into the Key field and its associated value in the Value field.
