Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Forbidden <CSRF token missing or incorrect>:/ summernote/load_attachment/

See original GitHub issue

Hi I am getting this error when I try to load an image in the editor when I am using SummernoteInplaceWidget. The full error is:

Forbidden <CSRF token missing or incorrect>😕 summernote/load_attachment/ POST /summernote/upload_attachment/ HTTP/1.1 403 2502

When I use SummernoteWidget it works fine, but I can not resize the editor, but with SummernoteInplaceWidget I can resize it, but when I upload an image it show that error in console, and the image is not shown in the editor.

I just want to say, that my header_photo is a ImageField and it works perfect, as SummernoteWidget does.

my forms.py file:

class CreatePostForm(forms.ModelForm):
	class Meta:
		model = Post
		fields = ('title', 'status', 'header_photo', 'body')

		widgets = {
            #'body': SummernoteWidget(),
            'body': SummernoteInplaceWidget(),
        }

body is:

body = models.CharField(max_length=5000, 
                               blank=True, 
                               unique=False, 
                               null=True)

settings.py file:

STATIC_URL = '/static/'

STATICFILES_DIRS = [
    os.path.join(BASE_DIR, 'static'),
    #'/var/www/static/',
]

STATIC_ROOT = os.path.join(os.path.dirname(BASE_DIR), 'static_cdn')

MEDIA_URL = '/media1/'
MEDIA_ROOT = os.path.join(os.path.dirname(BASE_DIR), 'media_cdn')


SUMMERNOTE_CONFIG = {
    # Using SummernoteWidget - iframe mode
    'iframe': False,  # or set False to use SummernoteInplaceWidget - no iframe mode

    # Using Summernote Air-mode
    'airMode': False,

    # Use native HTML tags (`<b>`, `<i>`, ...) instead of style attributes
    # (Firefox, Chrome only)
    'styleWithTags': True,

    # Set text direction : 'left to right' is default.
    'direction': 'ltr',

    # Change editor size
    'width': '100%',

    # Max length
    'max-length': 5000,
}

and my form is:

<form class="form-horizontal" method="post" action="." enctype="multipart/form-data">
                    {% csrf_token %}
                    <fieldset>
                        <div class="text-center" style="margin-bottom: 20px">
                            <h2 style="color: #c1b4b4;">Upload the header picture for your post</h2>
                            {% render_field post_form.header_photo class="form-control" style="background-color: #E8E8E8" %}
                        </div>

                        <div class="form-inline">
                            <div class="form-group" style="margin-bottom: 20px;">
                                {% render_field post_form.title class="form-control" placeholder="Blog title" %}
                                {% render_field post_form.status class="form-control" %}
                            </div>
                        </div>
                        {{ post_form.media }}
                        {{ post_form.body }}
                        <hr>
                        <div class="control-group">
                            <!-- Button -->
                            <div class="controls" style="margin-bottom: 20px">
                                <button class="btn btn-lg btn-success" style="min-width: 300px">Save</button>
                            </div>
                        </div>
                        {% if redirect_field_value %}
                        <input type="hidden" name="{{ redirect_field_name }}" value="{{ redirect_field_value }}" />
                        {% endif %}
                     </fieldset>
                </form>

If you need I can upload any of my files. Thank you for your help

Issue Analytics

State:
Created 7 years ago
Comments:13 (4 by maintainers)

Top GitHub Comments

1reaction

boryskuczkowskicommented, Sep 26, 2018

“{{ foobar|safe }}” -> should this be placed where the form is rendered?

this should go to html template

“!!!Be sure to put {{ form.media }} in template before initiate summernote” -> only for inplacewidget? What if I use crispyforms?

Yeah, this goes where the form is, I use crispy forms and I put {{ form.media }} in-between {% block jquery %} {{ form.media }} {% endblock %} and {% block jquery %}{% endblock %} at the very bottom of the <body> of base.html, this makes sure jquery loads before it executes the script. Also check that you are using “full version” of jquery from cdn or locally, I struggled for days searching for answer as I couldn’t get mine to work by any means, turns out I was using slim version of jquery which didn’t include necessary files 😕

0reactions

nad2000commented, Jun 29, 2020

I ran into this issue switching to SummernoteInplaceWidget with crispy forms. The passed csrfmiddlewaretoken is set to null when I tried to upload a file.

(django-summernote==0.8.11)