Avoiding No 'Access-Control-Allow-Origin' header is present on the requested resource

I had developed a simple json api. There I used

java as the programming language
jersy for REST implementation
Apache Tomcat 7 for container
Apache2 to redirect requests to Tomcat 7

When I do a curl as "curl http://my-domain/my-app/url" it worked fine and produced me desired results.

Then I developed the front-end of the app and hosted it in a separate server. Now, my api and the client app are hosted in two different servers. I used jQuery to access the api and get the required data from it. But when I do it , this is all I got :(

No 'Access-Control-Allow-Origin' header is present on the requested resource

Same as you, I googled :D found out that this happens because of the same origin policy. In a nutshell, same origin policy prevents JavaScript from making requests across domains. In my case , the api and the app were in two separate domains and there you have it :)

To avoid this add this lines to <CATALINA_HOME>/conf/web.xml

<filter>
  <filter-name>CorsFilter</filter-name>
  <filter-class>org.apache.catalina.filters.CorsFilter</filter-class>
</filter>
<filter-mapping>
  <filter-name>CorsFilter</filter-name>
  <url-pattern>/*</url-pattern>
</filter-mapping>

We do this because we only use Apache2 to redirect request purpose.

Restart Tomcat then you are good to go !!!