ZipCodeAPI CORS Issues
Many users start with ZipCodeAPI and want to test against their local server and immediately hit a snag.
They send us questions similar to the following:
- I am trying to test using this application to see if it will suffice for our needs. I have created an application, but it is only local. When I activate the client side API key it requests a domain. What should I use for local host?
- I am making distance api call from javascript but getting:”Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://www.zipcodeapi.com/rest/[KEY]/distance.json/06520/06534/mile. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).”
- Is it possible to allow adding source http://locahost:5999 (or some other port number) to the CORS list to allow me to test in development environment?
What is CORS and the Solution
CORS is cross-origin resource sharing and helps control what sources are allowed to access resources in an application.
CORS requires that you add domains to an allow list.
This is done to protect you so that other websites do not steal your API and consume your API request quota.
Here are the steps to resolve to get everything working:
- Go to App Management, login if needed, and select the app to manage.
- Click the Client Side Access Setup link.
- Enter the domains allowed. For example, use
localhost
for local testing or your website address for public websites (do NOT include https://
).
- Save the page.
- When making API calls in JavaScript from one of those domains, use the client key (starts with
js-
) in the API request URL.