The CloudTables component for Svelte let's you embed tables directly into your Svelte application using the component tag: <CloudTables/>
and attributes to configure it.
The CloudTables component for Svelte is available as the @cloudtables/svelte
package on npm and can be installed in your Svelte application using:
# npm
npm install --save @cloudtables/svelte
# yarn
yarn add @cloudtables/svelte
After npm has finished installing, import the component in the .svelte
file you wish to embed the CloudTable into (e.g. App.svelte
)
import CloudTables from '@cloudtables/svelte';
Once imported you can then use the custom <CloudTables/>
tag to embed a CloudTable into your application. The attributes available for this tag are:
src
The custom url for your CloudTable which can be seen in the Embed page for your data set.apiKey
would be replaced by your API Key (see the Security / API Keys section in your CloudTables application), ortoken
server side generated secure access token that can be used instead of an apiKey
userId
is optional, but will be used to uniquely identify users in the CloudTables interface..userName
is also optional, but can be used to help identify who made what changes when reviewing logs in CloudTables. It is recommended you include userId
and userName
.When embedding CloudTables into your Svelte application, you can use a secure access token which is generated by a server-side program, or by embedding your access key directly into the tags.
To generate a secure access token use one of our server-side clients (HTTP REST / cURL, Java, .NET, NodeJS, PHP). Then embed your CloudTable into your Svelte application using:
<CloudTables
src="https://ip-or-hostname/io/loader/{datasetId}/table/d"
token="---"
userId="---"
userName="---"
/>
Where:
{datasetId}
- the ID of the data set you'd like to show (see the data set Embed tab for this information).Note specifically the use of the token
attribute which would be given the value of the token generated by the server.
Serverless access is faster to setup since you embed the API key directly into your CloudTables
tag (but also less secure, since you expose your API key):
<CloudTables
src="https://ip-or-hostname/io/loader/{datasetId}/table/d"
apiKey="---"
/>
Here the apiKey
attribute is used to give the API key to use.