html - No 'Access-Control-Allow-Origin' when serving javascript file to external sites -
my site provides javascript file users can include in site. javascript file in-turn calls applications endpoint , fetches content inputted users' div
this code js
(function(){ $(document).ready(function(){ var test = $('#foobar'); var id = test.data('id'); $.get('http://example.com/serve/'+id, function(data){ test.html(data); }); }); })(); but when user references js file on own site, following error:
xmlhttprequest cannot load http://example.com/serve/qefz7tvglg. no 'access-control-allow-origin' header present on requested resource. origin 'http://localhost:8000' therefore not allowed access.
this sample html created test
<!doctype html> <html> <body> <div id="foobar" data-id="qefz7tvglg"></div> <script src="https://code.jquery.com/jquery-2.2.0.min.js"></script> <script src="http://example.com/scripts/myjsfile.js"></script> </body> </html>
your server needs specify access-control-allow-origin header (probably *, means "all"). called cors.
to give naive example, here's how might in node.js:
app.use(function(req, res, next) { res.header("access-control-allow-origin", "*"); edit
since server in grails, check out this question how enable cors.
Comments
Post a Comment