diff --git a/rest_framework/renderers.py b/rest_framework/renderers.py
index d12de4d54..95ea3690c 100644
--- a/rest_framework/renderers.py
+++ b/rest_framework/renderers.py
@@ -803,10 +803,18 @@ class DocumentationRenderer(BaseRenderer):
 
     def get_context(self, data):
         from pygments.formatters import HtmlFormatter
+        from django.utils.html import mark_safe
         formatter = HtmlFormatter(style=self.code_style)
         code_style = formatter.get_style_defs('.highlight')
         langs = ['shell', 'javascript', 'python']
-        return {'document': data, 'langs': langs, 'code_style': code_style}
+        codec = coreapi.codecs.CoreJSONCodec()
+        schema = mark_safe(codec.encode(data))
+        return {
+            'document': data,
+            'langs': langs,
+            'code_style': code_style,
+            'schema': schema
+        }
 
     def render(self, data, accepted_media_type=None, renderer_context=None):
         #from coredocs.main import render as render_docs
diff --git a/rest_framework/templates/rest_framework/docs/index.html b/rest_framework/templates/rest_framework/docs/index.html
index 8e454dc57..62fab7356 100644
--- a/rest_framework/templates/rest_framework/docs/index.html
+++ b/rest_framework/templates/rest_framework/docs/index.html
@@ -38,28 +38,28 @@
         <script src="{% static 'rest_framework/docs/js/jquery-1.10.2.min.js' %}"></script>
         <script src="{% static 'rest_framework/docs/js/bootstrap-3.0.3.min.js' %}"></script>
         <script>
-            // function getCookie(name) {
-            //     var cookieValue = null;
-            //     if (document.cookie && document.cookie !== '') {
-            //         var cookies = document.cookie.split(';');
-            //         for (var i = 0; i < cookies.length; i++) {
-            //             var cookie = jQuery.trim(cookies[i]);
-            //             // Does this cookie string begin with the name we want?
-            //             if (cookie.substring(0, name.length + 1) === (name + '=')) {
-            //                 cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
-            //                 break;
-            //             }
-            //         }
-            //     }
-            //     return cookieValue;
-            // }
-            // const csrf = {'X-CSRFToken': getCookie('csrftoken')}
+            function getCookie(name) {
+                var cookieValue = null;
+                if (document.cookie && document.cookie !== '') {
+                    var cookies = document.cookie.split(';');
+                    for (var i = 0; i < cookies.length; i++) {
+                        var cookie = jQuery.trim(cookies[i]);
+                        // Does this cookie string begin with the name we want?
+                        if (cookie.substring(0, name.length + 1) === (name + '=')) {
+                            cookieValue = decodeURIComponent(cookie.substring(name.length + 1));
+                            break;
+                        }
+                    }
+                }
+                return cookieValue;
+            }
+            const csrf = {'X-CSRFToken': getCookie('csrftoken')}
 
             const coreapi = window.coreapi
             const codec = new coreapi.codecs.CoreJSONCodec()
-            const schema = '{"_type": "document"}' {{ schema }}
+            const schema = {{ schema }}
             const doc = codec.decode(schema, {preloaded: true})
-            const client = new coreapi.Client()
+            const client = new coreapi.Client(null, null, csrf)
 
             $('body').scrollspy({ target: '#toc' })
 
diff --git a/rest_framework/templates/rest_framework/docs/langs/javascript.html b/rest_framework/templates/rest_framework/docs/langs/javascript.html
index b14089f78..33608b682 100644
--- a/rest_framework/templates/rest_framework/docs/langs/javascript.html
+++ b/rest_framework/templates/rest_framework/docs/langs/javascript.html
@@ -4,7 +4,7 @@
 // Initialize a client & load the schema document
 var client = new coreapi.Client()
 var document = null
-client.get("{{ schema_url }}").then(function(result) {
+client.get("{{ document.url }}").then(function(result) {
     document = result
 })
 
diff --git a/rest_framework/templates/rest_framework/docs/langs/python.html b/rest_framework/templates/rest_framework/docs/langs/python.html
index 4dfcddc01..8e23420c6 100644
--- a/rest_framework/templates/rest_framework/docs/langs/python.html
+++ b/rest_framework/templates/rest_framework/docs/langs/python.html
@@ -3,7 +3,7 @@
 
 # Initialize a client & load the schema document
 client = coreapi.Client()
-document = client.get("{{ schema_url }}"{% if schema_format %}, format="{{ schema_format }}"{% endif %})
+document = client.get("{{ document.url }}"{% if schema_format %}, format="{{ schema_format }}"{% endif %})
 
 # Interact with the API endpoint
 action = [{% if section_key %}"{{ section_key }}", {% endif %}"{{ link_key }}"]
diff --git a/rest_framework/templates/rest_framework/docs/langs/shell.html b/rest_framework/templates/rest_framework/docs/langs/shell.html
index c0aabf919..d2744920c 100644
--- a/rest_framework/templates/rest_framework/docs/langs/shell.html
+++ b/rest_framework/templates/rest_framework/docs/langs/shell.html
@@ -1,6 +1,6 @@
 {% load rest_framework %}
 <pre class="highlight shell" data-language="shell"><code>{% code bash %}# Load the schema document
-$ coreapi get {{ schema_url }}{% if schema_format %} --format {{ schema_format }}{% endif %}
+$ coreapi get {{ document.url }}{% if schema_format %} --format {{ schema_format }}{% endif %}
 
 # Interact with the API endpoint
 $ coreapi action {% if section_key %}{{ section_key }} {% endif %}{{ link_key }}{% for field in link.fields %} -p {{ field.name }}=...{% endfor %}{% endcode %}</code></pre>