कॉन्टेंट-टाइप अटैचमेंट

Classroom ऐड-ऑन की मदद से, सिलसिलेवार तरीके से निर्देश देने की यह चौथा कदम है सिलसिलेवार तरीके से निर्देश देने वाली सीरीज़ देखें.

सिलसिलेवार तरीके से निर्देश देने के इस तरीके में, आपने बताया है कि Google Classroom API का इस्तेमाल कहां-कहां किया जा सकता है अटैचमेंट. आप उपयोगकर्ताओं को अटैचमेंट का कॉन्टेंट देखने के लिए रूट देते हैं. कॉन्टेंट बनाने क्लास में उपयोगकर्ता की भूमिका के मुताबिक व्यू अलग-अलग होते हैं. सिलसिलेवार तरीके से दिए गए निर्देश कॉन्टेंट-टाइप अटैचमेंट का ऐक्सेस दें, जिसमें छात्र/छात्रा को असाइनमेंट सबमिट करने की ज़रूरत नहीं होती.

सिलसिलेवार तरीके से निर्देशों का पालन करते हुए, आपने ये काम किए हैं:

  • निम्न ऐड-ऑन क्वेरी पैरामीटर फिर से पाएं और उनका इस्तेमाल करें:
    • addOnToken: अटैचमेंट डिस्कवरी को भेजा जाने वाला अनुमति टोकन व्यू.
    • itemId: courseWork, courseWorkMaterial या ऐड-ऑन अटैचमेंट मिलने वाली सूचना.
    • itemType: "courseWork", "courseWorkWorkMaterials" या "एलान".
    • courseId: इसमें Google Classroom कोर्स के लिए एक यूनीक आइडेंटिफ़ायर होता है असाइनमेंट बनाया जा रहा है.
    • attachmentId: यह एक यूनीक आइडेंटिफ़ायर होता है, जिसे Google Classroom किसी ऐड-ऑन अटैचमेंट बनाने के बाद.
  • कॉन्टेंट टाइप के अटैचमेंट के लिए स्थायी स्टोरेज की सुविधा लागू करें.
  • अटैचमेंट बनाने और Teacher View देखने के लिए रूट बताने और स्टूडेंट व्यू iframe.
  • Google Classroom ऐड-ऑन एपीआई पर, ये अनुरोध करें:
    • कोई नया अटैचमेंट बनाएं.
    • ऐड-ऑन कॉन्टेक्स्ट पाएं. इससे यह पता चलता है कि जिस उपयोगकर्ता ने लॉग इन किया हुआ है वह छात्र/छात्रा या शिक्षक.

काम पूरा होने के बाद, असाइनमेंट पर कॉन्टेंट-टाइप के अटैचमेंट बनाए जा सकते हैं. इसके लिए, शिक्षक के तौर पर लॉग इन करने पर, Google Classroom का यूज़र इंटरफ़ेस (यूआई) दिखाना. इस प्रोग्राम में शामिल शिक्षक और छात्र-छात्राएं क्लास कॉन्टेंट भी देख सकती है.

Classroom API चालू करना

इस चरण की शुरुआत करते हुए, Classroom API को कॉल करें. एपीआई को यह ज़रूरी है आपको अपने Google Cloud प्रोजेक्ट के लिए कॉल करने से पहले, इस सुविधा को चालू करना होगा. नेविगेट करें को Google Classroom API लाइब्रेरी एंट्री में जोड़ें और चालू करें चुनें.

अटैचमेंट डिस्कवरी व्यू के क्वेरी पैरामीटर मैनेज करना

जैसा कि पहले बताया जा चुका है, Google Classroom क्वेरी पैरामीटर तब पास करता है, जब iframe में अटैचमेंट डिस्कवरी व्यू लोड करना:

  • courseId: Classroom के मौजूदा कोर्स का आईडी.
  • itemId: courseWork, courseWorkMaterial या ऐड-ऑन अटैचमेंट मिलने वाली सूचना.
  • itemType: या तो "courseWork", "courseWorkWorkMaterials" या "घोषणा" के बारे में बताएँ.
  • addOnToken: कुछ साइटों को अनुमति देने के लिए इस्तेमाल किया जाने वाला टोकन Classroom ऐड-ऑन कार्रवाइयां.
  • login_hint: मौजूदा उपयोगकर्ता का Google आईडी.

सिलसिलेवार तरीके से दिए गए निर्देशों का पालन करने के लिए, courseId, itemId, itemType, और addOnToken के बारे में बताया गया है. Classroom API का इस्तेमाल करते समय, कॉल जारी रखते समय, इन्हें बनाए रखें और इन्हें किसी अन्य प्लैटफ़ॉर्म पर भेजें.

सिलसिलेवार तरीके से दिए गए पिछले चरण की तरह, पास की गई क्वेरी पैरामीटर की वैल्यू को हमारा सत्र था. यह महत्वपूर्ण है कि हम ऐसा तब करें जब अटैचमेंट डिस्कवरी व्यू पहली बार शुरू किया, क्योंकि Classroom के पास सिर्फ़ ये क्वेरी पैरामीटर पास करते हैं.

Python

अटैचमेंट के लिए रूट देने वाली अपनी फ़्लास्क सर्वर फ़ाइल पर जाएं डिस्कवरी व्यू (attachment-discovery-routes.py, अगर आप हमारी उदाहरण के लिए दिया गया है). ऐड-ऑन के लैंडिंग रूट पर सबसे ऊपर (हमारे दिए गए उदाहरण में /classroom-addon), डेटा वापस पाएं और सेव करें courseId, itemId, itemType, और addOnToken क्वेरी पैरामीटर.

# Retrieve the itemId, courseId, and addOnToken query parameters.
if flask.request.args.get("itemId"):
    flask.session["itemId"] = flask.request.args.get("itemId")
if flask.request.args.get("itemType"):
    flask.session["itemType"] = flask.request.args.get("itemType")
if flask.request.args.get("courseId"):
    flask.session["courseId"] = flask.request.args.get("courseId")
if flask.request.args.get("addOnToken"):
    flask.session["addOnToken"] = flask.request.args.get("addOnToken")

सेशन में ये वैल्यू सिर्फ़ तब लिखें, जब वे मौजूद हों; वे नहीं हैं अगर उपयोगकर्ता अटैचमेंट डिस्कवरी व्यू पर वापस जाता है, तो उसे फिर से पास किया जाता है बाद में, बिना iframe बंद किए.

कॉन्टेंट टाइप के अटैचमेंट के लिए स्थायी स्टोरेज जोड़ना

आपको बनाए गए किसी भी अटैचमेंट के स्थानीय रिकॉर्ड की ज़रूरत होगी. इससे आपको यह खोजना आसान हो जाता है ऐसा कॉन्टेंट जिसे शिक्षक ने उपलब्ध कराए गए आइडेंटिफ़ायर की मदद से चुना है क्लासरूम.

Attachment के लिए डेटाबेस स्कीमा सेट अप करें. हमारे यहां दिए गए उदाहरण हैं इमेज और कैप्शन दिखाने वाले अटैचमेंट. Attachment में ये एट्रिब्यूट दिखते हैं:

  • attachment_id: अटैचमेंट के लिए एक यूनीक आइडेंटिफ़ायर. इसने असाइन किया Classroom का इस्तेमाल करते समय, इसके जवाब में क्लास वापस मिली अटैचमेंट.
  • image_filename: दिखाई जाने वाली इमेज का फ़ाइल नाम.
  • image_caption: इमेज के साथ दिखाने के लिए कैप्शन.

Python

पिछले चरणों से, SQLite और flask_sqlalchemy लागू करने की प्रक्रिया को बढ़ाएं.

उस फ़ाइल पर जाएं जिसमें आपने उपयोगकर्ता टेबल (models.py) तय की है डालें). इन्हें नीचे जोड़ें User क्लास के नीचे की फ़ाइल की.

class Attachment(db.Model):
    # The attachmentId is the unique identifier for the attachment.
    attachment_id = db.Column(db.String(120), primary_key=True)

    # The image filename to store.
    image_filename = db.Column(db.String(120))

    # The image caption to store.
    image_caption = db.Column(db.String(120))

अपने अटैचमेंट वाली नई अटैचमेंट क्लास को सर्वर फ़ाइल में इंपोर्ट करें हैंडलिंग रूट.

नए रास्ते सेट अप करें

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

अटैचमेंट बनाने के रूट जोड़ें

कॉन्टेंट चुनने और अटैचमेंट बनाने की समस्या हल करने में शिक्षक की मदद करने के लिए, आपको पेज की ज़रूरत होगी अनुरोध. कॉन्टेंट के विकल्प दिखाने के लिए, /attachment-options रूट लागू करें इसके बाद, शिक्षक उन्हें चुन सकता है. कॉन्टेंट चुनने के लिए भी आपको टेंप्लेट की ज़रूरत होगी और बनाने की पुष्टि करने वाले पेज. हमारे दिए गए उदाहरणों में इनके लिए टेंप्लेट हैं, और आपके विज्ञापनों के अनुरोध और जवाब भी दिखाए जा सकते हैं. Classroom एपीआई.

ध्यान दें कि आपके पास अपने मौजूदा अटैचमेंट डिस्कवरी व्यू में भी बदलाव करने का विकल्प होता है नया विज्ञापन बनाने के बजाय सामग्री विकल्प दिखाने के लिए लैंडिंग पेज /attachment-options पेज. हम आपको एक नया पेज बनाने का सुझाव देते हैं. ताकि आप सेकंड में लागू किए गए एसएसओ (SSO) व्यवहार को सिलसिलेवार तरीके से दिए गए निर्देश, जैसे कि ऐप्लिकेशन अनुमतियां वापस लेना. इनसे यह साबित होना चाहिए आपके लिए, ऐड-ऑन बनाना और उनकी जांच करना आसान हो जाता है.

शिक्षक हमारी दी गई सूची में से कैप्शन वाली इमेज के छोटे सेट में से कोई इमेज चुन सकते हैं उदाहरण के लिए. हमने प्रसिद्ध लैंडमार्क की चार तस्वीरें उपलब्ध कराई हैं, जिनके कैप्शन हैं भी मिलती है.

Python

हमारे दिए गए उदाहरण में, यह webapp/attachment_routes.py फ़ाइल में है.

@app.route("/attachment-options", methods=["GET", "POST"])
def attachment_options():
    """
    Render the attachment options page from the "attachment-options.html"
    template.

    This page displays a grid of images that the user can select using
    checkboxes.
    """

    # A list of the filenames in the static/images directory.
    image_filenames = os.listdir(os.path.join(app.static_folder, "images"))

    # The image_list_form_builder method creates a form that displays a grid
    # of images, checkboxes, and captions with a Submit button. All images
    # passed in image_filenames will be shown, and the captions will be the
    # title-cased filenames.

    # The form must be built dynamically due to limitations in WTForms. The
    # image_list_form_builder method therefore also returns a list of
    # attribute names in the form, which will be used by the HTML template
    # to properly render the form.
    form, var_names = image_list_form_builder(image_filenames)

    # If the form was submitted, validate the input and create the attachments.
    if form.validate_on_submit():

        # Build a dictionary that maps image filenames to captions.
        # There will be one dictionary entry per selected item in the form.
        filename_caption_pairs = construct_filename_caption_dictionary_list(
            form)

        # Check that the user selected at least one image, then proceed to
        # make requests to the Classroom API.
        if len(filename_caption_pairs) > 0:
            return create_attachments(filename_caption_pairs)
        else:
            return flask.render_template(
                "create-attachment.html",
                message="You didn't select any images.",
                form=form,
                var_names=var_names)

    return flask.render_template(
        "attachment-options.html",
        message=("You've reached the attachment options page. "
                "Select one or more images and click 'Create Attachment'."),
        form=form,
        var_names=var_names,
    )

इससे "अटैचमेंट बनाएं" बनता है ऐसा पेज जो इससे मिलता-जुलता हो:

Python कॉन्टेंट चुनने का उदाहरण

शिक्षक एक से ज़्यादा इमेज चुन सकता है. हर इमेज के लिए एक अटैचमेंट बनाएं जिसे शिक्षक ने create_attachments तरीके में चुना है.

समस्या वाले अटैचमेंट बनाने के अनुरोध

अब आपको पता है कि शिक्षक कॉन्टेंट के किस हिस्से को अटैच करना चाहता है, हमारी साइट पर अटैचमेंट बनाने के लिए, Classroom API को समस्या का अनुरोध करने की सुविधा असाइनमेंट शामिल करें. अटैचमेंट के विवरण को अपने डेटाबेस में संग्रहित करें Classroom एपीआई से मिले रिस्पॉन्स.

Classroom सेवा का इंस्टेंस पाने से शुरुआत करें:

Python

हमारे दिए गए उदाहरण में, यह webapp/attachment_routes.py फ़ाइल में है.

def create_attachments(filename_caption_pairs):
    """
    Create attachments and show an acknowledgement page.

    Args:
        filename_caption_pairs: A dictionary that maps image filenames to
            captions.
    """
    # Get the Google Classroom service.
    classroom_service = googleapiclient.discovery.build(
        serviceName="classroom",
        version="v1",
        credentials=credentials)

courses.courseWork.addOnAttachments को CREATE अनुरोध जारी करें एंडपॉइंट का इस्तेमाल करें. शिक्षक की चुनी गई हर इमेज के लिए, पहले एक इमेज बनाएं. AddOnAttachment ऑब्जेक्ट:

Python

हमारे दिए गए उदाहरण में, यह create_attachments का ही एक अगला हिस्सा है तरीका.

# Create a new attachment for each image that was selected.
attachment_count = 0
for key, value in filename_caption_pairs.items():
    attachment_count += 1

    # Create a dictionary with values for the AddOnAttachment object fields.
    attachment = {
        # Specifies the route for a teacher user.
        "teacherViewUri": {
            "uri":
                flask.url_for(
                    "load_content_attachment", _scheme='https', _external=True),
        },
        # Specifies the route for a student user.
        "studentViewUri": {
            "uri":
                flask.url_for(
                    "load_content_attachment", _scheme='https', _external=True)
        },
        # The title of the attachment.
        "title": f"Attachment {attachment_count}",
    }

कम से कम teacherViewUri, studentViewUri, और title फ़ील्ड होने चाहिए जो अटैचमेंट के लिए दी गई है. teacherViewUri और studentViewUri उन यूआरएल को दिखाते हैं जो अटैचमेंट को खोलने पर लोड होते हैं उपयोगकर्ता टाइप के हिसाब से.

अनुरोध के मुख्य भाग में AddOnAttachment ऑब्जेक्ट को सही जगह पर भेजें addOnAttachments एंडपॉइंट. courseId, itemId, itemType और हर अनुरोध के लिए addOnToken आइडेंटिफ़ायर.

Python

हमारे दिए गए उदाहरण में, यह create_attachments का ही एक अगला हिस्सा है तरीका.

# Use the itemType to determine which stream item type the teacher created
match flask.session["itemType"]:
    case "announcements":
        parent = classroom_service.courses().announcements()
    case "courseWorkMaterials":
        parent = classroom_service.courses().courseWorkMaterials()
    case _:
        parent = classroom_service.courses().courseWork()

# Issue a request to create the attachment.
resp = parent.addOnAttachments().create(
    courseId=flask.session["courseId"],
    itemId=flask.session["itemId"],
    addOnToken=flask.session["addOnToken"],
    body=attachment).execute()

अपने स्थानीय डेटाबेस में इस अटैचमेंट की एंट्री बनाएं, ताकि आप बाद में ऐसा कर सकें सही कॉन्टेंट लोड करना. Classroom से, id की यूनीक वैल्यू मिलती है बनाने के अनुरोध के उत्तर में, इसे हमारी डेटाबेस. ध्यान दें कि Classroom ने attachmentId को भी पास कर लिया है शिक्षक और छात्र-छात्राएं व्यू खोलते समय, क्वेरी पैरामीटर:

Python

हमारे दिए गए उदाहरण में, यह create_attachments का ही एक अगला हिस्सा है तरीका.

# Store the value by id.
new_attachment = Attachment(
    # The new attachment's unique ID, returned in the CREATE response.
    attachment_id=resp.get("id"),
    image_filename=key,
    image_caption=value)
db.session.add(new_attachment)
db.session.commit()

ऐसा करने के लिए, फ़िलहाल उपयोगकर्ता को पुष्टि करने वाले पेज पर ले जाएं उन्होंने अटैचमेंट बना लिया है.

ऐड-ऑन में मौजूद अटैचमेंट को अनुमति दें

अब अनुमति वाले अटैचमेंट में कोई भी सही पता जोड़ने का सही समय है Google Workspace Marketplace SDK टूल के ऐप्लिकेशन कॉन्फ़िगरेशन में, यूआरआई प्रीफ़िक्स फ़ील्ड करें. आपका ऐड-ऑन सिर्फ़ एक यूआरआई प्रीफ़िक्स से अटैचमेंट बना सकता है इस पेज पर दी गई सूची है. यह सुरक्षा से जुड़ा उपाय है, जिससे संभावना को कम करने में मदद मिलती है मैन इन द मिडल हमलों के ख़िलाफ़ है.

सबसे आसान तरीका यह है कि इस फ़ील्ड में अपना टॉप लेवल डोमेन दिया जाए. उदाहरण https://example.com. https://localhost:<your port number>/ यह कर पाते काम करता है, तो आप अपनी स्थानीय मशीन का उपयोग वेब सर्वर के रूप में कर रहे हैं.

शिक्षक और छात्र/छात्रा व्यू के लिए रूट जोड़ें

चार iframe में, Google Classroom ऐड-ऑन लोड हो सकता है. आपने सिर्फ़ ऐसे रूट बनाए हैं जो अटैचमेंट डिस्कवरी व्यू iframe को इस तरह से दिखाते हैं दूर. इसके बाद, शिक्षक और छात्र दृश्य iframe को भी प्रस्तुत करने के लिए रूट जोड़ें.

छात्र/छात्रा की झलक दिखाने के लिए, टीचर व्यू iframe ज़रूरी है अनुभव कर सकते हैं, लेकिन उनमें अतिरिक्त जानकारी या संपादन वैकल्पिक रूप से शामिल हो सकते हैं सुविधाएँ.

छात्र-छात्राओं का व्यू वह पेज होता है जो हर छात्र-छात्रा को खोलने पर दिखता है ऐड-ऑन अटैचमेंट.

इस एक्सरसाइज़ के लिए, एक /load-content-attachment बनाएं ऐसा रूट जो टीचर और स्टूडेंट, दोनों को दिखता है. Classroom API का इस्तेमाल करें यह तय करने के तरीके कि उपयोगकर्ता, शिक्षक है या छात्र लोड करता है.

Python

हमारे दिए गए उदाहरण में, यह webapp/attachment_routes.py फ़ाइल में है.

@app.route("/load-content-attachment")
def load_content_attachment():
    """
    Load the attachment for the user's role."""

    # Since this is a landing page for the Teacher and Student View iframes, we
    # need to preserve the incoming query parameters.
    if flask.request.args.get("itemId"):
        flask.session["itemId"] = flask.request.args.get("itemId")
    if flask.request.args.get("itemType"):
        flask.session["itemType"] = flask.request.args.get("itemType")
    if flask.request.args.get("courseId"):
        flask.session["courseId"] = flask.request.args.get("courseId")
    if flask.request.args.get("attachmentId"):
        flask.session["attachmentId"] = flask.request.args.get("attachmentId")

ध्यान रखें कि ऐसा करते समय, आपको उपयोगकर्ता की पुष्टि भी करनी चाहिए. आपने लोगों तक पहुंचाया मुफ़्त में को यहां login_hint क्वेरी पैरामीटर को भी हैंडल करना चाहिए. साथ ही, उपयोगकर्ता को पुष्टि करें. लॉग इन करने के दिशा-निर्देशों की जानकारी देखें, जिस पर चर्चा की गई इन चरणों को पूरा करके देखें.

इसके बाद, आइटम से मेल खाने वाले getAddOnContext एंडपॉइंट पर अनुरोध भेजें टाइप करें.

Python

यहां दिए गए उदाहरण में, load_content_attachment तरीका.

# Create an instance of the Classroom service.
classroom_service = googleapiclient.discovery.build(
    serviceName="classroom"
    version="v1",
    credentials=credentials)

# Use the itemType to determine which stream item type the teacher created
match flask.session["itemType"]:
    case "announcements":
        parent = classroom_service.courses().announcements()
    case "courseWorkMaterials":
        parent = classroom_service.courses().courseWorkMaterials()
    case _:
        parent = classroom_service.courses().courseWork()

addon_context_response = parent.getAddOnContext(
    courseId=flask.session["courseId"],
    itemId=flask.session["itemId"]).execute()

यह तरीका, क्लास में मौजूदा उपयोगकर्ता की भूमिका के बारे में जानकारी देता है. उपयोगकर्ता को उसकी भूमिका के आधार पर, दिखाई जाने वाले व्यू में बदलाव करना. इनमें से कोई एक रिस्पॉन्स में, studentContext या teacherContext फ़ील्ड में जानकारी अपने-आप भर जाती है ऑब्जेक्ट होना चाहिए. इनकी जांच करके पता लगाएं कि लोगों को क्या करना चाहिए.

किसी भी मामले में, attachmentId क्वेरी पैरामीटर वैल्यू का इस्तेमाल करके जानें कि किस हमारे डेटाबेस से फिर से पाने के लिए अटैचमेंट. यह क्वेरी पैरामीटर तब दिया जाता है, जब शिक्षक या छात्र/छात्रा व्यू का यूआरआई खोल सकता है.

Python

यहां दिए गए उदाहरण में, load_content_attachment तरीका.

# Determine which view we are in by testing the returned context type.
user_context = "student" if addon_context_response.get(
    "studentContext") else "teacher"

# Look up the attachment in the database.
attachment = Attachment.query.get(flask.session["attachmentId"])

# Set the text for the next page depending on the user's role.
message_str = f"I see that you're a {user_context}! "
message_str += (
    f"I've loaded the attachment with ID {attachment.attachment_id}. "
    if user_context == "teacher" else
    "Please enjoy this image of a famous landmark!")

# Show the content with the customized message text.
return flask.render_template(
    "show-content-attachment.html",
    message=message_str,
    image_filename=attachment.image_filename,
    image_caption=attachment.image_caption,
    responses=response_strings)

ऐड-ऑन का परीक्षण करें

अटैचमेंट बनाने की जांच करने के लिए, यह तरीका अपनाएं:

  • [Google Classroom] में अपने एक से ज़्यादा ऐप्लिकेशन के तौर पर साइन इन करें शिक्षक टेस्ट के उपयोगकर्ता.
  • क्लासवर्क टैब पर जाएं और नया असाइनमेंट बनाएं.
  • टेक्स्ट एरिया के नीचे मौजूद, ऐड-ऑन बटन पर क्लिक करें. इसके बाद, अपना ऐड-ऑन चुनें. iframe खुल जाता है और ऐड-ऑन आपके अटैचमेंट सेटअप यूआरआई को लोड कर देता है जिसकी जानकारी Google Workspace Marketplace SDK टूल के ऐप्लिकेशन कॉन्फ़िगरेशन पेज में दी गई है.
  • असाइनमेंट में अटैच करने के लिए कॉन्टेंट का एक हिस्सा चुनें.
  • अटैचमेंट बनाने की प्रोसेस पूरी होने के बाद, iframe बंद कर दें.

Google खाते में, असाइनमेंट बनाने के यूज़र इंटरफ़ेस (यूआई) में आपको एक अटैचमेंट कार्ड दिखेगा Google Classroom. Teacher View iframe खोलने और पुष्टि करने के लिए कार्ड पर क्लिक करें कि सही अटैचमेंट दिखे. असाइन करें बटन पर क्लिक करें.

छात्र-छात्राओं को मिलने वाले अनुभव की जांच करने के लिए, यह तरीका अपनाएं:

  • इसके बाद, उसी छात्र/छात्रा के टेस्ट यूज़र के तौर पर Classroom में साइन इन करें क्लास का इस्तेमाल शिक्षक या टेस्ट यूज़र के तौर पर करता है.
  • 'क्लासवर्क' टैब में टेस्ट असाइनमेंट ढूंढें.
  • असाइनमेंट को बड़ा करें और छात्र-छात्राओं को दिखने वाला व्यू खोलने के लिए, अटैचमेंट कार्ड पर क्लिक करें iframe.

पुष्टि करें कि छात्र/छात्रा को सही अटैचमेंट दिख रहा है.

बधाई हो! आप अगले चरण पर जाने के लिए तैयार हैं: बनाना गतिविधि-टाइप अटैचमेंट.