Develop Reference

How can I read a csv file from my library in Qualtrics?

I'm new to Qualtrics, HTML, and Javascript, so feel free to let me know if what I'm asking for is impossible.
I'm trying to use Qualtrics to gather some data that relates applicant test scores and schools that the same applicants were admitted to. As part of my autocomplete function (this is needed to standardize user input-- don't want the problem of some people typing UCLA and others University of California, Los Angeles), I need Qualtrics to read a csv file of schools that is currently stored in my Files Library, and that convert that csv into an array. I'm having trouble getting it to read the file to begin with.
I've tried using ajax (still don't really know what it is- I'm bumbling, here). Here is my attempt with ajax in Javascript:
autocomplete: function() {
var availableTags;
jQuery.ajax({
type: "GET",
url: "illinoislas.qualtrics.com/CP/File.php?F=F_8Aek00I0KXkihUN",
dataType: "text",
success: function(result){
availableTags = jQuery.csv.toArrays(result);
}
});
jQuery(".InputText" ).autocomplete({
source: availableTags
});
}
As far as I can tell, the ajax request isn't succeeding. The url I provided it is the View button of the csv file in my library, and it's obviously not a csv, but I don't know how else to proceed. Any help will be greatly appreciated.

I tried a simple AJAX request on your 'csv' URL
$.ajax({
url: "https://illinoislas.qualtrics.com/CP/File.php?F=F_8Aek00I0KXkihUN",
method: "GET"
}).then(function(response) {
console.log(response);
});
... and ran into the CORS policy error in the console:
Access to XMLHttpRequest at 'https://illinoislas.qualtrics.com/CP/File.php?F=F_8Aek00I0KXkihUN' from origin 'null' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
Cross-origin resource sharing (CORS) is a mechanism that allows restricted resources on a web page to be requested from another domain outside the domain from which the first resource was served. ... Certain "cross-domain" requests, notably Ajax requests, are forbidden by default by the same-origin security policy. https://en.wikipedia.org/wiki/Cross-origin_resource_sharing
Basically you can't do AJAX requests to external domains unless the server you are calling is designed to return a header saying it's okay. The same applies to iframes (as soon as you try to access the content of the iframe with javascript). It's a browser security mechanism to protect the user.
The easiest fix would be to make a copy of that 'csv' file and host it on the same domain as your page. You can still use AJAX URL: "./assets/schools.csv"
Also note, testing your AJAX response with a console.log(result) is an easy way to check you have data coming back from the request.

How to get html of another website on the client-side?

I am trying to write a javascript script that would scrape the HTML source code of another website (ex. www.google.pl).
I found a few solutions, but none worked. I tried to run this code:
var url = "http://google.com/";
$.ajax({
url: url,
success: function(data) {
alert(data);
}
});
but it returns: "Status Code: 301 Moved Permanently (from disk cache)"
Do you have any code that would work?
Thank you :)

You can't.
The Same Origin Policy prevents cross-origin reads.
You can only perform read operations on your own domain.
For example: a script at https://foo.com/some-script.js/ can typically request a resource from https://foo.com/about-us, but not https://bar.com/about-us/.
If you think about it, this restriction is critical for keeping the web safe. For example, you wouldn't want any arbitrary site to be capable of accessing your bank account, would you?
If the owners of a website want to make a certain resource available to other domains, they can enable cross-origin resource sharing (see Mozilla's article on CORS for more information), but this is up to them.

No 'Access-control-allow-origin' header is present on the requested resource error with json and jquery

I use an API that is on a different server and i got an CORS error I think. The strange thing is that it first worked with no problem, then i got this error message
XMLHttpRequest cannot load http://www.thecocktaildb.com/api/json/v1/1/random.php? tagmode=any&type=POST&format=jsonp. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'myadress.com' is therefore not allowed acces
i added crossDomain: "true" and it worked for a day. Now it doesn't work again and i've searched and tried a lot of solutions i've found. But nothing works. What is the problem and how do i fix it? Tried jsonp instead of json with and without type:post and the &callback=? does nothing. I've even installed the CORS enable extension for chrome. But alwways the same error, I have no control over the API itself or the server hosting it. How can I fix this? Below is my code.
function random() {
$(document).ready(function () {
$.getJSON("http://www.thecocktaildb.com/api/json/v1/1/random.php", {
tagmode: "any",
type: "POST",
format: 'jsonp',
crossDomain: "true"
}, function (data) {
console.log(data);
var result = "";
$.each(data.drinks, function (index, value) {
result += "<p>" + value.idDrink + "<p>";
result += "<p>" + value.strDrink + "<p>";
});
$('#result').html(result);
console.log(result);
});
});
}

I think you can make some modification for bypass CORS error. but target environment can also block CORS request. When I used Paypal checkout, I encountered same problem. Paypal environment doesn't accept CORS request.
So that you can try to make this call over server side.

If I understood it right you are doing an AJAX call to a different domain than your page is on. So the browser is blocking it as it usually allows a request in the same origin for security reasons. You need to do something different when you want to do a cross-domain request. A tutorial about how to achieve that is Using CORS.
Regular web pages can use the XMLHttpRequest object to send and
receive data from remote servers, but they're limited by the same
origin policy. Extensions aren't so limited. An extension can talk to
remote servers outside of its origin, as long as it first requests
cross-origin permissions.
Solution :
For allowing access to specific domain only:
response.addHeader("Access-Control-Allow-Origin", "http://www.thecocktaildb.com");
Check this blog post.

Steam API Get SteamID using Javascript

Been running into what appears to be the Same Origin Policy which is causing quite some headache!
To cut to the chase, I am essentially trying to acquire a user's steam64id when only supplied their username.
For example, my username: "Emperor_Jordan" I would go to:
http://steamcommunity.com/id/emperor_jordan?xml=1
And the steamid I need is right at the top. So I figured I would use JQuery Ajax to acquire this and parse out the id I need for later usage (steamapi usage requires the steam64id) as follows. Here is a snippet of the code in question:
$.ajax({
url: "http://steamcommunity.com/id/emperor_jordan/?xml=1",
datatype: "xml",
complete: function()
{
alert(this.url)
},
success: parse
});
function parse(xml)
{
alert("parsing");
_steamID = $(xml).find("steamID64").text();
}
The problem here is while I do get the alert for the completion, I never see "parsing". Ever. It never gets that callback, which leads me to believe I am running into the SOP (same origin policy).
Am I approaching this the wrong way, is there a workaround?
Thanks!

Correct. You are running into the same-origin policy:
XMLHttpRequest cannot load http://steamcommunity.com/id/emperor_jordan/?xml=1. Origin http://fiddle.jshell.net is not allowed by Access-Control-Allow-Origin.
and it looks like Steam does not offer a cross-origin solution like JSONP. That means you're back to the old-but-reliable solution: fetch the data on your server, not in the browser.
Some relevant feedback on the Steam Web API: https://developer.valvesoftware.com/wiki/Steam_Web_API/Feedback#API_Considerations_for_Web_Developers

You need to create a proxy server in Heroku in order to get the data. Cors is restricting us to call the data directly to our browser not server to server interaction. So we need a proxy server to send the requests and receive the data on our behalf. It's working for me.
Thanks in advance.

javascript browser-like GET request

I need to request web page client-side and than pass it to server as a string. I tried jQuery:
$.get(
"http://example.ru/",
{name:"Joe", age:"42"},
function(data){
$.get(
"script.php",
{data:data, query:query},
)
});
});
but did not succeed. I suspect it failed because of custom headers added by jQuery.
Can you advice me some technique to override request headers or any js library that makes requests just like browser does?

You've been caught out by Same Origin Policy:
The same origin policy prevents a
document or script loaded from one
origin from getting or setting
properties of a document from another
origin.
What you can do is use a simple proxy on your domain that fetches the page you're interested in (with permission, of course) thus allowing you to display it on your page via ajax requests. What I mean is something like the following:
$.get("yourdomain/proxy.php?name=Joe&age=42"
function(data){
$.get(
"script.php",
{data:data, query:query},
)
});
});