Wednesday, July 8, 2015

Ajax to get URL and image metadata

var a = $.get('http://www.msn.com')
Mixed Content: The page at 'https://www.example.com' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://www.msn.com/'. This request has been blocked; the content must be served over HTTPS.

Limitation 1: https cannot load http (tested on Chrome)

var a = $.get('http://www.msn.com')
var div = document.createElement('div');
div.innerHTML = a.responseText
$(div).find('title')
$(div).find('meta[name="description"]').attr("content")


$.ajax('https://en.wikipedia.org/')
XMLHttpRequest cannot load https://en.wikipedia.org/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://www.example.com' is therefore not allowed access.
Limitation 2: Cross origin limit unless target domain supports CORS.

var result = $.ajax({
type: 'HEAD',
async: true,
url: 'https://www.photo.com/images/github.jpg'
}).done(function(data, status, xhr){console.log(status)});

XMLHttpRequest cannot load https://www.photo.com/images/github.jpg. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https://www.example.com' is therefore not allowed access.

Same origin, HTTP HEAD to get metadata, or target domain supports CORS.

var result = $.ajax({
type: 'HEAD',
async: true,
url: 'https://www.example.com/images/test/github.jpg'
}).done(function(data, status, xhr){console.log(status)});

result.getAllResponseHeaders()
"Date: Thu, 09 Jul 2015 00:59:08 GMT
Last-Modified: Mon, 03 Nov 2014 06:06:16 GMT
Server: nginx/1.0.15
Accept-Ranges: bytes
Content-Length: 6804
Content-Type: image/jpeg

result.getResponseHeader('Content-Type')
"image/jpeg"

No comments:

Post a Comment