'Datatables not working in PUG ,net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200

I converted my admin.html page into admin.pug to render it through nodejs application. The databtable worked fine in HTML format.But when I converted it into pug it started giving this error.The cdn of datatable is not working properly due to which datable is giving error in js. Following is my pug code


    html(lang="en") 
      head
        meta(charset="utf-8")
        meta(name="viewport", content="width=device-width,initial-scale=1,shrink-to-fit=no")
        title Admin | RDX 360
        //  Table Css 
        link(rel="stylesheet", href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css")
        link(rel="stylesheet", href="https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css")
        link(rel="stylesheet", href="https://cdn.datatables.net/buttons/1.2.2/css/buttons.bootstrap.min.css")
        link(rel="stylesheet", href="css/admin.css")
      
      body
        .text-center(style="margin-top: 3rem ; margin-bottom: 5rem;")
          img(src="img/radium black.png", style="width: 250px;", alt)
        .show_table
          table#binance_table.table.table-striped.table-bordered.display.table-dark.inner_table(cellspacing="0", width="100%")
            thead
              tr
                th.headings.px-3 id
                th.headings.px-3 wallet_address
                th.headings.px-3 coins
                th.headings.px-3 rewards
                th.headings.px-3 reffered_count
                th.headings.px-3 reffered_id
                th.headings.px-3 refrence_link
            tfoot
              tr
                th.headings.px-3 id
                th.headings.px-3 wallet_address
                th.headings.px-3 coins
                th.headings.px-3 rewards
                th.headings.px-3 reffered_count
                th.headings.px-3 reffered_id
                th.headings.px-3 refrence_link
        //  Table JS 
        script(src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js")
        script(src="https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js")
        script(src="https://cdn.datatables.net/buttons/1.2.2/js/dataTables.buttons.min.js")
        script(src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.colVis.min.js")
        script(src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js")
        script(src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.print.min.js")
        script(src="https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js")
        script(src="https://cdn.datatables.net/buttons/1.2.2/js/buttons.bootstrap.min.js")
        script(src="https://cdnjs.cloudflare.com/ajax/libs/jszip/2.5.0/jszip.min.js")
        script(src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/vfs_fonts.js")
        script(src="https://cdn.rawgit.com/bpampuch/pdfmake/0.1.18/build/pdfmake.min.js")
        script(src="js/admin.js")

    $(document).ready(function() {
        //Only needed for the filename of export files.
        //Normally set in the title tag of your page.
        // DataTable initialisation
        $('#binance_table').DataTable(
            {
                "dom": '<"dt-buttons"Bf><"clear">lirtp',
                "paging": true,
          "autoWidth": false, 
          "columnDefs": [
            { "width": "65px", "targets": 0 },
            { "width": "65px", "targets": 1 },
            { "width": "15px", "targets": 2 },
            { "width": "15px", "targets": 3 },
            { "width": "30px", "targets": 4 },
            { "width": "70px", "targets": 5 },
            { "width": "70px", "targets": 6 }
          ],
                "buttons": [
                    'colvis',
                    'copyHtml5',
            'csvHtml5',
                    'excelHtml5',
                    'print'
                ]
          , 
        "ajax": {
          "url": "http://127.0.0.1:3000/api/v1/users",
          "type": "GET"
        },
        
            }
        );
    });

Error Details

    GET https://cdn.datatables.net/1.10.12/css/dataTables.bootstrap.min.css net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200
    dashboard:1 GET https://cdn.datatables.net/buttons/1.2.2/css/buttons.bootstrap.min.css net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200
    dashboard:1 GET https://cdn.datatables.net/1.10.12/js/jquery.dataTables.min.js net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200
    dashboard:1 GET https://cdn.datatables.net/buttons/1.2.2/js/dataTables.buttons.min.js net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200
    dashboard:1 GET https://cdn.datatables.net/buttons/1.2.2/js/buttons.colVis.min.js net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200
    dashboard:1 GET https://cdn.datatables.net/buttons/1.2.2/js/buttons.html5.min.js net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200
    dashboard:1 GET https://cdn.datatables.net/buttons/1.2.2/js/buttons.print.min.js net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200
    dashboard:1 GET https://cdn.datatables.net/1.10.12/js/dataTables.bootstrap.min.js net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200
    dashboard:1 GET https://cdn.datatables.net/buttons/1.2.2/js/buttons.bootstrap.min.js net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200
    jquery.min.js:2 jQuery.Deferred exception: $(...).DataTable is not a function TypeError: $(...).DataTable is not a function
        at HTMLDocument.<anonymous> (http://localhost:3000/js/admin.js:5:22)
        at j (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29568)
        at k (https://cdnjs.cloudflare.com/ajax/libs/jquery/3.1.0/jquery.min.js:2:29882) undefined
    r.Deferred.exceptionHook @ jquery.min.js:2
    k @ jquery.min.js:2
    setTimeout (async)
    (anonymous) @ jquery.min.js:2
    i @ jquery.min.js:2
    fireWith @ jquery.min.js:2
    fire @ jquery.min.js:2
    i @ jquery.min.js:2
    fireWith @ jquery.min.js:2
    ready @ jquery.min.js:2
    R @ jquery.min.js:2
    jquery.min.js:2 Uncaught TypeError: $(...).DataTable is not a function
        at HTMLDocument.<anonymous> (admin.js:5:22)
        at j (jquery.min.js:2:29568)
        at k (jquery.min.js:2:29882)
    (anonymous) @ admin.js:5
    j @ jquery.min.js:2
    k @ jquery.min.js:2
    setTimeout (async)
    r.readyException @ jquery.min.js:2
    (anonymous) @ jquery.min.js:2
    j @ jquery.min.js:2
    k @ jquery.min.js:2
    setTimeout (async)
    (anonymous) @ jquery.min.js:2
    i @ jquery.min.js:2
    fireWith @ jquery.min.js:2
    fire @ jquery.min.js:2
    i @ jquery.min.js:2
    fireWith @ jquery.min.js:2
    k @ jquery.min.js:2
    setTimeout (async)
    (anonymous) @ jquery.min.js:2
    i @ jquery.min.js:2
    fireWith @ jquery.min.js:2
    fire @ jquery.min.js:2
    i @ jquery.min.js:2
    fireWith @ jquery.min.js:2
    ready @ jquery.min.js:2
    R @ jquery.min.js:2

Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution	Source

'Datatables not working in PUG ,net::ERR_BLOCKED_BY_RESPONSE.NotSameOriginAfterDefaultedToSameOriginByCoep 200

Sources

Related Questions