Integrations using SDK on the client-side
For the integration on the client side, our Support team will send to you these parameters' values:
- jwt_secret
- serverOrigin
- integrationName
See the code excerpts below for the examples of how to use these parameters.
Demonstration of the use of Constructor Proctor SDK
Find the demonstration of how Constructor Proctor works at this link:
https://sdk-demo.web.proctor.constructor.app/
Example of using Constructor Proctor SDK (frontend)
html
<body>
<!-- ... -->
<button id="startProctoringButton">Start exam with proctoring</button>
<!-- ... -->
<script type="module">
import * as proctoring from 'https://sdk.web.proctor.constructor.app/proctoring.js'
async function getDataForProctoring() {
const LMS_URL = 'https://lms-origin/get-data-for-proctoring'
try {
return await fetch(LMS_URL).then(res => res.json())
} catch (e) {
alert('Error in fetch data to start proctoring')
console.error(e)
return {}
}
}
/* ------------------------- */
async function startProctoring(serverOrigin, integrationName, jwt, theme, config) {
let proctoringSession = await proctoring
.init({ serverOrigin, integrationName, jwt, theme, ...config })
.catch(e => alert(`Proctoring SDK Init Error: ${e.message} ${e.cause}`))
proctoringSession.examStarted
.then(() => console.log('proctoring: exam started'))
.then(() => {
hideInitialDom()
showExamContent()
})
proctoringSession.examFinished.then(() => {
hideExamContent()
})
proctoringSession.videoUploaded.then(() => {
console.log('proctoring: video uploaded')
})
}
/* ------------------------- */
async function startButtonHandler(config) {
let data = await getDataForProctoring()
if (!data) {
return null
}
let { serverOrigin, integrationName, jwt } = data
await startProctoring(serverOrigin, integrationName, jwt, 'default', config)
}
document
.getElementById('startProctoringButton')
.addEventListener('click', handleStartProctoringButton)
async function handleStartProctoringButton() {
let { serverOrigin, integrationName, jwt } = await getDataForProctoring()
let theme = 'default'
let config = {}
await startProctoring(serverOrigin, integrationName, jwt, theme, config)
}
</script>
<!-- ... -->
</body>
See SDK configuration parameters for the details on the config parameter.
Example of generating proctoring data on the LMS side (backend)
python
import datetime
import uuid
import jwt
JWT_SECRET = None
USER_ID = None
ACCOUNT_ID = None
ACCOUNT_NAME = None
EXAM_ID = None
SESSION_ID = str(uuid.uuid4())
def get_user_data() -> dict:
return {
"userId": USER_ID,
"lastName": "lastname",
"firstName": "firstname",
"thirdName": "thirdname",
"language": "en",
}
def get_organization_data() -> dict:
return {
"accountId": ACCOUNT_ID,
"accountName": ACCOUNT_NAME,
}
def get_exam_data() -> dict:
start = datetime.datetime.now(tz=datetime.timezone.utc)
end = start + datetime.timedelta(days=1)
return {
"duration": 30,
"startDate": start.isoformat(),
"endDate": end.isoformat(),
"examId": EXAM_ID,
"examName": "test simple integration",
"proctoring": "offline",
"schedule": False,
"allowMultipleDisplays": True,
"identification": "face_and_passport"
}
def get_session_data() -> dict:
return {
"sessionId": SESSION_ID,
"sessionUrl": "https://example.org/",
}
def get_start_payload_data() -> dict:
return {
**get_user_data(),
**get_organization_data(),
**get_exam_data(),
**get_session_data()
}
def build_token(payload: dict, jwt_secret: str) -> str:
return jwt.encode(payload=payload, key=jwt_secret, algorithm="HS256")
def main():
assert JWT_SECRET is None
assert USER_ID is None
assert ACCOUNT_ID is None
assert ACCOUNT_NAME is None
assert EXAM_ID is None
assert SESSION_ID is None
token = build_token(payload=get_start_payload_data(), jwt_secret=JWT_SECRET)
print(token)
if __name__ == "__main__":
main()