CODEWITHSUNDEEP
jqueryruby-on-railsrubyruby-on-rails-3ruby-on-rails-4
techdreams
techdreams

Reputation: 5585

Display content of another website on my page using jquery without using iframe in Rails

I have made a webpage on my site which will be embedded on another site using jquery. I have to provide jquery code so as when we hit the url from some another site in which my webpage is embedded , my contents of are loaded on page load. I cannot use iframe . I have used .html , .load , .ajax but they always through the error

XMLHttpRequest cannot load http://mypage.com/index?user_id=82. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'localserver:port' is therefore not allowed access.

Is there a problem with mypage settings

I have checked these:

$('#siteloader').load('http://mypage.com/index?user_id=82');
$("#siteloader").html('<object data="http://mypage.com/index?user_id=82">');

Please suggest

Upvotes: 6

Views: 1078

Answers (2)

techdreams
techdreams

Reputation: 5585

Thanks guys @Rory McCrossan @Mohammed ElSayed This is how I enabled CORS settings in Rails 4 Inside my application_controller

after_filter :cors_set_access_control_headers

def cors_set_access_control_headers
 headers['Access-Control-Allow-Origin'] = '*'
 headers['Access-Control-Allow-Methods'] = 'POST, PUT, DELETE, GET, OPTIONS'
 headers['Access-Control-Request-Method'] = '*'
 headers['Access-Control-Allow-Headers'] = 'Origin, X-Requested-With, Content-Type, Accept, Authorization'
end

Upvotes: 5

Mohammed Swillam
Mohammed Swillam

Reputation: 9242

the error message is not actually an error, it's by design so no one can load others content without proper permission.

you will need to enable CORS requests for the website that you are calling.

for IIS7:

consider the following snippet (web.config)

 <system.webServer>
   <httpProtocol>
     <customHeaders>
       <add name="Access-Control-Allow-Origin" value="*" />
     </customHeaders>
   </httpProtocol>
 </system.webServer>

Apache server (.htaccess):

Header set Access-Control-Allow-Origin "*"

checkout this link for more information: http://enable-cors.org/server.html

Upvotes: 2

Related Questions