Develop Reference

How to make an HTTP request inside the DOM of Puppeteer via evaluate?

How can I make a loaded page of Puppeteer make a request and return the result?
I tried this which does not work, and I have no idea why:
var result = await page.evaluate(() => {
return new Promise(resolve => {
var xhr = new XMLHttpRequest();
var xhrto = setTimeout( function(){
xhr.abort();
resolve('ErrTimeout');
}, 8000);
xhr.onload = function(){
clearTimeout(xhrto);
if( xhr.status == 200 ){
resolve(xhr.responseText);
}else{
resolve('ErrStatus:'+xhr.status);
}
};
xhr.onerror = function(){
resolve('Err');
};
xhr.open('GET', 'http://www.robotstxt.org/robots.txt', true);
xhr.send();
});
});
I always get 'Err' which means onerror is called.
Is there anything in Puppeteer/Chrome that prevents something outside of the page from making a request?
NOTE: for many reasons I must make the request from within the page.
EDIT: It definitely has to do with cross-domain and SSL issues because when I use HTTPS with --disable-web-security it works. But with HTTP it doesn't, even with all these:
--disable-web-security --allow-running-insecure-content --unsafely-treat-insecure-origin-as-secure=http://example.com --user-data-dir=/root/chromeusertest

IE 11 Responds with "405 Not Allowed" to XMLHttpRequest

I have the following AJAX request that is running successfully for all browsers on our site but returning a 405 for IE 11. I noticed here: http://caniuse.com/#feat=xhr2 that IE 11 has some issues with XMLHttpRequest but I wasn't completely clear on what that means. We are returning JSON in the response with the content type set to application/json. Additionally, we do use CORS for this request, but everything is working on other browsers.
I apologize with not sharing more information, but I am just wondering if this is a known IE 11 issue that I just can't seem to find online.
try {
const request = new XMLHttpRequest();
request.open('POST', this.host, true);
request.withCredentials = true;
request.setRequestHeader('Content-Type', 'text/plain; charset=UTF-8');
request.send(outboundStr);
request.onload = function (e) {
if (request.readyState === 4) {
if (request.status === 200) {
try {
const responseObj = JSON.parse(request.response);
setSbmId(user, responseObj);
user.country = responseObj.c;
} catch (ex){
util.throw(`FluentD parse error: ${request.response}`, ex);
}
} else {
util.throw('FluentD response error')
}
}
};
} catch (e) {
util.throw('Failed to send payload to fluentd', e);
}

Call Marketo API using javascript only

I'm currently trying to retrieve and send data from Marketo's API. The problem is : my web platform is Salesforce Community. If I understand correctly this web tool, I'm not allowed to use anything else than pure javascript.
I've built a CORS request like this :
function createCORSRequest(method, url) {
var xhr = new XMLHttpRequest();
if ("withCredentials" in xhr) {
xhr.open(method, url, true);
} else if (typeof XDomainRequest != "undefined") {
xhr = new XDomainRequest();
xhr.open(method, url);
} else {
xhr = null;
}
return xhr;
}
function makeCorsRequest() {
var url = document.getElementById('url').value;
var xhr = createCORSRequest('GET', url);
if (!xhr) {
alert('CORS not supported');
return;
}
xhr.onload = function() {
var text = xhr.responseText;
alert('Response from CORS request to ' + url + 'is : ' + text);
};
xhr.onerror = function() {
alert('Woops, there was an error making the request.');
};
xhr.send();
}
With the help of http://www.html5rocks.com/en/tutorials/cors/, but the server doesn't seem to accept the request since this error comes back :
"No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://testurl…' is therefore not allowed access."
Does anyone know if Marketo's API accepts CORS requests? Or maybe have an idea that would help me solve this? Thank you very much.

The Marketo REST API will not allow CORS requests. Making a call on the client-side in the browser is a security risk as well, since you'll expose your access token. Depending on what you're trying to do there may be alternatives, or you could set up a simple service to proxy your requests.

cannot handle net::ERR_CONNECTION_REFUSED in pure js

I use pure js(without JQuery) to send an XMLHttpRequest request to server.
var _xhr = new XMLHttpRequest();
_xhr.open(type, url);
_xhr.setRequestHeader('Content-Type', 'application/json');
_xhr.responseType = 'json';
_xhr.onload = function () {
if (_xhr.status === 200) {
var _json = _xhr.response;
if (typeof _json == 'string')
_json = JSON.parse(_json);
success(_json);
} else {
error(_xhr);
}
};
_xhr.onerror = function(){
console.log('fail');
};
try {
_xhr.send(_to_send);
} catch (e){
options.error(_xhr);
}
when i send a request it's fails(this is ok) and i get an error but I CANNON HANDLE IT. xhr.onerror prints message to console but i get OPTIONS url net::ERR_CONNECTION_REFUSED too. How can I avoid this message in console?
Also i use window.onerror to handle all error but i can not handle this OPTIONS url net::ERR_CONNECTION_REFUSED

This worked for me:
// Watch for net::ERR_CONNECTION_REFUSED and other oddities.
_xhr.onreadystatechange = function() {
if (_xhr.readyState == 4 && _xhr.status == 0) {
console.log('OH NO!');
}
};
This is not limited to just net::ERR_CONNECTION_REFUSED because other network errors (e.g. net::ERR_NETWORK_CHANGED, net::ERR_ADDRESS_UNREACHABLE, net::ERR_TIMED_OUT) may be "caught" this way. I am unable to locate these error messages within the _xhr object anywhere, so making a programmatic decision about which network error has specifically occurred won't be reliable.

There is no way around that error showing in console. Just as if you request a file that does't exist you get a 404 in console, regardless of if you handle the error or not.

XDomainRequest (CORS) for XML causing "Access is denied" error in IE8 / IE9

Apologies if this appears to be a duplicate but I cannot see a clear answer to any of the similar questions.
When trying to do a CORS request for some XML I continually get an "Access is denied" JS error from IE8.
My code is adapted from this example:
// Create the XHR object.
function createCORSRequest(method, url) {
var xhr = new XMLHttpRequest();
if ("withCredentials" in xhr) {
// XHR for Chrome/Firefox/Opera/Safari.
xhr.open(method, url, true);
} else if (typeof XDomainRequest != "undefined") {
// XDomainRequest for IE.
xhr = new XDomainRequest();
xhr.open(method, url);
} else {
// CORS not supported.
xhr = null;
}
return xhr;
}
// Helper method to parse the title tag from the response.
function getTitle(text) {
return text.match('<title>(.*)?</title>')[1];
}
// Make the actual CORS request.
function makeCorsRequest() {
// All HTML5 Rocks properties support CORS.
var url = 'http://updates.html5rocks.com';
var xhr = createCORSRequest('GET', url);
if (!xhr) {
alert('CORS not supported');
return;
}
// Response handlers.
xhr.onload = function() {
var text = xhr.responseText;
var title = getTitle(text);
alert('Response from CORS request to ' + url + ': ' + title);
};
xhr.onerror = function() {
alert('Woops, there was an error making the request.');
};
xhr.send();
}
from http://www.html5rocks.com/en/tutorials/cors/
This should work in IE8 using XDomainRequest, and when I load the example page and click "Run sample" on the html5rocks page, it works in IE8. However, as soon as I copy the code to my own page and run, I get the "Access is denied" error on the xhr.open() line inside XDomainRequest.
This one has me really baffled - the server is definitely set up correctly so it's something to do with the frontend. Thanks in advance to anyone who can help!

OK, the problem was down to weirdnesses in IE8 & 9 which were solved with a few suggestions from this article: http://cypressnorth.com/programming/internet-explorer-aborting-ajax-requests-fixed/ (mainly setting some blank handler functions and wrapping the .send() in a 0 timeout).
Here's my final code which works in ie8/9/10/11 & FF/Chrome:
function doRequest(url) {
// Create the XHR object.
var xhr = new XMLHttpRequest();
if ("withCredentials" in xhr) {
// XHR for Chrome/Firefox/Opera/Safari.
xhr.open('get', url, true);
}else if(typeof XDomainRequest != "undefined") {
// XDomainRequest for IE.
xhr = new XDomainRequest();
xhr.open('get', url);
}else{
// CORS not supported.
xhr = null;
};
if (!xhr) {
return;
};
// Response handlers.
xhr.onload = function() {
//do what you want with the response. Remember to use xhr.responseText for ie8 compatibility, because it doesn't have .responseXML
if(xhr.responseXML) {
xml = this.responseXML;
}else if(xhr.responseText){
xml = new ActiveXObject('Microsoft.XMLDOM');
xml.loadXML(xhr.responseText);
};
};
xhr.onerror = function() {
//do what you want on error
};
//these blank handlers need to be set to fix ie9 http://cypressnorth.com/programming/internet-explorer-aborting-ajax-requests-fixed/
xhr.onprogress = function () { };
xhr.ontimeout = function () { };
//do it, wrapped in timeout to fix ie9
setTimeout(function () {
xhr.send();
}, 0);
};