Headers

The Headers settings allow you to control how your WeWeb application can be embedded in iframes and configure custom HTTP headers for security, caching, and other purposes.

Accessing headers settings

To configure headers:

1. Click on the Settings icon (cog icon) in the Interface section sidebar
2. Under the Advanced section, click Headers

This opens the headers configuration modal.

Iframe embedding

By default, once published, your WeWeb app can be embedded in an iframe on other websites. You can control this behavior to protect your application from clickjacking attacks or to limit where your app can be displayed.

Embedding options

You have three options for iframe embedding:

Allow iframe embedding

• Your app can be embedded in iframes on any website
• No restrictions on where your app is displayed
• Least secure option but maximum flexibility

Allow on same domain only

• Your app can only be embedded in iframes on pages from the same domain
• Prevents external sites from embedding your app
• Good balance of security and flexibility for multi-page apps

Block iframe embedding

• Your app cannot be embedded in any iframe
• Maximum security against clickjacking
• Recommended for most applications unless you specifically need iframe embedding

Setting iframe embedding

To configure iframe embedding:

1. Open Headers settings
2. Find the iframe embedding section
3. Select your preferred option
4. Save your changes

In the example above, you can see the iframe embedding options and the custom headers section where you can add custom headers to your published project.

TIP

Unless you have a specific need for your app to be embedded in iframes, it's recommended to either block embedding or allow it only on the same domain for security purposes.

When to allow iframe embedding

Allow iframe embedding when:

• Your app is designed to be embedded in other sites
• You're building widgets or embeddable components
• You have a specific integration that requires iframe embedding

Block or restrict iframe embedding when:

• Building a standard web application
• Handling sensitive data or authentication
• Security is a primary concern

Custom headers

Custom headers allow you to add HTTP response headers to your published application. These headers can control security policies, caching behavior, and other browser behaviors.

Adding a custom header

To add a custom header:

1. Open Headers settings
2. Find the custom headers section
3. Click Add header
4. Enter the header name
5. Enter the header value
6. Save your changes

Testing custom headers

After adding custom headers:

1. Publish your application
2. Open your published app in a browser
3. Open the browser's developer tools
4. Go to the Network tab
5. Refresh the page
6. Click on the main document request
7. Check the Response Headers to verify your custom headers are present

Removing custom headers

To remove a custom header:

1. Open Headers settings
2. Find the header you want to remove
3. Click the remove/delete option
4. Save your changes

CONTINUE LEARNING

Learn about managing other app settings:

Learn about redirections →