ส่วนเสริมของ Google Classroom พร้อมให้บริการแก่นักพัฒนาซอฟต์แวร์แล้ว โปรดดูข้อมูลเพิ่มเติมในเอกสารส่วนเสริม

หน้านี้ได้รับการแปลโดย Cloud Translation API

ส่งไฟล์แนบภายนอก

นี่เป็นบทแนะนำที่ 7 ในชุดบทแนะนำส่วนเสริมของ Classroom

ในบทแนะนำนี้ คุณจะต้องเพิ่มลักษณะการทำงานลงในเว็บแอปพลิเคชันเพื่อสร้างไฟล์แนบของส่วนเสริมจากภายนอก Google Classroom ใช้ลักษณะการทํางานนี้เพื่อให้ผู้ใช้สร้างไฟล์แนบของส่วนเสริมจากผลิตภัณฑ์หรือเว็บไซต์ที่มีอยู่ และยังเป็นส่วนเสริมที่ยอดเยี่ยมของการผสานรวม CourseWork ด้วย เนื่องจากคุณกำหนดเส้นทางการเข้าชมที่มีอยู่ไปยังประสบการณ์ของผู้ใช้ที่ดียิ่งขึ้นซึ่งส่วนเสริมมีให้บริการโดยไม่เปลี่ยนขั้นตอนการดำเนินการ ขั้นตอนที่แนะนำแสดงอยู่ในหน้าคำแนะนำสร้างไฟล์แนบนอก Classroom

นอกจากนี้ คุณยังเพิ่มลักษณะการทํางานไปยังส่วนเสริมเพื่อแก้ไขงานด้วยไฟล์แนบของส่วนเสริมแบบเป็นโปรแกรมได้ด้วย คุณสามารถแก้ไขงานที่มีไฟล์แนบของส่วนเสริมได้ ไม่ว่าใครจะเป็นผู้สร้างงานก็ตาม ซึ่งมีประโยชน์อย่างยิ่งในการส่งงานหลังจากที่นักเรียนทำกิจกรรมเสร็จแล้ว เพื่อแจ้งให้ครูทราบว่างานที่ได้รับมอบหมายเสร็จสมบูรณ์แล้วและงานของนักเรียนพร้อมให้ตรวจสอบ

คุณขยายส่วนเสริมเวอร์ชันสุดท้ายที่รองรับไฟล์แนบประเภทเนื้อหาหรือประเภทกิจกรรม คู่มือนี้ใช้ไฟล์แนบประเภทเนื้อหา

สำคัญ: โปรดทำตามคำแนะนำแบบทีละขั้นตอนก่อนหน้านี้ในชุดนี้จนเสร็จสิ้นก่อนทำตามคำแนะนำแบบทีละขั้นตอนนี้ คำแนะนำแบบทีละขั้นตอนนี้จะขยายเว็บแอปที่พัฒนาในคำแนะนำแบบทีละขั้นตอนก่อนหน้านี้ คุณสามารถดาวน์โหลดซอร์สโค้ดฉบับสมบูรณ์ของคำแนะนำแบบทีละขั้นทั้งหมดได้จากหน้าภาพรวม รหัสของคำแนะนำแบบทีละขั้นตอนนี้อยู่ในไดเรกทอรี /07-external-attachments/

เพิ่มขอบเขต OAuth สำหรับการจัดการงาน

ตรวจสอบว่าแอปพลิเคชันขอขอบเขตต่อไปนี้

https://www.googleapis.com/auth/classroom.addons.teacher
https://www.googleapis.com/auth/classroom.addons.student
https://www.googleapis.com/auth/classroom.coursework.students

ขอบเขต classroom.coursework.students ไม่จำเป็นต้องมีก่อนหน้านี้ และใช้เพื่อสร้างหรือแก้ไขการมอบหมาย CourseWork รายการ เพิ่มขอบเขตนี้ลงในรายการขอบเขตใน Google Workspace Marketplace SDK, หน้าจอขอความยินยอม OAuth และโค้ดเซิร์ฟเวอร์ของโปรเจ็กต์ที่อยู่ในระบบคลาวด์

Python

  SCOPES = [
    "https://www.googleapis.com/auth/classroom.addons.teacher",
    "https://www.googleapis.com/auth/classroom.addons.student",
    "https://www.googleapis.com/auth/classroom.coursework.students",
  ]

สร้างงานใน Classroom

เพิ่มปุ่มลงในหน้าเว็บที่ไม่ใช่ iframe

ขั้นตอนที่อธิบายไว้ในบทแนะนำนี้ช่วยให้ผู้ใช้สร้างงานและไฟล์แนบใน Google Classroom จากผลิตภัณฑ์ที่ไม่ใช่ของ Google ได้ ในทางปฏิบัติ เว็บไซต์หรือแอปพลิเคชันที่มีอยู่ของคุณอาจเป็นเว็บไซต์หรือแอปพลิเคชันดังกล่าว ในตัวอย่างนี้ คุณจะต้องสร้างหน้าเว็บจำลองเพื่อใช้เป็นเว็บไซต์ภายนอก คุณต้องมีปุ่มหรือลิงก์ที่เมื่อคลิกแล้วเปิดเส้นทางใหม่ซึ่งทำขั้นตอนที่แนะนำ CourseWork เพื่อสร้างงานใหม่

นอกจากนี้ คุณยังต้องเพิ่มปุ่มหรือลิงก์เพื่ออนุญาตให้ผู้ใช้ลงชื่อเข้าใช้ หากยังไม่มี คุณจะต้องมีข้อมูลเข้าสู่ระบบของผู้ใช้เพื่อส่งคำขอ API รายการต่อๆ ไป ดังนั้นผู้ใช้จึงต้องดำเนินการแฮนเดิล OAuth 2.0 ให้เสร็จสมบูรณ์ ดูคำแนะนำที่เจาะจงได้จากคำแนะนำแบบทีละขั้นตอนในการลงชื่อเข้าใช้

Python

ตัวอย่าง Python ที่ระบุจะแก้ไขเส้นทาง /index ที่แนะนำในขั้นตอนแรกในการแนะนำ

<!-- /webapp/templates/index.html -->
<a href="clear-credentials.html">Logout</a>
<a href="start-auth-flow.html">Login</a>

<br>

<a href="create-coursework-assignment.html">Create a CourseWork Assignment</a>

เพิ่มเทมเพลต HTML เพื่อแสดงปลายทางในเว็บไซต์ หน้านี้จะแสดงเนื้อหาที่จะแนบมากับCourseWorkงานของคุณ

<!-- /webapp/templates/example-coursework-assignment.html -->
<h1>CourseWork assignment loaded!</h1>
<p>You've loaded a CourseWork assignment! It was created from an external web page.</p>

สร้างไฟล์โมดูล Python ใหม่เพื่อจัดการกับเส้นทางที่เกี่ยวข้องกับ CourseWork ซึ่งก็คือ coursework_routes.py ในตัวอย่างที่เราให้ไว้ เพิ่มเส้นทางต่อไปนี้ 3 เส้นทาง โดยคุณจะกรอกเนื้อหาบางส่วนในภายหลัง

# /webapp/coursework_routes.py
@app.route("/create-coursework-assignment")
def create_coursework_assignment():
  """
  Completes the assignment creation flow.
  """

  # Check that the user is signed in. If not, perform the OAuth 2.0
  # authorization flow.
  credentials = get_credentials()

  if not credentials:
    return start_auth_flow("coursework_assignment_callback")

  # Construct the Google Classroom service.
  classroom_service = get_classroom_service()

  pass  # To be completed later.

@app.route("/example-coursework-assignment/<assignment_type>")
def example_coursework_assignment(assignment_type):
  """
  Renders the "example-coursework-assignment.html" template.
  """
  return flask.render_template(
      "example-coursework-assignment.html", assignment_type=assignment_type
  )

@app.route("/coursework-assignment-callback")
def coursework_assignment_callback():
  """
  Completes the OAuth 2.0 handshake and stores credentials in the session.
  This is identical to the callback introduced in the sign-in walkthrough,
  but redirects the user to the index page instead of the attachment
  discovery page.
  """
  flow = google_auth_oauthlib.flow.Flow.from_client_secrets_file(
      CLIENT_SECRETS_FILE,
      scopes=SCOPES,
      state=flask.session["state"],
      redirect_uri=flask.url_for("coursework_assignment_callback", _external=True),
  )

  flow.fetch_token(authorization_response=flask.request.url)

  credentials = flow.credentials
  flask.session["credentials"] = session_credentials_to_dict(
      credentials
  )

  # Close the current window and redirect the user to the index page.
  return flask.render_template("close-me.html", redirect_destination="index")

ตรวจสอบสิทธิ์ของผู้ใช้ในการสร้างไฟล์แนบ

ผู้ใช้ต้องมีคุณสมบัติตรงตามข้อกําหนดเบื้องต้นหลายประการก่อนที่คุณจึงจะสร้างไฟล์แนบของส่วนเสริมในนามของผู้ใช้ได้ เพื่อความสะดวก Google จึงเตรียมเมธอด userProfiles.checkUserCapability ไว้เพื่อระบุว่าผู้ใช้มีคุณสมบัติตรงตามข้อกำหนดเบื้องต้นเหล่านี้หรือไม่ ผู้ใช้ที่มีคุณสมบัติตรงตามข้อกําหนดเบื้องต้นเรียกว่าผู้ใช้ที่มีสิทธิ์

สำคัญ: การตรวจสอบสิทธิ์โดยใช้ Classroom API อยู่ในเวอร์ชันตัวอย่างแบบสาธารณะและพร้อมใช้งานในเวอร์ชันตัวอย่าง V1_20240930_PREVIEW ขึ้นไป หากต้องการใช้เมธอด API ในเวอร์ชันตัวอย่างแบบสาธารณะ คุณต้องเป็นส่วนหนึ่งของโปรแกรมทดลองใช้สำหรับนักพัฒนาแอป Google Workspace และดำเนินการตั้งค่าเพิ่มเติมนอกเหนือจากการใช้งาน Classroom API ตามปกติ

เพิ่มการตรวจสอบการมีสิทธิ์ในการใช้งานเส้นทางการสร้าง CourseWork จากนั้นทดสอบช่อง allowed ในการตอบกลับ สำหรับผู้ใช้ที่มีสิทธิ์ ให้ทำตามตรรกะเพื่อสร้างงานที่มีไฟล์แนบของส่วนเสริม หรือสร้างลิงก์ คุณจะต้องทราบรหัสของหลักสูตรที่ผู้ใช้ต้องการสร้างงาน โดยปกติแล้ว คุณจะต้องแจ้งให้ผู้ใช้ระบุหลักสูตรที่จะใช้ เพื่อความง่าย เราจะใช้ค่าที่ฮาร์ดโค้ดในตัวอย่างนี้

Python

# /webapp/coursework_routes.py
@app.route("/create-coursework-assignment")
def create_coursework_assignment():
  """
  Completes the assignment creation flow.
  """
  # ... Check that the user is signed in and get the Classroom service ...

  # Check whether the user can create add-on attachments.
  eligibility_response = (
      classroom_service.userProfiles()
      .checkUserCapability(
        userId="me",
        capability="CREATE_ADD_ON_ATTACHMENT",
        # The previewVersion is necessary while the method is available in the
        # Workspace Developer Preview Program.
        previewVersion="V1_20240930_PREVIEW",
      ).execute()
  )
  is_create_attachment_eligible = eligibility_response.get("allowed")

  if is_create_attachment_eligible:
    # See the "Create an assignment with add-on attachment for eligible users" section for implementation.
  if not is_create_attachment_eligible:
    # See the "Create a Link Material" section for implementation.

สร้างงานที่มีไฟล์แนบของส่วนเสริมสำหรับผู้ใช้ที่มีสิทธิ์

หากผู้ใช้มีสิทธิ์สร้างไฟล์แนบของส่วนเสริม ให้ทำตามขั้นตอนต่อไปนี้

ส่งคําขอ API เพื่อสร้างcourseWorkงานใน Google Classroom โดยไม่มีไฟล์แนบ
ดึงข้อมูล id ของงานที่สร้างขึ้นใหม่
สร้าง CourseWork AddOnAttachment ใหม่
ส่งคำขอสร้างไฟล์แนบของส่วนเสริมในงานที่สร้างขึ้นใหม่ใน Google Classroom

Python

# The ID of the course to which the assignment will be added.
course_id = 1234567890  # TODO(developer) Replace with an actual course ID.

# /webapp/coursework_routes.py
if is_create_attachment_eligible:
  # Create an assignment.
  coursework = {
      "title": "My CourseWork Assignment with Add-on Attachment",
      "description": "Created using the Classroom CourseWork API.",
      "workType": "ASSIGNMENT",
      "state": "DRAFT",  # Set to 'PUBLISHED' to assign to students.
  }

  # Issue a request to create the assignment.
  create_assignment_response = (
      classroom_service.courses()
      .courseWork()
      .create(courseId=course_id, body=coursework)
      .execute()
  )

  # Create an add-on attachment that links to the selected content and
  # associate it with the new assignment.
  content_url = flask.url_for(
      "example_coursework_assignment",
      assignment_type="add-on-attachment",
      _scheme="https",
      _external=True,
  )

  # Construct an AddOnAttachment instance.
  attachment = {
      "teacherViewUri": {"uri": content_url},
      "studentViewUri": {"uri": content_url},
      "title": f'Test Attachment for Assignment {create_assignment_response.get("id")}',
  }

  # Issue a request to create the attachment.
  add_on_attachment_response = (
      classroom_service.courses()
      .courseWork()
      .addOnAttachments()
      .create(
          courseId=course_id,
          itemId=create_assignment_response.get("id"),  # ID of the new assignment.
          body=attachment,
      )
      .execute()
  )

สร้างสื่อลิงก์

หากผู้ใช้ไม่มีสิทธิ์สร้างไฟล์แนบของส่วนเสริม ให้สร้างลิงก์สื่อแทนโดยทำดังนี้

Python

# The ID of the course to which the assignment will be added.
course_id = 1234567890  # TODO(developer) Replace with an actual course ID.

if not is_create_attachment_eligible:
    coursework = {
        "title": "My CourseWork Assignment with Link Material",
        "description": "Created using the Classroom CourseWork API.",
        "workType": "ASSIGNMENT",
        "state": "DRAFT",  # Set to 'PUBLISHED' to assign to students.
        # Specify the URL for your content as a Link Material.
        "materials": [
            {
                "link": {
                    "url": flask.url_for(
                        "example_coursework_assignment",
                        assignment_type="link-material",
                        _scheme="https",
                        _external=True,
                    )
                }
            }
        ],
    }

    # Issue a request to create the assignment.
    assignment_response = (
        classroom_service.courses()
        .courseWork()
        .create(courseId=course_id, body=coursework)
        .execute()
    )

แก้ไขงานที่สร้างขึ้นแล้ว

คุณสามารถเข้าถึง แก้ไข ส่งคืน อ้างสิทธิ์ใหม่ หรือส่งคืนรายการสตรีมของ Google Classroom ที่มีไฟล์แนบของส่วนเสริมอย่างน้อย 1 รายการ ไม่ว่าใครจะเป็นผู้สร้างรายการสตรีมนั้นก็ตาม รายการสตรีมคือ Announcement, CourseWork งาน หรือ CourseWorkMaterial

ในการสาธิตนี้ คุณจะต้องเพิ่มเส้นทางเพื่อแก้ไขรายการสตรีมหนึ่งๆ โปรดใช้วิธีนี้เพื่อยืนยันว่าคุณสามารถเข้าถึงและแก้ไขรายการสตรีมที่คุณสร้างโดยใช้ API และที่ครูสร้างผ่าน UI ของ Google Classroom

เพิ่มลิงก์หรือปุ่มอีกรายการลงในหน้าเว็บที่คุณแก้ไขครั้งแรกในบทแนะนำนี้ จากนั้นระบบจะเปิดเส้นทางใหม่เพื่อแก้ไขCourseWorkงาน

Python

ตัวอย่าง Python ที่ระบุจะแก้ไขเส้นทาง /index ที่แก้ไขแล้วก่อนหน้านี้ในบทแนะนำนี้

<!-- /webapp/templates/index.html -->
<a href="modify-coursework-assignment.html">Create a CourseWork Assignment</a>

สร้างเส้นทางใหม่เพื่อจัดการเส้นทางที่เกี่ยวข้องกับ CourseWork ซึ่งอยู่ในไฟล์ coursework_routes.py ในตัวอย่างที่เราให้ไว้

# Check that the user is signed in.
credentials = get_credentials()

if not credentials:
  return start_auth_flow("coursework_assignment_callback")

# Get the Google Classroom service.
classroom_service = get_classroom_service()

# The ID of the course to which the assignment will be added.
# Ordinarily, you'll prompt the user to specify which course to use. For
# simplicity, we use a hard-coded value in this example.
course_id = 1234567890  # TODO(developer) Replace with an actual course ID.
assignment_id = 1234567890  # TODO(developer) Replace with an actual assignment ID.

# Retrieve details about the CourseWork assignment.
get_coursework_response = (
    classroom_service.courses()
    .courseWork()
    .get(courseId=course_id, id=assignment_id)
    .execute()
)

# Alter the current title.
assignment_title = f"{get_coursework_response.get('title')} (Modified by API request)"

# Issue a request to modify the assignment.
modify_coursework_response = (
    classroom_service.courses()
    .courseWork()
    .patch(
        courseId=course_id,
        id=assignment_id,
        updateMask="title",
        body={"title": assignment_title},
    )
    .execute()
)

ทดสอบส่วนเสริม

ตัวอย่างที่ระบุไว้ใช้ตัวระบุหลักสูตรและงานแบบฮาร์ดโค้ดเพื่อให้เข้าใจง่าย คุณรับตัวระบุเหล่านี้ได้โดยส่งคำขอด้วยข้อมูลเข้าสู่ระบบของครูไปยังเมธอด get และ list ของแหล่งข้อมูล courses และ courseWork และจะแสดงผลในคำตอบเมื่อสร้างงาน courseWork ด้วย

ทดสอบการสร้างเนื้อหาลิงก์

เรียกใช้เซิร์ฟเวอร์ จากนั้นไปที่หน้าดัชนีและลงชื่อเข้าใช้ในฐานะผู้ใช้ที่เป็นครูที่ไม่มีใบอนุญาต Teaching & Learning หรือ Plus ของ Google Workspace for Education คุณจะสลับสถานะใบอนุญาตของผู้ใช้ได้จากคอนโซลผู้ดูแลระบบของโดเมนทดสอบ คลิกปุ่มสร้างงานในหลักสูตร จากนั้นเปิด UI ของ Google Classroom และยืนยันว่ามีการสร้างงานที่มีไฟล์แนบใน Link Material แล้ว ไฟล์แนบควรแสดงชื่อหน้าเว็บที่ลิงก์และ URL

ทดสอบการสร้างไฟล์แนบของส่วนเสริม

กลับไปที่หน้าดัชนีแล้วลงชื่อเข้าใช้ในฐานะผู้ใช้ที่เป็นครูที่มีใบอนุญาต Google Workspace for Education Teaching and Learning หรือ Plus คลิกปุ่มสร้างงานในหลักสูตร จากนั้นเปิด UI ของ Google Classroom และยืนยันว่ามีการสร้างงานที่มีไฟล์แนบของส่วนเสริมแล้ว ไฟล์แนบควรแสดงชื่อแอปพลิเคชัน ส่วนเสริมและชื่อที่ระบุไว้ในโค้ด

การแก้ไขงานทดสอบ

กลับไปที่หน้าดัชนีและตรวจสอบว่าได้ลงชื่อเข้าใช้ในฐานะผู้ใช้ของครูที่มีใบอนุญาต Teaching and Learning หรือ Plus คลิกปุ่มแก้ไขงานในหลักสูตร จากนั้นกลับไปที่ UI ของ Google Classroom และยืนยันว่ามีการแก้ไขชื่องานแล้ว

ยินดีด้วย คุณดูชุดบทแนะนำจนจบแล้ว