SeaTable Tips | Embed table into existing application

With the continuous development of business, application development has also become diverse. In order to help companies save development manpower and resource costs, as a light-weight database with strong readability and easy operation, SeaTable can embed the table content in a variety of applications in the form of low-code or no-code.

• FAQ (Frequently Asked Questions)
• Product promotion
• Customer relationship management
• Job task release, etc.

The main business relationship between this part of the content and the application is not big, but it plays a very important role in business management or product promotion. If this part of the content is developed separately, it will not only need to invest a lot of time cost, development cost, software update and operating cost, but also may cause a decline in production and loss of customers in the process, and the gain is not worth the loss. Therefore, those extensible, point-to-point business requirements can be realized by using SeaTable. You only need to maintain a table, and then embed the link of the table into your application to show it. Realize the corresponding function of the designated module with zero-cost development investment.

Taking the English official website of Seafile as an example, we embed the product release roadmap directly into the official website.

SeaTable currently has two ways of embedding, both of which are implemented by putting the link in the iframe tag. There are some subtle differences between the two methods. Now we will introduce them separately:

Method 1: Embed via external link URL

This method can expose the content to free applications and websites through the read-only permission of the form, and is suitable for FAQs, product releases, service introductions, and so on.

At this time, you can generate an "external link" through "Share" in the Workspace workspace or the specific form page.

△Shared entrance

△Shared entrance

After opening the "Share" page, click on the "External link", the user can add a password, expiration time, or custom URL according to their needs, or can directly click on the "Generate link", then an external link entry will appear below:

Click on the "<>" link to enter the preview page of the embedded page, including the preview effects on the computer and mobile phones. At this time, a section of iframe tag code appears in the head. Copy the code to your own application to complete the embedding.

Method 2: Embed by the URL of the form

This method can directly embed the native table of SeaTable. At this time, the user needs to log in and view the content of the table on the embedding page. At the same time, the content of the table can be edited and modified. It is suitable for non-public occasions, such as internal staff information collation, dispatching tasks, sales records and so on.

View the URL through the details page of the form:

Use the above URL instead of the src attribute in the iframe tag in Method 1, to complete the embedding:

<iframe className="dtable-embed" src="http://127.0.0.1:8000/workspace/70/dtable/SeaTable%20FAQ/?tid=0000&vid=0000" frameBorder="0" width="100%" height="667" style="background: transparent; border: 1px solid #ccc;">
</iframe>

At this time, since it is not a publicly public link, the user is required to log in to view the content of the form. The effect is as follows:

Developer Edition configuration

If you are using SeaTable Developer Edition, if you want to embed the table smoothly, you need to add the following settings in the dtable_web_settings.py file:

SESSION_COOKIE_SAMESITE = None
SESSION_COOKIE_SECURE = True
CSRF_COOKIE_SAMESITE = None
CSRF_COOKIE_SECURE = True

to sum up

SeaTable not only has its own powerful system functions such as tables, calculations, statistics, charts, etc., to help users improve business and work efficiency. Its rich API can also help developers to connect data, and its embedded functions can also help those who do not understand development. Those who don't know how to write code extend their business requirements to their own applications, and truly achieve the purpose of one form and multiple applications.