इस सीरीज़ में, Classroom ऐड-ऑन के सभी ज़रूरी हिस्सों के बारे में बताया गया है. हर वॉकथ्रू चरण में, कुछ खास कॉन्सेप्ट के बारे में बताया गया है. साथ ही, उन्हें एक वेब ऐप्लिकेशन में लागू किया गया है. इसका मकसद, ऐड-ऑन को सेट अप करने, कॉन्फ़िगर करने, और लॉन्च करने में आपकी मदद करना है.
आपके ऐड-ऑन को Google Cloud प्रोजेक्ट के साथ इंटरैक्ट करना होगा. अगर आपको Google Cloud के बारे में कुछ भी नहीं पता है, तो हमारा सुझाव है कि आप शुरू करने से जुड़ी गाइड पढ़ें. Google Cloud Console में क्रेडेंशियल, एपीआई ऐक्सेस, और Google Workspace Marketplace SDK को मैनेज किया जाता है. Marketplace SDK के बारे में ज़्यादा जानने के लिए, Google Workspace Marketplace की लिस्टिंग के गाइड पेज पर जाएं.
इस गाइड में इन विषयों के बारे में बताया गया है:
- Google Cloud का इस्तेमाल करके, Classroom में iframe में दिखाने के लिए एक पेज बनाएं.
- Google के सिंगल साइन-ऑन (एसएसओ) को जोड़ें और उपयोगकर्ताओं को साइन इन करने की अनुमति दें.
- किसी असाइनमेंट में ऐड-ऑन अटैच करने के लिए, एपीआई कॉल करें.
- ऐड-ऑन सबमिट करने की ज़रूरी शर्तों और ज़रूरी सुविधाओं के बारे में जानकारी दें.
इस गाइड में यह माना गया है कि आपको प्रोग्रामिंग और वेब डेवलपमेंट के बुनियादी कॉन्सेप्ट के बारे में जानकारी है. हमारा सुझाव है कि इन निर्देशों को पढ़ने से पहले, प्रोजेक्ट कॉन्फ़िगरेशन गाइड पढ़ लें. इस पेज पर कॉन्फ़िगरेशन से जुड़ी ज़रूरी जानकारी दी गई है. यह जानकारी, वॉकट्रू में पूरी तरह से शामिल नहीं की गई है.
लागू करने का उदाहरण
रेफ़रंस का पूरा उदाहरण Python में उपलब्ध है. Java और Node.js में भी, कुछ हद तक लागू करने की सुविधा उपलब्ध है. ये लागू करने के तरीके, बाद के पेजों में दिए गए उदाहरण कोड के सोर्स हैं.
कहां से डाउनलोड करें
Python और Java के उदाहरण, GitHub रिपॉज़िटरी में उपलब्ध हैं:
Node.js के सैंपल को zip फ़ाइल के तौर पर डाउनलोड किया जा सकता है:
ज़रूरी शर्तें
नया ऐड-ऑन प्रोजेक्ट तैयार करने के लिए, यहां दिए गए सेक्शन देखें.
एचटीटीपीएस सर्टिफ़िकेट
अपने ऐप्लिकेशन को किसी भी डेवलपमेंट एनवायरमेंट पर होस्ट किया जा सकता है. हालांकि, Classroom ऐड-ऑन सिर्फ़ https:// के ज़रिए उपलब्ध होता है. इसलिए, आपको अपने ऐप्लिकेशन को डिप्लॉय करने या ऐड-ऑन के iframe में उसकी जांच करने के लिए, एसएसएल एन्क्रिप्शन वाले सर्वर की ज़रूरत होगी.
एसएसएल सर्टिफ़िकेट के साथ localhost का इस्तेमाल किया जा सकता है. अगर आपको लोकल डेवलपमेंट के लिए कोई सर्टिफ़िकेट बनाना है, तो mkcert का इस्तेमाल करें.
Google Cloud प्रोजेक्ट
इन उदाहरणों का इस्तेमाल करने के लिए, आपको Google Cloud प्रोजेक्ट को कॉन्फ़िगर करना होगा. शुरू करने के लिए ज़रूरी चरणों के बारे में खास जानकारी पाने के लिए, Google Cloud प्रोजेक्ट बनाने की गाइड देखें. पहले वॉकट्रू में मौजूद, Google Cloud प्रोजेक्ट सेट अप करें सेक्शन में, कॉन्फ़िगरेशन से जुड़ी खास कार्रवाइयों के बारे में भी बताया गया है.
जब यह प्रोसेस पूरी हो जाए, तब अपने OAuth 2.0 क्लाइंट आईडी को JSON फ़ाइल के तौर पर डाउनलोड करें. आपको इस क्रेडेंशियल फ़ाइल को, अनज़िप की गई उदाहरण डायरेक्ट्री में जोड़ना होगा. किसी खास जगह के लिए, फ़ाइलों के बारे में जानकारी देखें.
OAuth क्रेडेंशियल
नए OAuth क्रेडेंशियल बनाने के लिए, यह तरीका अपनाएं:
- Google Cloud क्रेडेंशियल पेज पर जाएं. पक्का करें कि आपने स्क्रीन पर सबसे ऊपर सही प्रोजेक्ट चुना हो.
- क्रेडेंशियल बनाएं पर क्लिक करें. इसके बाद, ड्रॉप-डाउन मेन्यू से OAuth क्लाइंट आईडी चुनें.
- अगले पेज पर:
- ऐप्लिकेशन टाइप को वेब ऐप्लिकेशन पर सेट करें.
- रीडायरेक्ट यूआरआई को अनुमति दें में जाकर, यूआरआई जोड़ें पर क्लिक करें. अपने ऐप्लिकेशन के लिए, कॉलबैक रूट का पूरा पाथ जोड़ें. उदाहरण के लिए,
https://my.domain.com/auth-callbackयाhttps://localhost:5000/callback. इस रूट को बनाने और मैनेज करने के बारे में, इस वॉकट्रू में बाद में बताया जाएगा. इन रास्तों में कभी भी बदलाव किया जा सकता है या ऐसे और रास्ते जोड़े जा सकते हैं. - बनाएं पर क्लिक करें.
- इसके बाद, आपको एक डायलॉग बॉक्स दिखेगा. इसमें आपके नए क्रेडेंशियल होंगे. JSON डाउनलोड करें विकल्प चुनें. डाउनलोड की गई JSON फ़ाइल को अपने सर्वर की डायरेक्ट्री में कॉपी करें.
भाषा के हिसाब से ज़रूरी शर्तें
ज़रूरी शर्तों की सबसे नई सूची देखने के लिए, हर रिपॉज़िटरी में README फ़ाइल देखें.
Python
हमारे Python के उदाहरण में, Flask फ़्रेमवर्क का इस्तेमाल किया गया है. दिए गए लिंक से, पूरा सोर्स कोड डाउनलोड किया जा सकता है.
अगर ज़रूरी हो, तो Python 3.7 या इसके बाद का वर्शन इंस्टॉल करें. साथ ही, पक्का करें कि pip उपलब्ध हो.
python3 -m ensurepip --upgradeहमारा यह भी सुझाव है कि आप एक नया Python वर्चुअल एनवायरमेंट सेट अप करें और उसे चालू करें.
python3 -m venv .classroom-addon-envsource .classroom-addon-env/bin/activate
डाउनलोड किए गए उदाहरणों में, हर वॉकट्रू सबडायरेक्ट्री में requirements.txt होता है. pip का इस्तेमाल करके, ज़रूरी लाइब्रेरी तुरंत इंस्टॉल की जा सकती हैं. पहली बार इस्तेमाल करने के लिए ज़रूरी लाइब्रेरी इंस्टॉल करने के लिए, इन कमांड का इस्तेमाल करें.
cd flask/01-basic-apppip install -r requirements.txt
Node.js
हमारे Node.js उदाहरण में, Express फ़्रेमवर्क का इस्तेमाल किया गया है. दिए गए लिंक से, पूरा सोर्स कोड डाउनलोड किया जा सकता है.
इस उदाहरण के लिए, Node.js v16.13 या इसके बाद का वर्शन ज़रूरी है.
npm का इस्तेमाल करके, ज़रूरी नोड मॉड्यूल इंस्टॉल करें.
npm installJava
हमारे Java के उदाहरण में, Spring Boot फ़्रेमवर्क का इस्तेमाल किया गया है. दिए गए लिंक से, पूरा सोर्स कोड डाउनलोड किया जा सकता है.
अगर आपके कंप्यूटर पर Java 11+ पहले से इंस्टॉल नहीं है, तो इसे इंस्टॉल करें.
Spring Boot ऐप्लिकेशन, Gradle या Maven का इस्तेमाल करके बिल्ड को हैंडल कर सकते हैं और डिपेंडेंसी मैनेज कर सकते हैं. इस उदाहरण में मेवन रैपर शामिल है. इससे यह पक्का होता है कि मेवन को इंस्टॉल किए बिना ही, बिल्ड तैयार हो गया है.
जिस डायरेक्ट्री में आपने प्रोजेक्ट को डाउनलोड या क्लोन किया है उसमें ये निर्देश चलाएं. इससे यह पक्का किया जा सकेगा कि आपके पास प्रोजेक्ट चलाने के लिए ज़रूरी शर्तें पूरी हों.
java --version./mvnw --version
इसके अलावा, Windows पर:
java -versionmvnw.cmd --version
फ़ाइलों को समझना
यहां दिए गए सेक्शन में, उदाहरण के तौर पर दी गई डायरेक्ट्री के लेआउट के बारे में बताया गया है.
डायरेक्ट्री के नाम
हर रिपॉज़िटरी में कई डायरेक्ट्री होती हैं. इनके नाम किसी संख्या से शुरू होते हैं, जैसे कि /01-basic-app/. ये नंबर, खास निर्देशों के चरणों से मेल खाते हैं.
हर डायरेक्ट्री में पूरी तरह से काम करने वाला एक वेब ऐप्लिकेशन होता है. इसमें किसी खास वॉकट्रू में बताई गई सुविधाओं को लागू किया जाता है. उदाहरण के लिए, /01-basic-app/
डायरेक्ट्री में, ऐड-ऑन बनाएं
वॉकट्रू के लिए फ़ाइनल कोड मौजूद है.
डायरेक्ट्री का कॉन्टेंट
लागू करने के लिए इस्तेमाल की गई भाषा के हिसाब से, डायरेक्ट्री का कॉन्टेंट अलग-अलग होता है:
Python
डायरेक्ट्री रूट में ये फ़ाइलें मौजूद हैं:
main.py- यह Python ऐप्लिकेशन का एंट्री पॉइंट है. इस फ़ाइल में, सर्वर का वह कॉन्फ़िगरेशन डालें जिसका आपको इस्तेमाल करना है. इसके बाद, सर्वर शुरू करने के लिए इसे चलाएं.requirements.txt- वेब ऐप्लिकेशन को चलाने के लिए ज़रूरी Python मॉड्यूल. इन्हेंpip install -r requirements.txtका इस्तेमाल करके अपने-आप इंस्टॉल किया जा सकता है.client_secret.json- Google Cloud से डाउनलोड की गई क्लाइंट सीक्रेट फ़ाइल. ध्यान दें कि यह उदाहरण संग्रह में शामिल नहीं है. आपको डाउनलोड की गई क्रेडेंशियल फ़ाइल का नाम बदलना चाहिए और उसे हर डायरेक्ट्री रूट में कॉपी करना चाहिए.
config.py- Flask सर्वर के लिए कॉन्फ़िगरेशन के विकल्प.webappडायरेक्ट्री में वेब ऐप्लिकेशन का कॉन्टेंट होता है. इसमें ये शामिल हैं:अलग-अलग पेजों के लिए Jinja टेंप्लेट वाली
/templates/डायरेक्ट्री./static/डायरेक्ट्री में इमेज, सीएसएस, और सहायक JavaScript फ़ाइलें.routes.py- वेब ऐप्लिकेशन के रास्तों के लिए हैंडलर के तरीके.__init__.py- यहwebappमॉड्यूल के लिए इनिशियलाइज़र है. यह इनिशियलाइज़र, Flask सर्वर को शुरू करता है. साथ ही,config.pyमें सेट किए गए कॉन्फ़िगरेशन विकल्पों को लोड करता है.किसी खास वॉकट्रू चरण के लिए ज़रूरी अतिरिक्त फ़ाइलें.
Node.js
वॉक्थ्रू का हर चरण, अपने <step>
सब-फ़ोल्डर में मौजूद होता है. हर चरण में यह जानकारी शामिल होती है:
- JavaScript, सीएसएस, और इमेज जैसी स्टैटिक फ़ाइलें,
./<step>/publicफ़ोल्डर में मौजूद होती हैं. - Express राउटर,
./<step>/routesफ़ोल्डर में मौजूद होते हैं. - HTML टेंप्लेट,
./<step>/viewsफ़ोल्डर में मिलते हैं. - सर्वर ऐप्लिकेशन
./<step>/app.jsहै.
Java
प्रोजेक्ट डायरेक्ट्री में ये शामिल होते हैं:
src.mainडायरेक्ट्री में सोर्स कोड और कॉन्फ़िगरेशन होता है, ताकि ऐप्लिकेशन को सही तरीके से चलाया जा सके. इस डायरेक्ट्री में ये शामिल हैं: +java.com.addons.springडायरेक्ट्री मेंApplication.javaऔरController.javaफ़ाइलें होती हैं.Application.javaफ़ाइल, ऐप्लिकेशन सर्वर को चलाने के लिए ज़िम्मेदार होती है. वहीं,Controller.javaफ़ाइल, एंडपॉइंट लॉजिक को मैनेज करती है. +resourcesडायरेक्ट्री मेंtemplatesडायरेक्ट्री होती है. इसमें एचटीएमएल और JavaScript फ़ाइलें होती हैं. इसमेंapplication.propertiesफ़ाइल भी शामिल होती है. यह फ़ाइल, सर्वर को चलाने के लिए पोर्ट, कीस्टोर फ़ाइल का पाथ, औरtemplatesडायरेक्ट्री का पाथ तय करती है. इस उदाहरण में,resourcesडायरेक्ट्री में कीस्टोर फ़ाइल शामिल है. इसे अपनी पसंद के हिसाब से किसी भी जगह सेव किया जा सकता है. हालांकि, यह पक्का करें कि आपनेapplication.propertiesफ़ाइल में पाथ को अपडेट कर दिया हो.pom.xmlमें प्रोजेक्ट बनाने और ज़रूरी डिपेंडेंसी तय करने के लिए ज़रूरी जानकारी होती है..gitignoreमें ऐसे फ़ाइल नाम शामिल हैं जिन्हें git पर अपलोड नहीं किया जाना चाहिए. पक्का करें कि आपने इस.gitignoreमें अपने कीस्टोर का पाथ जोड़ा हो. यहां दिए गए उदाहरण में, यहsecrets/*.p12है. कीस्टोर के मकसद के बारे में यहां दिए गए सेक्शन में बताया गया है. दूसरे और इसके बाद के हर वॉकथ्रू के लिए, आपको अपनीclient_secret.jsonफ़ाइल का पाथ भी शामिल करना चाहिए. इससे यह पक्का किया जा सकेगा कि आपने रिमोट रिपॉज़िटरी में अपने सीक्रेट शामिल न किए हों. तीसरे और इसके बाद के वॉकथ्रू के लिए, आपको H2 डेटाबेस फ़ाइल और फ़ाइल डेटास्टोर फ़ैक्ट्री का पाथ जोड़ना चाहिए. इन डेटा स्टोर को सेट अप करने के बारे में ज़्यादा जानकारी, बार-बार होने वाली विज़िट को मैनेज करने के बारे में तीसरे वॉकट्रू में मिल सकती है.mvnwऔरmvnw.cmd, Unix और Windows के लिए Maven रैपर एक्ज़ीक्यूटेबल हैं. उदाहरण के लिए, Unix पर./mvnw --versionचलाने पर, Apache Maven के वर्शन के साथ-साथ अन्य जानकारी भी मिलती है..mvnडायरेक्ट्री में Maven रैपर के लिए कॉन्फ़िगरेशन होता है.
सैंपल सर्वर चलाएं
सर्वर की जांच करने के लिए, आपको उसे लॉन्च करना होगा. अपनी पसंद की भाषा में उदाहरण सर्वर चलाने के लिए, इन निर्देशों का पालन करें:
Python
OAuth क्रेडेंशियल
ऊपर बताए गए तरीके से, अपने OAuth क्रेडेंशियल बनाएं और उन्हें डाउनलोड करें. JSON फ़ाइल को रूट डायरेक्ट्री में, अपने ऐप्लिकेशन के सर्वर लॉन्च फ़ाइल के साथ रखें.
सर्वर को कॉन्फ़िगर करना
वेब सर्वर को चलाने के लिए, आपके पास कई विकल्प हैं. अपनी Python फ़ाइल के आखिर में, इनमें से कोई एक कोड जोड़ें:
localhostसुरक्षित नहीं है. ध्यान दें कि इसका इस्तेमाल सिर्फ़ ब्राउज़र विंडो में सीधे तौर पर टेस्टिंग के लिए किया जा सकता है. असुरक्षित डोमेन को Classroom ऐड-ऑन iframe में लोड नहीं किया जा सकता.if __name__ == "__main__": # Disable OAuthlib's HTTPs verification. os.environ["OAUTHLIB_INSECURE_TRANSPORT"] = "1" # Run the web app at http://localhost:5000. app.run(debug=True)localhostको लॉक करें. आपकोssl_contextआर्ग्युमेंट के लिए, एसएसएल कुंजी फ़ाइलों का टपल तय करना होगा.if __name__ == "__main__": # Run the web app at https://localhost:5000. app.run(host="localhost", ssl_context=("localhost.pem", "localhost-key.pem"), debug=True)Gunicorn सर्वर. यह प्रोडक्शन-रेडी सर्वर या क्लाउड डिप्लॉयमेंट के लिए सही है. हमारा सुझाव है कि इस लॉन्च विकल्प के साथ इस्तेमाल करने के लिए,
PORTएनवायरमेंट वैरिएबल सेट करें.if __name__ == "__main__": # Run the web app at https://<your domain>:<server_port>. # Defaults to https://<your domain>:8080. server_port = os.environ.get("PORT", "8080") app.run(debug=True, port=server_port, host="0.0.0.0")
सर्वर लॉन्च करना
अपने Python ऐप्लिकेशन को चलाकर, सर्वर को लॉन्च करें. इसे पिछले चरण में कॉन्फ़िगर किया गया था.
python main.pyअपने वेब ऐप्लिकेशन को ब्राउज़र में देखने के लिए, दिखने वाले यूआरएल पर क्लिक करें. इससे यह पुष्टि की जा सकेगी कि वह सही तरीके से काम कर रहा है.
Node.js
सर्वर को कॉन्फ़िगर करना
सर्वर को एचटीटीपीएस पर चलाने के लिए, आपको एक ऐसा सर्टिफ़िकेट बनाना होगा जिसका इस्तेमाल एचटीटीपीएस पर ऐप्लिकेशन चलाने के लिए किया जाता है. इन क्रेडेंशियल को रिपॉज़िटरी के रूट फ़ोल्डर में sslcert/cert.pem और sslcert/key.pem के तौर पर सेव किया जाना चाहिए. इन कुंजियों को अपने ओएस की-चेन में जोड़ना पड़ सकता है, ताकि आपका ब्राउज़र इन्हें स्वीकार कर सके.
पक्का करें कि आपकी .gitignore फ़ाइल में *.pem मौजूद हो, क्योंकि आपको फ़ाइल को git में सेव नहीं करना है.
सर्वर लॉन्च करना
ऐप्लिकेशन को इस निर्देश के साथ चलाया जा सकता है. इसके लिए, step01
की जगह उस सही चरण को डालें जिसे आपको सर्वर के तौर पर चलाना है. उदाहरण के लिए, 01-basic-app के लिए step01
और 02-sign-in के लिए step02.
npm run step01या
npm run step02इससे https://localhost:5000 पर वेब सर्वर लॉन्च होता है.
अपने टर्मिनल में Control + C की मदद से सर्वर को बंद किया जा सकता है.
Java
सर्वर को कॉन्फ़िगर करना
सर्वर को एचटीटीपीएस पर चलाने के लिए, आपको एक ऐसा सर्टिफ़िकेट बनाना होगा जिसका इस्तेमाल एचटीटीपीएस पर ऐप्लिकेशन चलाने के लिए किया जाता है.
लोकल डेवलपमेंट के लिए, mkcert का इस्तेमाल करें. mkcert इंस्टॉल करने के बाद, यहां दी गई कमांड से लोकल तौर पर सेव किया गया सर्टिफ़िकेट जनरेट होता है. इसका इस्तेमाल HTTPS पर किया जाता है.
mkcert -installmkcert -pkcs12 -p12-file <path_to_keystore> <domain_name>
इस उदाहरण में, रिसॉर्स डायरेक्ट्री में कीस्टोर फ़ाइल शामिल है. इसे अपनी पसंद के हिसाब से किसी भी जगह पर सेव किया जा सकता है. हालांकि, यह पक्का करें कि आपने application.properties फ़ाइल में पाथ को अपडेट कर दिया हो. डोमेन का नाम वह डोमेन होता है जिस पर प्रोजेक्ट चलाया जाता है. उदाहरण के लिए, localhost.
पक्का करें कि आपकी .gitignore फ़ाइल में *.p12 मौजूद हो, क्योंकि आपको फ़ाइल को git में सेव नहीं करना है.
सर्वर लॉन्च करना
Application.java फ़ाइल में main तरीके को चलाकर सर्वर लॉन्च करें. उदाहरण के लिए, IntelliJ में src/main/java/com/addons/spring डायरेक्ट्री में जाकर, Application.java > Run 'Application' पर राइट क्लिक करें. इसके अलावा, Application.java फ़ाइल खोलकर, main(String[] args) मेथड सिग्नेचर के बाईं ओर मौजूद हरे ऐरो पर क्लिक करें. इसके अलावा, प्रोजेक्ट को टर्मिनल विंडो में भी चलाया जा सकता है:
./mvnw spring-boot:runया Windows पर:
mvnw.cmd spring-boot:runइससे सर्वर, https://localhost:5000 पर या application.properties में बताए गए पोर्ट पर लॉन्च होता है.