Issues with using d2l remote plugins (insert stuff cim) example not working

133 views Asked by At

I am new to Brightspace and been fiddling with the remote plugins sample (logo). I can load the sample logo project, but cannot get it to insert into the page. I have uploaded the file but get a 404 error on submit. Can someone `

   $( document ).ready(function() {
            $('#submitFormButton').click( function() {
                 $.ajax({
                    url: "/getisfdetails",
                    data: {
                        image: $("input[name='image']:checked").val()
                    },
                    success: function(response){
                        $("input[name='lti_message_type']").val(response.lti_message_type);
                        $("input[name='lti_version']").val(response.lti_version);
                        $("input[name='content_items']").val(response.content_items);
                        $("input[name='oauth_version']").val(response.oauth_version);
                        $("input[name='oauth_nonce']").val(response.oauth_nonce);
                        $("input[name='oauth_timestamp']").val(response.oauth_timestamp);
                        $("input[name='oauth_consumer_key']").val(response.oauth_consumer_key);
                        $("input[name='oauth_callback']").val(response.oauth_callback);
                        $("input[name='oauth_signature_method']").val(response.oauth_signature_method);
                        $("input[name='oauth_signature']").val(response.oauth_signature);
                        $("#isfForm").prop('action', response.lti_return_url);
                        $("#isfForm").submit();
                    }
                });
            });
           
    });
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

            src="https://code.jquery.com/jquery-3.2.1.min.js"
            integrity="sha256-hwg4gsxgFZhOsEEamdOYGBf13FyQuiTwlAQgxVSNgt4="
            crossorigin="anonymous"></script>
 
    <body>
        <h3>Select an logo:</h3>
        <input type="radio" name="image" value="brightspace-logo.png"> <img src="../content/isf/brightspace-logo.png" alt="Brightspace Logo"><br />
        <input type="radio" name="image" value="d2l-logo.png"> <img src="../content/isf/d2l-logo.png" alt="D2L Logo"><br />
        <div hidden>
            <form id="isfForm" method="POST">
                <input type="hidden" name="lti_message_type" />
                <input type="hidden" name="lti_version" />
                <input type="hidden" name="content_items" /> 
                <input type="hidden" name="oauth_version" />
                <input type="hidden" name="oauth_nonce" />
                <input type="hidden" name="oauth_timestamp" />
                <input type="hidden" name="oauth_consumer_key" />
                <input type="hidden" name="oauth_callback" />
                <input type="hidden" name="oauth_signature_method" />
                <input type="hidden" name="oauth_signature" />
            </form>
        </div>
        <br />
        <button id="submitFormButton">Submit</button>
    </body>

` how do you set this cookie in the javascript? I believe a cookie needs to be set??? and I do not see how to set it? or maybe I am missing something else that is not noted in the documentation.

3

There are 3 answers

1
Paul Janzen On

I would highly recommend you consider using LTI Advantage/1.3 instead of Remote Plugins. LTI provides a standards-based integration approach & a better developer experience.

https://community.brightspace.com/s/article/LTI-Integration-Guide

0
Jesse Sheather On

If you are working with a partner of D2L please get in touch with the partner team and technical assistance is available. Your information here is appreciated but we are glad to examine the full context and use case as these errors are not hugely uncommon during dev. Otherwise, I echo Paul's suggestion, but I understand if it is not immediately possible.

[email protected] or talk with your team that knows D2L!

0
pfranza On

Depending on which browser you are in you might be seeing the recent effects of the third-party cookie blocking that the browsers are adopting. Because LTIs (both 1.1 and 1.3/Advantage) typically launch into iframe any access to those cookies are regarded as third party. This effectively means two things

  1. You need to be aware of the cookie access routines where a user action must be taken to request access to the browser storage API using document.requestStorageAccess()

  2. You need to be marking your cookies appropriately with the new SameSite cookie directives

Without these the browser will mark your cookie request as a 'Tracking cookie' and refuse to serve it along with the request or make it accessible via javascript.

An alternative is also to detect that the LTI launch is happening inside the an iframe and to bust that iframe out to a new window, or alternatively configure the launch inside Brightspace to not use a iframe at all.