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, die von Schülern/Studenten eingereicht werden müssen, z. B. eine schriftliche Antwort, ein Quiz oder andere von Schülern oder Studenten erstellte Artefakte.

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:

  • Rechts oben im iFrame der Schüler-/Studentenansicht wird die Schaltfläche „Abgeben“ angezeigt.
  • Sie dienen als eindeutige Kennung für die Arbeit der Schüler/Studenten.
  • Die Karte des Anhangs wird in der Benutzeroberfläche von Classroom 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 Anfragen zum Erstellen von Anhängen an die Classroom API, um einen Anhang des Typs "Aktivität" zu erstellen.
  • Implementieren Sie 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ückmeldung zu Schüler-/Studentenarbeiten ausgeliefert werden soll.

Anschließend können Sie über die Google Classroom-Benutzeroberfläche als Lehrkraft angemeldeten Aktivitätsanhängen für Aufgaben erstellen. Die Kursteilnehmer können auch die Aktivität im iFrame abschließen und eine Antwort senden. Die Lehrkraft kann sich die abgegebene Aufgabe des Schülers/Studenten in der Classroom-Benotungs-UI 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 zeigt. Die Aktivität besteht darin, den Schüler oder Studenten aufzufordern, den Namen der Sehenswürdigkeit 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 passenden Namen hinzu. Sie implementieren die Route in einem späteren Schritt.

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 später nachsehen, wenn sich die Lehrkraft die abgegebene Aufgabe im iFrame von „Aufgaben von Schülern/Studenten“ ansieht.

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 dem 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 „Schüler/Studenten“, um ein kleines Formular anzuzeigen und die Eingabe des Schülers oder Studenten anzunehmen. 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 dieser 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 der Schüler-/Studentenarbeit 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 beim Erstellen eines Anhangs für studentWorkReviewUri 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. Verwenden Sie sie, um die Arbeit des Schülers/Studenten aus Ihrer lokalen Datenbank abzurufen:

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 Aktivitätsanhang 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. Klicken Sie optional auf die Schaltfläche Abgeben.

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 Kursleiter-Testnutzer 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 den Anhang auf der Karte.

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.