Aktivitätstyp-Anhänge

Dies ist die fünfte Schritt-für-Schritt-Anleitung in der Reihe zu Classroom-Add-ons.

In dieser Anleitung ändern Sie das Beispiel aus dem vorherigen Schritt der Anleitung, um einen Anhang vom Typ „Aktivität“ zu erstellen. Dies sind alle Anhänge, für die eine Einreichung durch Schüler oder Studenten erforderlich ist, z. B. eine schriftliche Antwort, ein Quiz oder ein anderes von Schülern oder Studenten erstelltes Artefakt.

Es ist wichtig, zwischen Anhängen vom Inhalts- und vom Aktivitätstyp zu unterscheiden. Anhänge vom Aktivitätstyp unterscheiden sich in folgenden Punkten von Anhängen vom Inhaltstyp:

  • Im IFrame der Schüler-/Studentenansicht wird rechts oben die Schaltfläche „Abgeben“ angezeigt.
  • Sie dienen als eindeutige Kennung für die Arbeit der Schüler/Studenten.
  • Die Karte mit den Anhängen wird in der Benutzeroberfläche des Classroom-Benotungstools angezeigt.
  • Sie können eine Note für die Aufgabe festlegen, zu der sie gehören.

In der nächsten Anleitung erfahren Sie mehr über die Benotung. In dieser Anleitung führen Sie die folgenden Schritte aus:

  • Ändern Sie die vorherigen Anhängeerstellungsanfragen an die Classroom API, um einen Anhang vom Typ „Aktivität“ zu erstellen.
  • Implementieren Sie einen nichtflüchtigen Speicher für die Einreichungen der Schüler/Studenten.
  • Ändern Sie den vorherigen Pfad für die Ansicht für Schüler/Studenten, damit Schüler/Studenten Eingaben machen können.
  • Geben Sie einen Pfad an, über den der Iframe für die Rückgabe von Schüler-/Studentenarbeiten bereitgestellt werden soll.

Wenn Sie fertig sind, können Sie als Lehrkraft über die Google Classroom-Benutzeroberfläche Aktivitätsanhänge zu Aufgaben erstellen. Schüler und Studenten im Kurs können die Aktivität auch im IFrame ausführen und eine Antwort einreichen. Die Lehrkraft kann sich die Aufgabe des Schülers/Studenten in der Classroom-Benotungsoberfläche ansehen.

Verwenden Sie für dieses Beispiel die Anhangsvorlage aus der vorherigen Anleitung, die ein Bild eines berühmten Wahrzeichens und eine Bildunterschrift mit dem Namen des Wahrzeichens enthält. Bei der Aktivität werden die Schüler aufgefordert, den Namen des Wahrzeichens anzugeben.

Anfrage zum Erstellen von Anhängen ändern

Rufen Sie den Abschnitt Ihres Codes auf, in dem Sie in der vorherigen Schritt-für-Schritt-Anleitung einen Anhang mit Inhaltstyp erstellt haben. Das wichtigste Element hier ist eine Instanz eines AddOnAttachment-Objekts, in dem wir zuvor teacherViewUri, studentViewUri und title für den Anhang angegeben haben.

Für alle Add-on-Anhänge sind diese drei Felder erforderlich. Ob es sich um einen Aktivitäts- oder Inhaltstyp handelt, wird jedoch durch das Vorhandensein oder Fehlen eines studentWorkReviewUri bestimmt. Eine CREATE-Anfrage mit einem ausgefüllten studentWorkReviewUri wird zu einem Anhang vom Typ „Aktivität“, während eine CREATE-Anfrage ohne studentWorkReviewUri zu einem Anhang vom Typ „Inhalt“ wird.

Die einzige Änderung, die an dieser Anfrage vorgenommen werden muss, besteht darin, das Feld studentWorkReviewUri auszufüllen. Fügen Sie hier eine Route mit einem geeigneten Namen hinzu. Sie wird in einem späteren Schritt implementiert.

Python

In unserem Beispiel befindet sich diese in der Methode create_attachments in der Datei webapp/attachment_routes.py.

attachment = {
    # Specifies the route for a teacher user.
    "teacherViewUri": {
        "uri":
            flask.url_for(
                "load_activity_attachment",
                _scheme='https',
                _external=True),
    },
    # Specifies the route for a student user.
    "studentViewUri": {
        "uri":
            flask.url_for(
                "load_activity_attachment",
                _scheme='https',
                _external=True)
    },
    # Specifies the route for a teacher user when the attachment is
    # loaded in the Classroom grading view.
    # The presence of this field marks this as an activity-type attachment.
    "studentWorkReviewUri": {
        "uri":
            flask.url_for(
                "view_submission", _scheme='https', _external=True)
    },
    # The title of the attachment.
    "title": f"Attachment {attachment_count}",
}

Nichtflüchtigen Speicher für Anhänge mit Inhaltstyp hinzufügen

Notieren Sie sich die Antwort des Schülers oder Studenten auf unsere Aktivität. Sie können es später nachsehen, wenn die Lehrkraft die Aufgabe im IFrame für die Überprüfung der Schüler-/Studentenarbeit aufruft.

Richten Sie ein Datenbankschema für eine Submission ein. In unserem Beispiel sollen die Schüler den Namen der Sehenswürdigkeit eingeben, die auf einem Bild zu sehen ist. Ein Submission enthält daher die folgenden Attribute:

  • attachment_id: Eine eindeutige Kennung für einen Anhang. Wird von Classroom zugewiesen und in der Antwort zurückgegeben, wenn ein Anhang erstellt wird.
  • submission_id: Eine Kennung für die Einreichung eines Schülers oder Studenten. Von Classroom zugewiesen und in der Schüler-/Studentenansicht in der getAddOnContext-Antwort zurückgegeben.
  • student_response: Die Antwort des Schülers/Studenten.

Python

Erweitern Sie die SQLite- und flask_sqlalchemy-Implementierung aus den vorherigen Schritten.

Rufen Sie die Datei auf, in der Sie die vorherigen Tabellen definiert haben (models.py, wenn Sie unserem Beispiel folgen). Fügen Sie am Ende der Datei Folgendes hinzu:

# Database model to represent a student submission.
class Submission(db.Model):
    # The attachmentId is the unique identifier for the attachment.
    submission_id = db.Column(db.String(120), primary_key=True)

    # The unique identifier for the student's submission.
    attachment_id = db.Column(db.String(120), primary_key=True)

    # The student's response to the question prompt.
    student_response = db.Column(db.String(120))

Importieren Sie die neue Submission-Klasse in die Serverdatei mit Ihren Routen für die Verarbeitung von Anhängen.

Route für die Ansicht für Schüler/Studenten ändern

Ändern Sie als Nächstes die vorherige Route für die Ansicht für Schüler/Studenten so, dass ein kleines Formular angezeigt und Eingaben von Schülern/Studenten akzeptiert werden. Sie können den Großteil des Codes aus der vorherigen Schritt-für-Schritt-Anleitung wiederverwenden.

Suchen Sie den Servercode, der die Route für die Ansicht für Schüler/Studenten angibt. Dies ist die Route, die beim Erstellen eines Anhangs im Feld studentViewUri angegeben wurde. Als Erstes müssen Sie die submissionId aus der getAddOnContext-Antwort extrahieren.

Python

In unserem Beispiel befindet sich diese in der Methode load_activity_attachment in der Datei webapp/attachment_routes.py.

# Issue a request to the courseWork.getAddOnContext endpoint
addon_context_response = classroom_service.courses().courseWork(
).getAddOnContext(
    courseId=flask.session["courseId"],
    itemId=flask.session["itemId"]).execute()

# One of studentContext or teacherContext will be populated.
user_context = "student" if addon_context_response.get(
    "studentContext") else "teacher"

# If the user is a student...
if user_context == "student":
    # Extract the submissionId from the studentContext object.
    # This value is provided by Google Classroom.
    flask.session["submissionId"] = addon_context_response.get(
            "studentContext").get("submissionId")

Sie können auch eine Anfrage stellen, um den Status der Einreichung des Schülers oder Studenten zu erhalten. Die Antwort enthält den Wert SubmissionState, der Status wie z. B. ob der Schüler/Student den Anhang geöffnet oder abgegeben hat, angibt. Das kann nützlich sein, wenn Sie Bearbeitungen an einer eingereichten Aufgabe nicht zulassen möchten oder Lehrkräften Einblicke in den Fortschritt ihrer Schüler oder Studenten gewähren möchten:

Python

In unserem Beispiel ist dies eine Fortsetzung der oben beschriebenen Methode load_activity_attachment.

# Issue a request to get the status of the student submission.
submission_response = classroom_service.courses().courseWork(
).addOnAttachments().studentSubmissions().get(
    courseId=flask.session["courseId"],
    itemId=flask.session["itemId"],
    attachmentId=flask.session["attachmentId"],
    submissionId=flask.session["submissionId"]).execute()

Anschließend werden die Informationen zum Anhang aus unserer Datenbank abgerufen und ein Eingabeformular angezeigt. Das Formular in unserem Beispiel besteht aus einem String-Eingabefeld und einer Schaltfläche zum Senden. Zeigen Sie das Bild des Wahrzeichens und bitten Sie den Schüler, den Namen einzugeben. Sobald sie eine Antwort erhalten haben, notieren Sie diese in unserer Datenbank.

Python

In unserem Beispiel ist dies eine Fortsetzung der oben beschriebenen Methode load_activity_attachment.

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

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 complete the activity below.")

form = activity_form_builder()

if form.validate_on_submit():
    # Record the student's response in our database.

    # Check if the student has already submitted a response.
    # If so, update the response stored in the database.
    student_submission = Submission.query.get(flask.session["submissionId"])

    if student_submission is not None:
        student_submission.student_response = form.student_response.data
    else:
        # Store the student's response by the submission ID.
        new_submission = Submission(
            submission_id=flask.session["submissionId"],
            attachment_id=flask.session["attachmentId"],
            student_response=form.student_response.data)
        db.session.add(new_submission)

    db.session.commit()

    return flask.render_template(
        "acknowledge-submission.html",
        message="Your response has been recorded. You can close the " \
            "iframe now.",
        instructions="Please Turn In your assignment if you have " \
            "completed all tasks."
    )

# Show the activity.
return flask.render_template(
    "show-activity-attachment.html",
    message=message_str,
    image_filename=attachment.image_filename,
    image_caption=attachment.image_caption,
    user_context=user_context,
    form=form,
    responses=response_strings)

Wenn Sie zwischen Nutzern unterscheiden möchten, können Sie die Funktion zum Senden deaktivieren und stattdessen die richtige Antwort in der Ansicht für Lehrkräfte anzeigen.

Route für den iframe für die Überprüfung von Schüler-/Studentenarbeiten hinzufügen

Fügen Sie abschließend eine Route hinzu, um den Iframe für die Bewertung der Schülerarbeit zu senden. Der Name dieser Route muss mit dem Namen übereinstimmen, der für die studentWorkReviewUri beim Erstellen eines Anhangs angegeben wurde. Dieser Pfad wird geöffnet, wenn die Lehrkraft die Aufgabe des Schülers oder Studenten in der Benotungsoberfläche von Classroom aufruft.

Sie erhalten den Abfrageparameter submissionId, wenn in Classroom der Iframe für die Überprüfung der Schüler-/Studentenarbeit geöffnet wird. Rufen Sie damit die Arbeit des Schülers aus Ihrer lokalen Datenbank ab:

Python

In unserem Beispiel befindet sich diese in der Datei webapp/attachment_routes.py.

@app.route("/view-submission")
def view_submission():
    """
    Render a student submission using the show-student-submission.html template.
    """

    # Save the query parameters passed to the iframe in the session, just as we did
    # in previous routes. Abbreviated here for readability.
    add_iframe_query_parameters_to_session(flask.request.args)

    # For the sake of brevity in this example, we'll skip the conditional logic
    # to see if we need to authorize the user as we have done in previous steps.
    # We can assume that the user that reaches this route is a teacher that has
    # already authorized and created an attachment using the add-on.

    # In production, we recommend fully validating the user's authorization at
    # this stage as well.

    # Look up the student's submission in our database.
    student_submission = Submission.query.get(flask.session["submissionId"])

    # Look up the attachment in the database.
    attachment = Attachment.query.get(student_submission.attachment_id)

    # Render the student's response alongside the correct answer.
    return flask.render_template(
        "show-student-submission.html",
        message=f"Loaded submission {student_submission.submission_id} for "\
            f"attachment {attachment.attachment_id}.",
        student_response=student_submission.student_response,
        correct_answer=attachment.image_caption)

Add-on testen

Wiederholen Sie die Schritte zum Testen des Add-ons aus der vorherigen Anleitung. Sie sollten einen Anhang haben, der vom Schüler/Studenten geöffnet werden kann.

Führen Sie die folgenden Schritte aus, um den Anhang der Aktivität zu testen:

  • Melden Sie sich in Google Classroom als einer Ihrer Schüler-/Studenten-Testnutzer in demselben Kurs wie der Testnutzer für Lehrkräfte an.
  • Rufen Sie den Tab Kursaufgaben auf und maximieren Sie den Test Aufgabe.
  • Klicken Sie auf die Karte „Add-on-Anhang“, um die Ansicht für Schüler/Studenten zu öffnen und eine Antwort für die Aktivität einzureichen.
  • Schließen Sie den IFrame nach Abschluss der Aktivität. Optional: Klicken Sie auf die Schaltfläche Eingeben.

Nach Abschluss der Aktivität sollte sich in Classroom nichts geändert haben. Testen Sie jetzt den IFrame für die Überprüfung von Schüler-/Studentenarbeiten:

  • Melden Sie sich als Testnutzer der Lehrkraft in Classroom an.
  • Suchen Sie auf dem Tab Noten nach der Spalte für Ihre Testaufgabe. Klicken Sie auf den Namen Ihrer Testaufgabe.
  • Suchen Sie die Karte für den Testnutzer. Klicken Sie auf der Karte auf den Anhang.

Prüfen Sie, ob die richtige Einreichung für den Schüler oder Studenten angezeigt wird.

Glückwunsch! Sie können mit dem nächsten Schritt fortfahren: Benotungen für Anhänge synchronisieren.