Cross origin requests are only supported

Question

When I click the link in the code bellow:

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>

<div id="modal_open" class="modal fade" role="document">
    <div class="modal-dialog custom-modal-size">
        <div class="modal-content">
            text
        </div>
    </div>
</div>

<a href="javascript:void(0);" data-toggle="modal" data-target="#modal_open" ng-controller="ModalDemoCtrl">link</a>

I get a jquery.min.js:4 XMLHttpRequest cannot load javascript:void(0);. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource. message if I have open the chrome debugger. While the code works as expected, I am trying to understand why I get this message. Can someone please explain?

Retry after setting up HTTP XSS Header. To know more : http://stackoverflow.com/questions/9090577/what-is-the-http-header-x-xss-protection — Hari Harker, Aug 23 '16 at 15:07
@Hari Harker Thanks for teh help! I added the following PHP line: `header("X-XSS-Protection: 0");` but I still get the error. — MATH000, Aug 23 '16 at 15:09
_“XMLHttpRequest cannot load javascript:void(0)”_ – your script/system thinks that `javascript:void(0)` is an actual URL it should load via an AJAX request, which makes no sense whatsoever of course. Question is, what is that doing there in the first place? — CBroe, Aug 23 '16 at 15:13

Trevor Nestman · Accepted Answer · 2016-08-23T15:16:39.097

9

In your link tag you have href="javascript:void(0);" which is throwing the error. If you remove that, the error is gone.

<head>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
    <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
    <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">
</head>

<div id="modal_open" class="modal fade" role="document">
    <div class="modal-dialog custom-modal-size">
        <div class="modal-content">
            text
        </div>
    </div>
</div>

<a data-toggle="modal" data-target="#modal_open" ng-controller="ModalDemoCtrl">link</a>

edited Aug 23 '16 at 15:16

answered Aug 23 '16 at 15:13

Trevor Nestman

2,456
19
26

3

Thanks! What I should put in place of `javascript:void(0);` ? – MATH000 Aug 23 '16 at 15:14
I just posted what it does without it. Is there something else you're wanting it to do? – Trevor Nestman Aug 23 '16 at 15:17
The problem with this solution is that if you need tabbing into the link (accessibility standards call for this) then removing the `href` attribute breaks that. I would suggest using `href="#"` and following @irfandar's answer. – maxshuty Mar 10 '20 at 19:51

score 6 · Answer 2 · answered Nov 03 '18 at 08:27

You can set href to # and onclick to event.preventDefault() or return false to achieve same thing like this

<a href="#" onclick="return false;" data-toggle="modal" data-target="#modal_open" ng-controller="ModalDemoCtrl">link</a>

OR

<a href="#" onclick="event.preventDefault()" data-toggle="modal" data-target="#modal_open" ng-controller="ModalDemoCtrl">link</a>

score 2 · Answer 3 · answered Nov 18 '16 at 16:05

2

href="javascript:void(0);"

is causing it

answered Nov 18 '16 at 16:05

qwertzman

784
1
9
23

Sry didn't see someone already posted the correct answer. It didnt get accepted. for shame. – qwertzman Nov 18 '16 at 16:06

score 1 · Answer 4 · answered Aug 23 '16 at 15:06

1

Do you use Chrome and opened the html-script from your filesystem?

Firefox or a webserver shoud fix this cross origin Problem.

answered Aug 23 '16 at 15:06

Marc Anyone

19
4

Thanks for the help! I am running this on localhost. – MATH000 Aug 23 '16 at 15:07

Cross origin requests are only supported

4 Answers4