CODEWITHSUNDEEP
javascriptc#jqueryhtmlasp.net
Dheeraj
Dheeraj

Reputation: 979

Refused to load the script 'https://cdnjs.cloudflare.com/ajax/libs/jquery-csv/0.71/jquery.csv-0.71.min.js'

net.I am using jQuery to perform some operation.When i deploy my code onto local, it's working fine. But when I deploy my same code into the live server.Then a error is coming in console that:

Refused to load the script 'https://cdnjs.cloudflare.com/ajax/libs/jquery-csv/0.71/jquery.csv-0.71.min.js' because it violates the following Content Security Policy directive: "script-src 'self' 'unsafe-inline'".

Please check my html code for refrence-:

<html>
<head>
    <title>Notifications</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1" />
    <link type="text/css" rel="stylesheet" href="./Content/bootstrap.min.css" />
    <link type="text/css" rel="stylesheet" href="./Content/style.css" />


    <script type="text/javascript" src="./Scripts/jquery-1.10.2.min.js"></script>
    <script type="text/javascript" src="./Scripts/bootstrap.min.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-csv/0.71/jquery.csv-0.71.min.js"></script>
</head>
<body>

    <h2>Send</h2>

    <div>
        <textarea id="text_message" rows="12" cols="100" placeholder="Please Type Your Message"></textarea>


        <div style="margin: 5px">

            <input type="button" value="Submit" onclick="sendPush()" />
        </div>
        <div class="loadermodal" style="display: none">
            <div class="center">
                <img alt="" src="./Content/img/ajax-loader.gif" />
            </div>
        </div>
    </div>

    <script>
        function sendMessage() {

            var comment = $.trim($("#text_message").val());
            if (comment != "") {
                // Show alert dialog if value is not blank
                //  alert(comment);
                $(".loadermodal").show();
                $.post("/PushNotification/sendPushNotificationToAll", { 'message': comment }).done(function (data) {
                    var obj = jQuery.parseJSON(data);
                    if (obj.success != "0") {
                        alert("Message Sent Successfully");
                        $(".loadermodal").hide();
                    }
                        else
                        alert("Error in Sending Push");
                });
            }
            else {

                alert("Enter Some Text To Send A Message");

            }
        }



    </script>

</body>

Here, in this code i have created a simple textbox to write the message and a button which will execute the script.This script is working fine in my local,but when i deploy this same code into my application server then this type of error is coming in console.

Please share your views for this problrm

Thanks

Upvotes: 3

Views: 8619

Answers (2)

MD Ismail
MD Ismail

Reputation: 1

Check my HTML code for reference:

Notifications

<script type="text/javascript" src="./Scripts/jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="./Scripts/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery-csv/0.71/jquery.csv-0.71.min.js"></script>
<h2>Send</h2>

<div>
    <textarea id="text_message" rows="12" cols="100" placeholder="Please Type Your Message"></textarea>


    <div style="margin: 5px">

        <input type="button" value="Submit" onclick="sendPush()" />
    </div>
    <div class="loadermodal" style="display: none">
        <div class="center">
            <img alt="" src="./Content/img/ajax-loader.gif" />
        </div>
    </div>
</div>

<script>
    function sendMessage() {

        var comment = $.trim($("#text_message").val());
        if (comment != "") {
            // Show alert dialog if value is not blank
            //  alert(comment);
            $(".loadermodal").show();
            $.post("/PushNotification/sendPushNotificationToAll", { 'message': comment }).done(function (data) {
                var obj = jQuery.parseJSON(data);
                if (obj.success != "0") {
                    alert("Message Sent Successfully");
                    $(".loadermodal").hide();
                }
                    else
                    alert("Error in Sending Push");
            });
        }
        else {

            alert("Enter Some Text To Send A Message");

        }
    }

</script>

Upvotes: -2

Phillip Thomas
Phillip Thomas

Reputation: 1479

The easiest and more reliable method of solving this error is copying the source from the url to your /Scripts/ directory and referencing the file using:

<script type="text/javascript" src="./Scripts/jquery.csv-0.71.min.js"></script>

Looks like you are already doing this with the jQuery and bootstrap files. This method allows you to keep all the dependencies in your repository at the version necessary.

Aside from that, this error is to prevent your web server from loading potentially malicious scripts from a location you do not maintain. Most web servers have settings to allow this, but they are initially disabled (for good reason).

That being said, I would still suggest downloading the source and including in your project.

Upvotes: 1

Related Questions