0

I am having an issue when trying to .load() my navigation with jQuery and using absolute URLs.

If I type my URL using this prefix: 'http://www. [ABSOLUTE URL HERE]' then my absolute URL in my jQuery must contain the exact same prefix. If I then type prefix my URL with 'http:// [ABSOLUTE URL HERE]' I get the following error:

XMLHttpRequest cannot load [ABSOLUTE URL HERE] /imports/layout/nav.html. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '[ABSOLUTE URL HERE]' is therefore not allowed access.

This also happens in the converse situation. if I alter the absolute URL path in my jQuery.

My code with absolute URL:

$(document).ready(function() {
  $('#nav').load(' [ABSOLUTE-URL-HERE] /imports/layout/nav.html');
});

I have since altered my code to use a relative URL like so:

$(document).ready(function() {
  $('#nav').load('../../imports/layout/nav.html');
});

This works without an issue. But for consistency I would like to use absolute URLs.

Why is this issue occurring? How do I resolve it?

DanMad
  • 1,643
  • 4
  • 23
  • 58
  • 1
    Possible duplicate of ["No 'Access-Control-Allow-Origin' header is present on the requested resource"](http://stackoverflow.com/questions/20035101/no-access-control-allow-origin-header-is-present-on-the-requested-resource) – Guruprasad J Rao Feb 21 '17 at 03:46

1 Answers1

0

It seems like you are creating a cross origin request. That you cannot access if server do not allows you.

Vikram Singh
  • 924
  • 1
  • 9
  • 23