Starting from version 2.9, Flexmonster allows you to share its current report configuration with other users via a link. This allows sharing reports quickly without manually saving and loading .json report files.
In Flexmonster, you can also save, export, or print your report.
Let’s assume you have configured a report in Flexmonster Pivot and want to show the result to your team. It is possible with the report-sharing feature.
Its idea is the following:
To demonstrate how report sharing works, we added this feature to our main demo. Feel free to try the following:
If they follow the link, they will see our demo with your report. Note that in this case, reports will be saved to the Data Server configured on our side.
See how to add the report-sharing feature to your project.
When you share a report, the Data Server saves it and returns the report identifier. Then, Flexmonster Pivot creates a link to the report in the following way:
flexmonsterreport url parameter.For example, if you embed the component into the https://example.com/report/ page, the link to the report will be formatted as https://example.com/report/?flexmonsterreport=<report identifier> (e.g., the report identifier can be 6d5d2dc39301e1833c44ed02e6fc11a5).
The resulting link leads to the page with Flexmonster Pivot. The component requests a report associated with the identifier from the Data Server and displays the report once it is received.
Note The Data Server does not store your website or page. Only the report is stored on the server and loaded using the flexmonsterreport url parameter.
By default, Flexmonster Data Server stores the shared reports in the following locations:
C:/ProgramData/FlexmonsterDataServer/reports/.~/.local/share/FlexmonsterDataServer/reports/ (will resolve to /home/[current_user]/.local/share/FlexmonsterDataServer/reports/).You can specify another location in the Report sharing settings for the Data Server as a Windows/Unix service or in the "PathToFolder" property for the Data Server as a console application.
To share reports, you need Flexmonster Data Server version 2.9 or higher. If you do not have the Data Server, install it as a Windows/Unix service or as a console application.
If you have Flexmonster Data Server version 2.8, see how to update the Data Server.
Note The report-sharing feature is not available for the Data Server as a DLL.
After installing the Data Server, enable the endpoint to share reports. See how to enable it depending on how you use the Data Server:
Step 2.1. Open the Admin Panel.
Step 2.2. Go to the Settings tab and scroll down to the Report sharing settings block.
Step 2.3. Enable the Endpoint configuration.
Step 2.1. Open the flexmonster-config.json file for the Data Server. The file is located in the same folder as the Data Server's executable file. For more details, check out the Data Server's installation folder structure.
Step 2.2. Specify the "ReportSharingOptions" object with the "EndpointEnabled" property set to true:
{
"ReportSharingOptions": {
"EndpointEnabled": true
},
"DataSources": [{
// Index configuration
}]
}
You can also set the following configurations for the report sharing:
See how to add these configurations in the Data Server as a service and as a console application.
Flexmonster Pivot requires the Data Server’s URL to save and load the shared report.
Ways to specify the URL depend on the data source used on your page.
If you use Flexmonster Data Server as a data source, the component saves and loads reports using the URL from the dataSource.url property:
report: {
dataSource: {
type: "api",
// This URL will be used to share reports
url: "http://localhost:9500",
index: "sample-index"
}
}
If you use any other data source, you need to specify the Data Server’s URL in the shareReportConnection.url property. This URL will be used to load and save the shared reports. For example:
let pivot = new Flexmonster({
container: "pivotContainer",
componentFolder: "node_modules/flexmonster/",
report: {
dataSource: {
filename: "data.json"
}
},
shareReportConnection: {
// A URL to the Data Server
url: "http://localhost:9500"
}
});
For convenient report sharing, there is a Share Toolbar tab. By default, it is hidden. To show the Share tab, handle the beforetoolbarcreated event as follows:
let pivot = new Flexmonster({
container: "pivotContainer",
componentFolder: "node_modules/flexmonster/",
beforetoolbarcreated: toolbar => {
toolbar.showShareReportTab = true;
},
// ...
});
Now you can share your report by clicking the Share tab:
Alternatively, you can implement your custom control using the shareReport() API call:
<button onclick="flexmonster.shareReport()">Share the report</button>
<script>
let pivot = new Flexmonster({
container: "pivotContainer",
componentFolder: "node_modules/flexmonster/",
report: {
dataSource: {
filename: "data.json"
}
},
shareReportConnection: {
// A URL to the Data Server
url: "http://localhost:9500"
}
});
</script>
Once called, the shareReport method saves the report to the Data Server and opens a pop-up window with a link to the shared report. You can copy that link and share it. See where the Data Server stores the shared reports.
Now users can open the link you have shared in the browser to see your report. Note that the Data Server should be accessible to the people you share the report with.
You may be interested in the following articles: