# Javascript - Cross Site AJAX

## Lesson Objectives

1. Explain Cross Site AJAX
1. Explain CORS
1. Explain Proxy Server
1. Explain JSONP

## Explain Cross Site AJAX

By default it's considered insecure to make an AJAX request to a different site
```javascript
$http({
    method: 'GET',
	url: 'https://status.github.com/api/status.json',
}).then(
    function(response){

    },
    function(response){

    }
);
```

## Explain CORS

- new way of doing this
- in headers of html, server decides who can access this data
- if correct headers are present, browser knows it's secure to view the data
    1. http://www.omdbapi.com/?s=pirates&r=json
    1. `Access-Control-Allow-Origin:*`

## Explain Proxy Server

- have your sever make a request to the foreign API and then return the results
- you can then hit your own API and it will be the same origin

## Explain JSONP

- old way of getting around this
- add a script tag to the service
- pass your custom callback function in as a GET param
- inside other site's script tag, it calls your function and passes in its data
```html
<!-- Request sent via a script tag -->
<script src="https://status.github.com/api/status.json?callback=apiStatus"></script>
<!-- Data received during execution of this predefined function. -->
<script> function apiStatus(data) { console.log(data); } </script>
```