से एंबेडेड एनालिटिक्स का उपयोग करना अमेज़न क्विकसाइट बिना किसी जटिल विकास के आपके एप्लिकेशन को कार्यात्मक विज़ुअलाइज़ेशन से लैस करने की प्रक्रिया को सरल बना सकता है। क्विकसाइट डैशबोर्ड को एप्लिकेशन में एम्बेड करने के कई तरीके हैं। इस पोस्ट में, हम देखेंगे कि रिएक्ट और का उपयोग करके इसे कैसे किया जा सकता है अमेज़ॅन क्विकसाइट एंबेडिंग एसडीके.

डैशबोर्ड उपभोक्ताओं के पास अक्सर उनके AWS खाते के लिए कोई उपयोगकर्ता निर्दिष्ट नहीं होता है और इसलिए डैशबोर्ड तक उनकी पहुंच नहीं होती है। उन्हें डेटा उपभोग करने में सक्षम बनाने के लिए, डैशबोर्ड को अज्ञात उपयोगकर्ताओं के लिए सुलभ होना चाहिए। आइए आपके रिएक्ट एप्लिकेशन में आपके क्विकसाइट डैशबोर्ड को देखने के लिए एक अप्रमाणित उपयोगकर्ता को सक्षम करने के लिए आवश्यक चरणों पर नजर डालें।

समाधान अवलोकन

हमारा समाधान निम्नलिखित प्रमुख सेवाओं का उपयोग करता है:

ब्राउज़र पर वेब पेज लोड करने के बाद, ब्राउज़र एपीआई गेटवे पर कॉल करता है, जो एक लैम्ब्डा फ़ंक्शन को आमंत्रित करता है जो एक अज्ञात उपयोगकर्ता के लिए डैशबोर्ड यूआरएल उत्पन्न करने के लिए क्विकसाइट एपीआई को कॉल करता है। लैम्ब्डा फ़ंक्शन को आवश्यक अनुमतियों के साथ IAM भूमिका निभाने की आवश्यकता है। निम्नलिखित चित्र वास्तुकला का एक सिंहावलोकन दिखाता है।

.. पूर्वापेक्षाएँ

आपके पास निम्नलिखित पूर्वापेक्षाएँ होनी चाहिए:

अप्रमाणित दर्शकों के लिए अनुमतियाँ सेट करें

अपने खाते में, एक IAM नीति बनाएं जिसे आपका आवेदन दर्शक की ओर से स्वीकार करेगा:

1. IAM कंसोल पर, चुनें Policies नेविगेशन फलक में
2. चुनें नीति बनाएं.
3. पर JSON टैब, निम्नलिखित नीति कोड दर्ज करें:

{ "Version": "2012-10-17", "Statement": [ { "Action": [ "quicksight:GenerateEmbedUrlForAnonymousUser" ], "Resource": [ "arn:aws:quicksight:*:*:namespace/default", "arn:aws:quicksight:*:*:dashboard/<YOUR_DASHBOARD_ID1>", "arn:aws:quicksight:*:*:dashboard/<YOUR_DASHBOARD_ID2>" ], "Effect": "Allow" }, { "Action": [ "logs:CreateLogGroup", "logs:CreateLogStream", "logs:PutLogEvents" ], "Resource": "*", "Effect": "Allow" } ]
}

का मान बदलना सुनिश्चित करें डैशबोर्ड आईडी के मान पर. बाद के चरण में भी उपयोग करने के लिए इस आईडी पर ध्यान दें।

लॉग के साथ दूसरे स्टेटमेंट ऑब्जेक्ट के लिए अनुमतियाँ हैं वैकल्पिक. यह आपको निर्दिष्ट नाम के साथ एक लॉग समूह बनाने, निर्दिष्ट लॉग समूह के लिए एक लॉग स्ट्रीम बनाने और निर्दिष्ट लॉग स्ट्रीम में लॉग इवेंट के एक बैच को अपलोड करने की अनुमति देता है।

इस नीति में, हम उपयोगकर्ता को प्रदर्शन करने की अनुमति देते हैं GenerateEmbedUrlForAnonymousUser प्लेसहोल्डर में सम्मिलित डैशबोर्ड आईडी की सूची के भीतर डैशबोर्ड आईडी पर कार्रवाई।

4. अपनी पॉलिसी के लिए एक नाम दर्ज करें (उदाहरण के लिए, AnonymousEmbedPolicy) और चुनें नीति बनाएं.

इसके बाद, हम एक भूमिका बनाते हैं और इस नीति को भूमिका से जोड़ते हैं।

5. चुनें भूमिकाओं नेविगेशन फलक में, फिर चुनें भूमिका बनाएं.

6. चुनें lambda विश्वसनीय इकाई के लिए.
7. खोजें और चुनें AnonymousEmbedPolicy, उसके बाद चुनो अगला.
8. अपनी भूमिका के लिए एक नाम दर्ज करें, जैसे AnonymousEmbedRole.
9. सुनिश्चित करें कि पॉलिसी का नाम इसमें शामिल है अनुमतियाँ जोड़ें अनुभाग।
10. अपनी भूमिका बनाना समाप्त करें.

आपने अभी-अभी बनाया है AnonymousEmbedRole निष्पादन भूमिका. अब आप अगले चरण पर जा सकते हैं.

एक अनाम एम्बेड यूआरएल लैम्ब्डा फ़ंक्शन जेनरेट करें

इस चरण में, हम एक लैम्ब्डा फ़ंक्शन बनाते हैं जो एक अज्ञात उपयोगकर्ता के लिए एक एम्बेड यूआरएल उत्पन्न करने के लिए क्विकसाइट के साथ इंटरैक्ट करता है। हमारे डोमेन को अनुमति दी जानी चाहिए. Amazon QuickSight का एकीकरण प्राप्त करने के दो तरीके हैं:

1. अमेज़ॅन क्विकसाइट एडमिन कंसोल में अनुमत डोमेन की सूची में यूआरएल जोड़कर (बाद में बताया गया है)। [वैकल्पिक] अपना डोमेन QuickSight में जोड़ें अनुभाग)।
2. [सिफारिश की] एपीआई कॉल में रनटाइम के दौरान एम्बेड यूआरएल अनुरोध जोड़कर। जब आपको अनुमत डोमेन को जारी रखने की आवश्यकता होती है तो विकल्प 1 की अनुशंसा की जाती है। अन्यथा, डोमेन 30 मिनट के बाद हटा दिए जाएंगे, जो सत्र अवधि के बराबर है। अन्य उपयोग के मामलों के लिए, दूसरे विकल्प (नीचे वर्णित और कार्यान्वित) का उपयोग करने की अनुशंसा की जाती है।

लैम्ब्डा कंसोल पर, एक नया फंक्शन बनाएं।

1. चुनते हैं खरोंच से लेखक.
2. के लिए कार्य का नाम, जैसे नाम दर्ज करें AnonymousEmbedFunction.
3. के लिए क्रमचुनें अजगर 3.9.
4. के लिए निष्पादन भूमिकाचुनें किसी मौजूदा भूमिका का उपयोग करें.
5. भूमिका चुनें AnonymousEmbedRole.
6. चुनें फ़ंक्शन बनाएं.
7. फ़ंक्शन विवरण पृष्ठ पर, पर जाएँ कोड टैब करें और निम्नलिखित कोड दर्ज करें:

import json, boto3, os, re, base64 def lambda_handler(event, context):
print(event)
try:
def getQuickSightDashboardUrl(awsAccountId, dashboardIdList, dashboardRegion, event):
#Create QuickSight client
quickSight = boto3.client('quicksight', region_name=dashboardRegion); #Construct dashboardArnList from dashboardIdList
dashboardArnList=[ 'arn:aws:quicksight:'+dashboardRegion+':'+awsAccountId+':dashboard/'+dashboardId for dashboardId in dashboardIdList]
#Generate Anonymous Embed url
response = quickSight.generate_embed_url_for_anonymous_user(
AwsAccountId = awsAccountId,
Namespace = 'default',
ExperienceConfiguration = {'Dashboard':{'InitialDashboardId': dashboardIdList[0]}},
AuthorizedResourceArns = dashboardArnList,
SessionLifetimeInMinutes = 60,
AllowedDomains = ['http://localhost:3000']
)
return response #Get AWS Account Id
awsAccountId = context.invoked_function_arn.split(':')[4] #Read in the environment variables
dashboardIdList = re.sub(' ','',os.environ['DashboardIdList']).split(',')
dashboardNameList = os.environ['DashboardNameList'].split(',')
dashboardRegion = os.environ['DashboardRegion'] response={} response = getQuickSightDashboardUrl(awsAccountId, dashboardIdList, dashboardRegion, event) return {'statusCode':200, 'headers': {"Access-Control-Allow-Origin": "http://localhost:3000", "Content-Type":"text/plain"}, 'body':json.dumps(response)
} except Exception as e: #catch all
return {'statusCode':400, 'headers': {"Access-Control-Allow-Origin": "http://localhost:3000", "Content-Type":"text/plain"}, 'body':json.dumps('Error: ' + str(e))
}

यदि आप लोकलहोस्ट का उपयोग नहीं करते हैं, तो बदलें http://localhost:3000 आपके आवेदन के होस्टनाम के साथ रिटर्न में। उत्पादन की ओर बढ़ने के लिए, प्रतिस्थापित करना न भूलें http://localhost:3000 अपने डोमेन के साथ।

9. पर विन्यास टैब, के तहत सामान्य विन्यास, चुनें संपादित करें.
10. टाइमआउट को 3 सेकंड से बढ़ाकर 30 सेकंड करें, फिर चुनें सहेजें.
11. के अंतर्गत पर्यावरण चर, चुनें संपादित करें.
12. निम्नलिखित चर जोड़ें:
    1. DashboardIdList और अपनी डैशबोर्ड आईडी सूचीबद्ध करें।
    2. DashboardRegion और अपने डैशबोर्ड का क्षेत्र दर्ज करें।
13. चुनें सहेजें.

आपका कॉन्फ़िगरेशन निम्न स्क्रीनशॉट के समान दिखना चाहिए।

14. पर कोड टैब चुनें तैनाती समारोह तैनात करने के लिए।

लैम्ब्डा फ़ंक्शन को शुरू करने के लिए एपीआई गेटवे सेट करें

आपके द्वारा बनाए गए फ़ंक्शन को शुरू करने के लिए एपीआई गेटवे सेट अप करने के लिए, निम्नलिखित चरणों को पूरा करें:

1. एपीआई गेटवे कंसोल पर, नेविगेट करें बाकी एपीआई अनुभाग और चुनें बनाएँ.
2. के अंतर्गत नई एपीआई बनाएं, चुनते हैं नई एपीआई.
3. के लिए एपीआई नाम, एक नाम दर्ज करें (उदाहरण के लिए, QuicksightAnonymousEmbed).
4. चुनें एपीआई बनाएं.

5. पर क्रियाएँ मेनू, चुनें संसाधन बनाएं.
6. के लिए संसाधन का नाम, एक नाम दर्ज करें (उदाहरण के लिए, anonymous-embed).

अब, चलिए एक विधि बनाते हैं।

7. चुनना anonymous-embed संसाधन और पर क्रियाएँ मेनू, चुनें विधि बनाएं.
8. चुनें GET संसाधन नाम के अंतर्गत.
9. के लिए एकीकरण प्रकार, चुनते हैं lambda.
10. चुनते हैं लैम्ब्डा प्रॉक्सी इंटीग्रेशन का उपयोग करें.
11. के लिए लैम्ब्डा फ़ंक्शन, आपके द्वारा बनाए गए फ़ंक्शन का नाम दर्ज करें।
12. चुनें सहेजें, उसके बाद चुनो OK.

अब हम एपीआई तैनात करने के लिए तैयार हैं।

13. पर क्रियाएँ मेनू, चुनें एपीआई तैनात करें.
14. के लिए परिनियोजन अवस्था, चुनते हैं नया मंच.
15. अपने चरण के लिए एक नाम दर्ज करें, जैसे embed.
16. चुनें तैनाती.

[वैकल्पिक] अपना डोमेन QuickSight में जोड़ें

यदि आपने इसमें अनुमति प्राप्त डोमेन जोड़ा है एक अनाम एम्बेड यूआरएल लैम्ब्डा फ़ंक्शन जेनरेट करें भाग, बेझिझक आगे बढ़ें क्षमता मूल्य निर्धारण चालू करें अनुभाग।

अपने डोमेन को QuickSight में अनुमत डोमेन में जोड़ने के लिए, निम्नलिखित चरणों को पूरा करें:

1. क्विकसाइट कंसोल पर, उपयोगकर्ता मेनू चुनें, फिर चुनें QuickSight प्रबंधित करें.

2. चुनें डोमेन और एंबेडिंग नेविगेशन फलक में
3. के लिए डोमेन, अपना डोमेन दर्ज करें (http://localhost:).

प्रतिस्थापित करना सुनिश्चित करें अपने स्थानीय सेटअप से मेल खाने के लिए।

4. चुनें .

परीक्षण के बाद आप लोकलहोस्ट डोमेन को उस डोमेन से बदलना सुनिश्चित करें जिसका आप उपयोग करेंगे।

क्षमता मूल्य निर्धारण चालू करें

यदि आपके पास सत्र क्षमता मूल्य निर्धारण सक्षम नहीं है, तो इस अनुभाग में दिए गए चरणों का पालन करें। आगे बढ़ने के लिए इस फ़ंक्शन का सक्षम होना अनिवार्य है।

क्षमता मूल्य निर्धारण क्विकसाइट ग्राहकों को क्विकसाइट में व्यक्तिगत पाठकों का प्रावधान किए बिना थोक में पाठक सत्र खरीदने की अनुमति देता है। क्षमता मूल्य निर्धारण एम्बेडेड अनुप्रयोगों या बड़े पैमाने पर बिजनेस इंटेलिजेंस (बीआई) तैनाती के लिए आदर्श है। ज्यादा जानकारी के लिये पधारें अमेज़ॅन क्विकसाइट प्राइसिंग.

क्षमता मूल्य निर्धारण चालू करने के लिए, निम्नलिखित चरणों को पूरा करें:

1. पर QuickSight प्रबंधित करें पृष्ठ, चुनें आपकी सदस्यताएँ नेविगेशन फलक में
2. में क्षमता मूल्य निर्धारण अनुभाग चुनें मासिक सदस्यता प्राप्त करें.
3. चुनें सदस्यता की पुष्टि करें.

क्षमता मूल्य निर्धारण के बारे में अधिक जानने के लिए देखें अमेज़ॅन क्विकसाइट में नया - बड़े पैमाने पर तैनाती के लिए सत्र क्षमता मूल्य निर्धारण, सार्वजनिक वेबसाइटों में एम्बेडिंग और एम्बेडेड एनालिटिक्स के लिए डेवलपर पोर्टल.

अपना रिएक्ट एप्लिकेशन सेट करें

अपना रिएक्ट एप्लिकेशन सेट करने के लिए, निम्नलिखित चरणों को पूरा करें:

1. अपने रिएक्ट प्रोजेक्ट फ़ोल्डर में, अपनी रूट डायरेक्टरी पर जाएँ और चलाएँ npm i amazon-quicksight-embedding-sdk amazon-quicksight-embedding-sdk पैकेज स्थापित करने के लिए।
2. अपने में App.js फ़ाइल, निम्नलिखित को प्रतिस्थापित करें:
   1. बदलें YOUR_API_GATEWAY_INVOKE_URL/RESOURCE_NAME अपने एपीआई गेटवे के साथ यूआरएल और अपने संसाधन नाम का आह्वान करें (उदाहरण के लिए, https://xxxxxxxx.execute-api.xx-xxx-x.amazonaws.com/embed/anonymous-embed).
   2. बदलें YOUR_DASHBOARD1_ID आपके पहले डैशबोर्डआईडी के साथ DashboardIdList. यह डैशबोर्ड है जो प्रारंभिक रेंडर पर दिखाया जाएगा।
   3. बदलें YOUR_DASHBOARD2_ID आपके दूसरे डैशबोर्डआईडी के साथ DashboardIdList.

निम्नलिखित कोड स्निपेट इसका एक उदाहरण दिखाता है App.js अपने रिएक्ट प्रोजेक्ट में फ़ाइल करें। कोड एक रिएक्ट घटक है जो चयनित डैशबोर्ड आईडी के आधार पर एक क्विकसाइट डैशबोर्ड को एम्बेड करता है। कोड में निम्नलिखित प्रमुख घटक शामिल हैं:

• राज्य हुक - दो राज्य हुक का उपयोग करके परिभाषित किया गया है useState() प्रतिक्रिया से हुक:
  • डैशबोर्ड - वर्तमान में चयनित डैशबोर्ड आईडी रखता है।
  • QuickSightEmbedding - द्वारा लौटाए गए क्विकसाइट एम्बेडिंग ऑब्जेक्ट को होल्ड करता है embedDashboard() समारोह.
• रेफ हुक - एक रेफ हुक का उपयोग करके परिभाषित किया गया है useRef() प्रतिक्रिया से हुक. इसका उपयोग DOM तत्व का संदर्भ रखने के लिए किया जाता है जहां क्विकसाइट डैशबोर्ड एम्बेड किया जाएगा।
• यूज़इफ़ेक्ट() हुक - जब भी चयनित डैशबोर्ड आईडी बदलती है तो यूज़इफ़ेक्ट () हुक का उपयोग क्विकसाइट डैशबोर्ड की एम्बेडिंग को ट्रिगर करने के लिए किया जाता है। यह सबसे पहले फ़ेच() विधि का उपयोग करके क्विकसाइट एपीआई से चयनित आईडी के लिए डैशबोर्ड यूआरएल लाता है। यूआरएल को पुनः प्राप्त करने के बाद, यह एंबेड() फ़ंक्शन को यूआरएल के साथ तर्क के रूप में कॉल करता है।
• हैंडलर बदलें - changeDashboard() फ़ंक्शन एक साधारण ईवेंट हैंडलर है जो उपयोगकर्ता द्वारा ड्रॉप-डाउन मेनू से किसी भिन्न डैशबोर्ड का चयन करने पर डैशबोर्ड स्थिति को अपडेट करता है। जैसे ही नई डैशबोर्ड आईडी सेट की जाती है, यूज़इफ़ेक्ट हुक ट्रिगर हो जाता है।
• 10-मिलीसेकंड टाइमआउट - टाइमआउट का उपयोग करने का उद्देश्य एपीआई कॉल करने से पहले 10 मिलीसेकंड की एक छोटी देरी शुरू करना है। यह विलंब उन परिदृश्यों में उपयोगी हो सकता है जहां आप तत्काल एपीआई कॉल से बचना चाहते हैं या जब घटक बार-बार प्रस्तुत होता है तो अत्यधिक अनुरोधों को रोकना चाहते हैं। टाइमआउट घटक को एपीआई अनुरोध शुरू करने से पहले व्यवस्थित होने के लिए कुछ समय देता है। क्योंकि हम एप्लिकेशन को डेवलपमेंट मोड में बना रहे हैं, टाइमआउट डबल रन के कारण होने वाली त्रुटियों से बचने में मदद करता है useEffect अंदर StrictMode. अधिक जानकारी के लिए देखें स्ट्रिक्ट मोड में अपडेट.

निम्नलिखित कोड देखें:

import './App.css';
import * as React from 'react';
import { useEffect, useRef, useState } from 'react';
import { createEmbeddingContext } from 'amazon-quicksight-embedding-sdk'; function App() { const dashboardRef = useRef([]); const [dashboardId, setDashboardId] = useState('YOUR_DASHBOARD1_ID'); const [embeddedDashboard, setEmbeddedDashboard] = useState(null); const [dashboardUrl, setDashboardUrl] = useState(null); const [embeddingContext, setEmbeddingContext] = useState(null); useEffect(() => { const timeout = setTimeout(() => { fetch("YOUR_API_GATEWAY_INVOKE_URL/RESOURCE_NAME" ).then((response) => response.json() ).then((response) => { setDashboardUrl(response.EmbedUrl) }) }, 10); return () => clearTimeout(timeout); }, []); const createContext = async () => { const context = await createEmbeddingContext(); setEmbeddingContext(context); } useEffect(() => { if (dashboardUrl) { createContext() } }, [dashboardUrl]) useEffect(() => { if (embeddingContext) { embed(); } }, [embeddingContext]) const embed = async () => { const options = { url: dashboardUrl, container: dashboardRef.current, height: "500px", width: "600px", }; const newEmbeddedDashboard = await embeddingContext.embedDashboard(options); setEmbeddedDashboard(newEmbeddedDashboard); }; useEffect(() => { if (embeddedDashboard) { embeddedDashboard.navigateToDashboard(dashboardId, {}) } }, [dashboardId]) const changeDashboard = async (e) => { const dashboardId = e.target.value setDashboardId(dashboardId) } return ( <> <header> <h1>Embedded <i>QuickSight</i>: Build Powerful Dashboards in React</h1> </header> <main> <p>Welcome to the QuickSight dashboard embedding sample page</p> <p>Please pick a dashboard you want to render</p> <select id='dashboard' value={dashboardId} onChange={changeDashboard}> <option value="YOUR_DASHBOARD1_ID">YOUR_DASHBOARD1_NAME</option> <option value="YOUR_DASHBOARD2_ID">YOUR_DASHBOARD2_NAME</option> </select> <div ref={dashboardRef} /> </main> </> );
}; export default App

इसके बाद, अपनी सामग्री बदलें App.css फ़ाइल, जिसका उपयोग निम्नलिखित कोड स्निपेट की सामग्री के साथ, आपके वेब पेज को स्टाइल और लेआउट करने के लिए किया जाता है:

body { background-color: #ffffff; font-family: Arial, sans-serif; margin: 0; padding: 0;
} header { background-color: #f1f1f1; padding: 20px; text-align: center;
} h1 { margin: 0;
} main { margin: 20px; text-align: center;
} p { margin-bottom: 20px;
} a { color: #000000; text-decoration: none;
} a:hover { text-decoration: underline;
} i { color: orange; font-style: normal;
}

अब आपके ऐप का परीक्षण करने का समय आ गया है। अपना एप्लिकेशन चलाकर प्रारंभ करें npm start आपके टर्मिनल में. निम्नलिखित स्क्रीनशॉट आपके ऐप के साथ-साथ उसके द्वारा प्रदर्शित किए जा सकने वाले डैशबोर्ड के उदाहरण भी दिखाते हैं।

निष्कर्ष

इस पोस्ट में, हमने आपको दिखाया कि AWS SDK का उपयोग करके क्विकसाइट डैशबोर्ड को रिएक्ट एप्लिकेशन में कैसे एम्बेड किया जाए। अपने डैशबोर्ड को अनाम उपयोगकर्ताओं के साथ साझा करने से उन्हें आपके AWS खाते तक पहुंच प्रदान किए बिना आपके डैशबोर्ड तक पहुंचने की अनुमति मिलती है। अपने डैशबोर्ड को गुमनाम रूप से साझा करने के अन्य तरीके भी हैं, जैसे कि उपयोग करना सार्वजनिक एम्बेडिंग पर 1-क्लिक करें.

में शामिल हों त्वरित दृष्टि समुदाय दूसरों से पूछना, उत्तर देना और सीखना तथा अतिरिक्त संसाधनों का पता लगाना।

लेखक के बारे में

Adrianna AWS ग्लोबल फाइनेंशियल सर्विसेज में सॉल्यूशन आर्किटेक्ट हैं। अगस्त 2018 से अमेज़ॅन का हिस्सा होने के कारण, उन्हें कंपनी के संचालन के साथ-साथ क्लाउड व्यवसाय दोनों में शामिल होने का मौका मिला है। वर्तमान में, वह सॉफ्टवेयर संपत्तियां बनाती है जो विशिष्ट ग्राहक उपयोग के मामलों के अनुरूप एडब्ल्यूएस सेवाओं के अभिनव उपयोग को प्रदर्शित करती है। दैनिक आधार पर, वह सक्रिय रूप से प्रौद्योगिकी के विभिन्न पहलुओं से जुड़ी रहती है, लेकिन उसका असली जुनून वेब विकास और एनालिटिक्स के संयोजन में है।

• एसईओ संचालित सामग्री और पीआर वितरण। आज ही प्रवर्धित हो जाओ।
• प्लेटोडेटा.नेटवर्क वर्टिकल जेनरेटिव एआई। स्वयं को शक्तिवान बनाएं। यहां पहुंचें।
• प्लेटोआईस्ट्रीम। Web3 इंटेलिजेंस। ज्ञान प्रवर्धित। यहां पहुंचें।
• प्लेटोईएसजी. ऑटोमोटिव/ईवीएस, कार्बन, क्लीनटेक, ऊर्जा, पर्यावरण, सौर, कचरा प्रबंधन। यहां पहुंचें।
• BlockOffsets. पर्यावरणीय ऑफसेट स्वामित्व का आधुनिकीकरण। यहां पहुंचें।
• स्रोत: https://aws.amazon.com/blogs/big-data/level-up-your-react-app-with-amazon-quicksight-how-to-embed-your-dashboard-for-anonymous-access/