How to Solve Cross-Origin Issues with CORS Instead of JSONP

Cross‑origin requests are a common problem in frontend development, and many developers resort to JSONP.

JSONP is easy to use—once the frontend and backend agree on a callback function name, data can be fetched—but it only works with GET requests and is inconvenient for public APIs.

For example, calling Baidu’s weather API with jQuery:

var api = 'http://apis.baidu.com/heweather/weather/free?city=beijing';
$.get(api, function (data) {
    alert(data);
});

This request succeeds without any special handling because the server already supports CORS.

The solution is to enable CORS (Cross‑Origin Resource Sharing) on the server by adding the Access-Control-Allow-Origin response header.

To allow any origin: Access-Control-Allow-Origin: * To restrict to a specific domain: Access-Control-Allow-Origin: http://www.a.com In PHP you can set it with: header('Access-Control-Allow-Origin: *'); Note: CORS is widely supported by modern browsers, and even IE8 has partial support, but you should test thoroughly for compatibility.