The SAS Portal Framework for SAS® Viya® enables you to build your portal to share reports, texts, link list, jobs and more in a structured way. This project builds on top of the SAS® Viya® SDKs and the SAS® Viya® APIs.
Find a video walking you through the setup and the general UI here.
This is what the example portal that is included in this repository looks like:
For a better documentation expierence check out the SAS Portal Framework for SAS Viya documentation page.
Ensure that you have followed the setup guides of the SAS Visual Analytics SDK and the SAS Content SDK before proceeding.
If you want to use this SAS Portal as a hybrid solution with SAS 9.4 content, you must remove the option Header set X-Frame-Options SAMEORIGIN from the SAS Webserver configuration. See the SAS documentation.
Changes to the SAS Portal are documented in the CHANGELOG.md.
You will also need a webserver, where you will place the files of this portal.
If you run the webserver under the same top level URL as the SAS Viya host, you will not have to change config.js.
If you don't, please see information in the Sample Content & config.js section.
The default setup provided in this project is done by pulling the dependencies via CDNs. To see what is used see the links below, if you prefer to use your own hosted versions please take a look at the local setup section.
<!-- Bootstrap Style -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
<!-- Import SAS SDKs and Third-Party Utilities -->
<script src="https://cdn.developer.sas.com/packages/sas-auth-browser/latest/dist/index.min.js"></script>
<script src="https://cdn.developer.sas.com/packages/content-components/latest/dist/umd/content-sdk-components.js"></script>
<script src="https://cdn.developer.sas.com/packages/va-report-components/latest/dist/umd/va-report-components.js"></script>
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm" crossorigin="anonymous"></script>
<script type="module" src="https://cdn.jsdelivr.net/gh/zerodevx/zero-md@2/dist/zero-md.min.js"></script>And if you are making use of the Portal Builder object then you will also need to update /static/portalBuilder.html:
<!-- Bootstrap Style -->
<link href="https://cdn.jsdelivr.net/npm/[email protected]/dist/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-4bw+/aepP/YC94hEpVNVgiZdgIC5+VKNBQNGCHeKRQN+PtmoHDEXuppvnDJzQIu9" crossorigin="anonymous">
<!-- Bootstrap SDK -->
<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/js/bootstrap.bundle.min.js" integrity="sha384-HwwvtgBNo3bZJJLYd8oVXjrBZt8cqVSpeBNS5n7C8IVInixGAoxmnlMuBnhbgrkm" crossorigin="anonymous"></script>This setup guide will showcase how to use only local resource and not pull any dependencies dynamically from the web. To download the different SDKs & Third-Party libraries npm will be used. For setup help for npm please refer to this guide.
Download the SAS Auth Browser using npm:
npm install @sassoftware/sas-auth-browser
cp -r ./node_modules/@sassoftware/sas-auth-browser ./sdk-assets/authDownload the SAS Content SDK using npm:
npm install @sassoftware/content-components
cp -r ./node_modules/@sassoftware/content-components ./sdk-assets/contentDownload the SAS Visual Analytics SDK using npm:
npm install @sassoftware/va-report-components
cp -r ./node_modules/@sassoftware/va-report-components ./sdk-assets/va-report-componentsDownload Bootstrap using npm:
npm install [email protected]
cp -r ./node_modules/bootstrap/dist/css ./sdk-assets/bootstrap/css
cp -r ./node_modules/bootstrap/dist/js ./sdk-assets/bootstrap/js
cp -r ./node_modules/bootstrap/scss ./sdk-assets/bootstrap/scssDownload the Markdown Renderer using npm - used for Text Objects:
npm install zero-md@2
cp -r ./node_modules/zero-md/dist ./sdk-assets/zero-mdIf you have followed all of the download and copying steps detailed above, change the following in the index.html page under the comment Import SAS SDKs and Third-Party Utilities:
<script src="./sdk-assets/auth/dist/index.js"></script>
<script src="./sdk-assets/content/dist/umd/content-sdk-components.js"></script>
<script src="./sdk-assets/va-report-components/dist/umd/va-report-components.js"></script>
<script src="./sdk-assets/bootstrap/js/bootstrap.bundle.min.js"></script>
<script type="module" src="./sdk-assets/zero-md/zero-md.min.js"></script>And in the head element under the comment Bootstrap Style replace the link element with the following:
<link href="./sdk-assets/bootstrap/css/bootstrap.min.css" rel="stylesheet">And in static/portalBuilder.html, also replace the link element in the head element as above.
Under Bootstrap SDK, replace the script element with:
<script src="./sdk-assets/bootstrap/js/bootstrap.bundle.min.js"></script>If you want to use the sample content, then import the Portal-Content-EM.json and Content-EM.json using SAS Environment Manager or the viya-admin CLI.
The examples include also static links to SAS Jobs.
This applies to Use Case 1/interactiveContent-example.json where you will need to replace the URL with your Viya host.
If you replace the file, you will need to update the portal-page-layout.json accordingly with the new file URI.
The VA Test page also requires an additional setup: run the Load-HMEQ.sas file in Content/VA Reports, which will load the hmeq table from sampsio to public.
Go to config.js, search for VIYA and replace the value window.location.origin with your SAS Viya host if your webserver is not located under the same URL as the Viya host.
If you imported the sample content you can skip this step, if you created your own portal folder you have to search for PORTAL and replace the value 68384628-8305-4285-9f16-0cdc57d13dc5 if the URI of your portal folder (go to the folder in SAS Environment Manager, select it and copy just the URI ID— everything after /folders/folders/).
The baseline interface comes with native multi language support. The displayed language is determined by the users browsers language. Then a file from the languages folder is loaded. The portal comes with English and German support, if you want to add an additional language just copy the language/en.json file, rename it to the desired lowercase ISO-639-1 language code and the translate the values of the attributes.
Maintainers are accepting patches and contributions to this project. Please read CONTRIBUTING.md for details about submitting contributions to this project.
Except for the the contents of the /static folder, this project is licensed under the Apache 2.0 License.
Elements in the /static folder are owned by SAS and are not released under an open source license.
This project uses the Bootstrap library, which is under the MIT license. It also uses the Zero-MD library, which is under the ICS license.
SAS and all other SAS Institute Inc. product or service names are registered trademarks or trademarks of SAS Institute Inc. in the USA and other countries.
® indicates USA registration.