LTI Integration - Deep Linking Assignment No Speedgrader Preview
- Mark as New
- Bookmark
- Subscribe
- Mute
- Subscribe to RSS Feed
- Permalink
- Report Inappropriate Content
18 hours ago
Hi,
I'm currently working on LTI 1.3 integration with Canvas. I created the Developer Key using the manual entry, with the Assignment Link Selection placement set to LtiDeepLinkingRequest. This seems to work fine: I can go from my Canvas development instance to my site by selecting "External Tool" in the Submission Type, choose my tool, pick the LTI content for deep linking, go back to Canvas, save the assignment, preview it, etc. I see the Line Item created in the Gradebook and I can switch to a student, load the LTI content from my site into Canvas and student can attempt the assessmen, and submit the content in my site, which I can see sends the score back to the Canvas gradebook by POSTing to the create score endpoint.
When I switch back to a teacher and go to the Speedgrader, I get a "No Preview Available" blank page.
I'm using LTIJS library: https://cvmcosta.me/ltijs/#/
Tech stack -> MERN
Content items when deeplink submit
```
const contentItems = [
{
type: 'ltiResourceLink',
url: `${config.TOOL_URL}/launch`,
custom: {
quizId,
assessment_type: type,
created_at: new Date().toISOString(),
quiz_title: title,
quiz_description: description
},
iframe: {
width: '100%',
height: '100%'
},
presentation: {
documentTarget: 'iframe',
width: '100%',
height: '100%',
returnUrl: config.TOOL_URL
},
window: {
windowFeatures: 'width=1024,height=768,toolbar=yes,menubar=yes,scrollbars=yes'
},
placementAdvice: {
displayWidth: '100%',
displayHeight: '100%',
presentationDocumentTarget: 'iframe'
},
lineItem: {
scoreMaximum: totalPoints,
resourceId: quizId
},
submissionReview: {
url: `${config.TOOL_URL}/preview/${quizId}`,
custom: {
quizId: quizId
}
}
}};
Content items when deeplink submit
```
const contentItems = [
{
type: 'ltiResourceLink',
url: `${config.TOOL_URL}/launch`,
custom: {
quizId,
assessment_type: type,
created_at: new Date().toISOString(),
quiz_title: title,
quiz_description: description
},
iframe: {
width: '100%',
height: '100%'
},
presentation: {
documentTarget: 'iframe',
width: '100%',
height: '100%',
returnUrl: config.TOOL_URL
},
window: {
windowFeatures: 'width=1024,height=768,toolbar=yes,menubar=yes,scrollbars=yes'
},
placementAdvice: {
displayWidth: '100%',
displayHeight: '100%',
presentationDocumentTarget: 'iframe'
},
lineItem: {
scoreMaximum: totalPoints,
resourceId: quizId
},
submissionReview: {
url: `${config.TOOL_URL}/preview/${quizId}`,
custom: {
quizId: quizId
}
}
}};
const message = await lti.DeepLinking.createDeepLinkingMessage(token, contentItems, {
message: 'Assessment linked successfully!',
log: 'Assessment linking completed',
errlog: 'Error occurred during assessment creation'
});