MIME type ('text/html') is not executable, and strict MIME type checking is enabled in DJANGO PYTHON

So I have a Django Projects, the localhost server is running, but there are few things missing in the frontend and it throws error like this:

Refused to apply style from 'https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js' because its MIME type ('application/javascript') is not a supported stylesheet MIME type, and strict MIME checking is enabled. 127.0.0.1/:1

GET http://127.0.0.1:8000/... net::ERR_ABORTED 404 (Not Found) 127.0.0.1/:45

Refused to execute script from 'http://127.0.0.1:8000/...' because its MIME type ('text/html') is not executable, and strict MIME type checking is enabled.  127.0.0.1/:1

I think the error is in the navbar component because the div with class "nav_list" isn't showing. nav.html

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
    integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
    <link rel="stylesheet" href="/static/css/nav.css" />
    <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/boxicons@latest/css/boxicons.min.css" />
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.9.4/Chart.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/Chart.js/2.7.2/Chart.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
    <script src="https://cdn.jsdelivr.net/npm/chartjs-plugin-datalabels@0.7.0"></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.min.js" integrity="sha384-Atwg2Pkwv9vp0ygtn1JAojH0nYbwNJLPhwyoVbhoPwBhjQPR5VtM2+xf0Uwh9KtT" crossorigin="anonymous"></script>
    <link href="https://cdn.jsdelivr.net/npm/bootstrap@5.0.0/dist/css/bootstrap.min.css" rel="stylesheet" >
    <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.9.2/dist/umd/popper.min.js" ></script>
    <script src="https://cdn.jsdelivr.net/npm/bootstrap@5.0.1/dist/js/bootstrap.min.js" integrity="sha384-Atwg2Pkwv9vp0ygtn1JAojH0nYbwNJLPhwyoVbhoPwBhjQPR5VtM2+xf0Uwh9KtT" crossorigin="anonymous"></script>
</head>
<body id="body-pd">
    {% if user.is_authenticated%}
    <header class="header" id="header">
        <div class="header_toggle"> <i class='bx bx-menu' id="header-toggle"></i> </div>
        <div class="dropdown">
            <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
              {{user}}
            </button>
            <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
                <li><a class="dropdown-item" href="{%url 'logout'%}">Logout<i class='bx bx-arrow-from-left bx-flip-vertical  nav_logo-icon' style="float: right"></i></a></li>
              </ul>
          </div>
    </header>
    <div class="l-navbar" id="nav-bar">
        <nav class="nav">
            <div> <a href="#" class="nav_logo"> <i class='bx bx-layer nav_logo-icon'></i> <span
                        class="nav_logo-name">MDN</span> </a>
                <div class="nav_list">
                    {% if user.groups.all.0.name == "User" %}
                    <a href="{%url 'index'%}" class="nav_link"> <i class='bx bx-home-alt nav_icon'></i><span class="nav_name">Home</span> </a>
                    <a href="{%url 'catalogue'%}" class="nav_link"> <i class='bx bx-package nav_icon'></i> <span class="nav_name">Catalog</span> </a>
                    <a href="{%url 'budgetUser'%}"  class="nav_link"> <i class='bx bx-file nav_icon'></i> <span
                        class="nav_name">Budget</span> </a>
                    <a href="{%url 'ProfileUser'%}" class="nav_link"> <i class='bx  bx-user nav_icon'></i> <span
                        class="nav_name">Profile</span> </a>
                    {%endif%}
                    {% if user.groups.all.0.name == "Admin" %}
                    <a href="{%url 'index'%}" class="nav_link"> <i class='bx bx-home-alt nav_icon'></i><span class="nav_name">Home</span> </a>
                    <a href="{%url 'catalogue'%}" class="nav_link"> <i class='bx bx-package nav_icon'></i> <span class="nav_name">Catalog</span> </a>
                    <a href="{%url 'budgetAdmin'%}"  class="nav_link"> <i class='bx bx-file nav_icon'></i> <span
                        class="nav_name">Budget</span> </a>
                    <a href="{%url 'manageUser'%}" class="nav_link"> <i class='bx  bx-user nav_icon'></i> <span
                        class="nav_name">User</span> </a>
                    <a href="{%url 'analyticAndStatistic'%}" class="nav_link"> <i class='bx  bx-stats nav_icon'></i> <span
                        class="nav_name">Analytics & Statistics</span> </a>
                    {%endif%}
                </div>
            </nav>
        </div>
    </header>
    {%else%}
    <header class="header" id="header">
        <div class="header_toggle"> <i class='bx bx-menu' id="header-toggle"></i> </div>
        <div class="dropdown">
            <button class="btn btn-secondary dropdown-toggle" type="button" id="dropdownMenuButton1" data-bs-toggle="dropdown" aria-expanded="false">
              Login Now
            </button>
            <ul class="dropdown-menu" aria-labelledby="dropdownMenuButton1">
                <li><a class="dropdown-item" href="{%url 'login'%}">Login<i class='bx bx-arrow-from-left bx-flip-vertical  nav_logo-icon' style="float: right"></i></a></li>
              </ul>
          </div>
    </header>
    <div class="l-navbar" id="nav-bar">
        <nav class="nav">
            <div> <a href="#" class="nav_logo"> <i class='bx bx-layer nav_logo-icon'></i> <span
                        class="nav_logo-name">MDN</span> </a>
                <div class="nav_list">
                    <a href="{%url 'index'%}" class="nav_link active"> <i class='bx bx-grid-alt nav_icon'></i>
                        <span class="nav_name">HOME</span> </a>s
                </div>
        </nav>
    </div>
    {%endif%}
    <script src="/static/js/nav.js"></script>
    <script src=...> </script> 
</body>

navAdmin.html

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
        integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/boxicons@latest/css/boxicons.min.css" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
        integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
    <title>Document</title>
    <link rel="stylesheet" href="/static/css/nav.css" />
</head>

<body id="body-pd">
    <header class="header" id="header">
        <div class="header_toggle"> <i class='bx bx-menu' id="header-toggle"></i> </div>
        <a href="{% url "logout" %}?next=/">logout</a>
    </header>
    <div class="l-navbar" id="nav-bar">
        <nav class="nav">
            <div> <a href="#" class="nav_logo"> <i class='bx bx-layer nav_logo-icon'></i> <span
                        class="nav_logo-name">MDN</span> </a>
                <div class="nav_list">
                    <a href="{%url 'indexAdmin'%}" class="nav_link"> <i class='bx bx-grid-alt nav_icon'></i>
                        <span class="nav_name">HOME</span> </a>
                    <a href="{%url 'catalogue'%}" class="nav_link"> <i class='bx bx-user nav_icon'></i> <span
                            class="nav_name">CATALOGUE</span> </a>
                    <a href="{%url 'budgetUser'%}"  class="nav_link"> <i class='bx bx-message-square-detail nav_icon'></i> <span
                            class="nav_name">BUDGET</span> </a>
                    <a href="{%url 'manageUser'%}" class="nav_link"> <i class='bx bx-bookmark nav_icon'></i> <span
                            class="nav_name">USER</span> </a>
                </div>
        </nav>
    </div>
    <!--Container Main end-->
    <script src="/static/js/nav.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</body>

navUser.html

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
        integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/boxicons@latest/css/boxicons.min.css" />
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/npm/bootstrap@5.2.3/dist/css/bootstrap.min.css"
        integrity="sha384-rbsA2VBKQhggwzxH7pPCaAqO46MgnOM80zW1RWuH61DGLwZJEdK2Kadq2F9CUG65" crossorigin="anonymous">
    <link rel="stylesheet" href="/static/css/nav.css" />
</head>

<body id="body-pd">
    <header class="header" id="header">
        <div class="header_toggle"> <i class='bx bx-menu' id="header-toggle"></i> </div>
        <a href="login/" class="btn btn-info" role="button">Login</a>
    </header>
    <div class="l-navbar" id="nav-bar">
        <nav class="nav">
            <div> <a href="#" class="nav_logo"> <i class='bx bx-layer nav_logo-icon'></i> <span
                        class="nav_logo-name">MDN</span> </a>
                <div class="nav_list">
                    <a href="{%url 'indexUser'%}" class="nav_link"> <i class='bx bx-grid-alt nav_icon'></i>
                        <span class="nav_name">HOME</span> </a>
                    <a href="{%url 'catalogue'%}" class="nav_link"> <i class='bx bx-user nav_icon'></i> <span
                            class="nav_name">CATALOGUE</span> </a>
                    <a href="{%url 'budgetUser'%}"  class="nav_link"> <i class='bx bx-message-square-detail nav_icon'></i> <span
                            class="nav_name">BUDGET</span> </a>
                    <a href="{%url 'ProfileUser'%}" class="nav_link"> <i class='bx bx-bookmark nav_icon'></i> <span
                            class="nav_name">PROFILE</span> </a>
                </div>
        </nav>
    </div>
    <script src="/static/js/nav.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script>
</body>

I tried to copy paste the jquery and it shows the jquery scripts. How do I fix this?

MIME type ('text/html') is not executable, and strict MIME type checking is enabled in DJANGO PYTHON

1条答案

相关问题

热门标签

最新问答