{"id":1445,"date":"2014-06-13T12:05:44","date_gmt":"2014-06-13T20:05:44","guid":{"rendered":"http:\/\/chriscarey.com\/?p=1445"},"modified":"2015-11-11T10:53:32","modified_gmt":"2015-11-11T18:53:32","slug":"apache-proxy-with-cors-headers","status":"publish","type":"post","link":"https:\/\/chriscarey.com\/blog\/2014\/06\/13\/apache-proxy-with-cors-headers\/","title":{"rendered":"Apache Proxy with CORS headers"},"content":{"rendered":"<p>You want to have your JavaScript application access a remote API but that remote API does not have CORS headers. What to do?<\/p>\n<p>Instead of pointing to that remote API, point to a location on an Apache server that you have control of, have it connect to that remote API for you, and also add the CORS headers so JavaScript is happy.<\/p>\n<p>Apache can proxy, or hand off the API request for you while also injecting the CORS header Access-Control-Allow-Origin to that remote API response.<\/p>\n<p>Requirements:<br \/>\nApache mod_proxy<br \/>\nApache mod_headers<\/p>\n<div class=\"codecolorer-container text blackboard\" style=\"overflow:auto;white-space:nowrap;width:565px;\"><div class=\"text codecolorer\"># Proxy for BaseServer<br \/>\n&lt;LocationMatch &quot;\/api&quot;&gt;<br \/>\n&nbsp; &nbsp;ProxyPass http:\/\/remote-server.com:8000\/api\/<br \/>\n&nbsp; &nbsp;Header add &quot;Access-Control-Allow-Origin&quot; &quot;*&quot;<br \/>\n&lt;\/LocationMatch&gt;<\/div><\/div>\n<p>Now instead of pointing my JavaScript to http:\/\/remote-server.com:8000\/api\/, I point it to my Apache server at \/api\/ and that will serve the data from http:\/\/remote-server.com:8000\/api\/ with the CORS header.<\/p>\n<p><a href=\"http:\/\/enable-cors.org\/server_apache.html\" target=\"_blank\">http:\/\/enable-cors.org\/server_apache.html<\/a><\/p>\n<p>If you are using mod_rewrite along with this, you might need the [P] flag which tells mod_rewrite to handle the request with mod_proxy.<\/p>\n<p><a href=\"https:\/\/httpd.apache.org\/docs\/2.4\/rewrite\/flags.html\" target=\"_blank\">https:\/\/httpd.apache.org\/docs\/2.4\/rewrite\/flags.html<\/a><\/p>\n","protected":false},"excerpt":{"rendered":"<p>You want to have your JavaScript application access a remote API but that remote API does not have CORS headers. What to do? Instead of pointing to that remote API, point to a location on an Apache server that you have control of, have it connect to that remote API for you, and also add [&hellip;]<\/p>\n","protected":false},"author":2,"featured_media":0,"comment_status":"open","ping_status":"open","sticky":false,"template":"","format":"standard","meta":{"jetpack_post_was_ever_published":false,"_jetpack_newsletter_access":"","_jetpack_dont_email_post_to_subs":false,"_jetpack_newsletter_tier_id":0,"_jetpack_memberships_contains_paywalled_content":false,"_jetpack_memberships_contains_paid_content":false,"footnotes":"","jetpack_publicize_message":"","jetpack_publicize_feature_enabled":true,"jetpack_social_post_already_shared":true,"jetpack_social_options":{"image_generator_settings":{"template":"highway","default_image_id":0,"font":"","enabled":false},"version":2}},"categories":[10,51],"tags":[],"class_list":["post-1445","post","type-post","status-publish","format-standard","hentry","category-development","category-javascript"],"jetpack_publicize_connections":[],"jetpack_featured_media_url":"","jetpack_shortlink":"https:\/\/wp.me\/prpYG-nj","jetpack_sharing_enabled":true,"jetpack_likes_enabled":true,"_links":{"self":[{"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/posts\/1445","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/posts"}],"about":[{"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/types\/post"}],"author":[{"embeddable":true,"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/users\/2"}],"replies":[{"embeddable":true,"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/comments?post=1445"}],"version-history":[{"count":5,"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/posts\/1445\/revisions"}],"predecessor-version":[{"id":1649,"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/posts\/1445\/revisions\/1649"}],"wp:attachment":[{"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/media?parent=1445"}],"wp:term":[{"taxonomy":"category","embeddable":true,"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/categories?post=1445"},{"taxonomy":"post_tag","embeddable":true,"href":"https:\/\/chriscarey.com\/blog\/wp-json\/wp\/v2\/tags?post=1445"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}