I'm creating a HTML/JS file for people to enter details on a tablet, which get stored in localStorage, and then later on they will be uploaded to a web server via ajax. The storage part is working fine, however, every/any ajax post I make, valid URL, link to an image, made up url all return with 407 error.
Is this a common issue or is this something to do with my works proxy settings?
I don't have the tablet at the moment to test on so I can only test on my work PC.
Related
How can I deploy a js web application that uses an API.
I have hosted it on netlify but it doesn't fetch the data.
Everything works fine on localhost.
Link: hiuhu-theatre.netlify.app
In firefox you can see the request the function getMovies made was blocked, the console shows the reason, it links to this URL.
Basically you're trying to use http protocol for that request when you're over https in your website.
To fix that simply change your "http://www.omdbapi.com/” to start with "https://" instead.
Also, if you can, do not add API key to client side code, if you do so anyone can steal it and use it themselves (and that might make you pay more for the service or reach the limit you have really quick), instead do a request to your back-end server so it fetches the data while hiding the API key.
It works in local because you're using http in local aswell.
I've overrided the getMovies function in my browser to use https and it worked nicely
I'm using FineUploader 5.11.9 "Traditional" to upload pictures to my web server, where a script written using the Perl CGI::Simple module is on the receiving end. Everything works fine on my internal development system - I use CGI::Simple::upload() to get the name of the file and then CGI::Simple::upload($file,$target) to magically copy the temp file to where I want it without having to mess around with filehandles (so much easier than with old CGI.pm, once you realise that you need to use CGI::Simple(-upload) because upload support is disabled by default!)
But I digress. Everything is fine on my development system, but on my production system only the first upload works, and then only if I do it soon after loading the webapp page. All subsequent uploads hang, and when I use the Web Inspector in Safari I see the calls to my CGI script have received a 401 Not Authorized response.
The production server is set with Basic Access Authentication (using AuthType Basic etc in a <Location "/"> section in the Apache httpd.conf file (actually default-ssl.conf which gets included by it), and Safari is set to remember the username/password, so I'm guessing that my first upload works because the authentication from when the web page loaded is still valid, but when I do another request it has gone stale.
I've had a look on the FineUploader documentation site and can't find anything about Authorization for its AJAX requests. Google found FineUploader - add authentication in header which might be the answer, but if it is, how do I find the right value to put in the "Authorization:Basic" header?
To change headers sent with a traditional upload request, use the setCustomHeaders API method:
uploader.setCustomHeaders(
'Authorization', 'Basic ' + username + ':' + password,
fileId
)
First I'm not in the web side of our world, so be nice with the backend guy.
A quick background : For a personal need I've developped a google chrome extension. They are basically a webpage loaded in a chrome windows and... yeah that's it. Everything is on the client side (scripts, styles, images, etc...) Only the data are coming from a server through ajax calls. A cron job call a php script every hours to generate two files. One, data.json contains the "latest" datas in a json format. Another one hash.json contain the hash of the data. The client chrome application use local storage. If the remote hash differ from the local one, he simply retrieve the data file from the remote server.
As I have a BizSpark account with Azure my first idea was : Azure Web Site with php for the script, a simple homepage and the generated file and the Azure Scheduler for the jobs.
I've developed everything locally and everything is running fine... but once on the azure plateform I get this error
XMLHttpRequest cannot load http://tso-mc-ws.azurewebsites.net/Core/hash.json. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:23415' is therefore not allowed access.
But what I really can't understand is that I'm able (and you'll be too) to get the file with my browser... So I just don't get it... I've also tried based on some post I've found on SO and other site to manipulate the config, add extra headers, nothing seems to be working...
Any idea ?
But what I really can't understand is that I'm able (and you'll be
too) to get the file with my browser... So I just don't get it
So when you type in http://tso-mc-ws.azurewebsites.net/Core/hash.json in your browser's address bar, it is not a cross-domain request. However when you make an AJAX request from an application which is running in a different domain (http://localhost:23415 in your case), that's a cross-domain request and because CORS is not enabled on your website, you get the error.
As far as enabling CORS is concerned, please take a look at this thread: HTTP OPTIONS request on Azure Websites fails due to CORS. I've never worked with PHP/Azure Websites so I may be wrong with this link but hopefully it should point you in the right direction.
Ok, will perhap's be little troll answer but not my point (I'm .net consultant so... nothing against MS).
I pick a linux azure virtual machine, installed apache and php, configure apache, set some rights and define the header for the CROS and configure a cron in +/- 30minutes... As my goal is to get it running the problem is solved, it's running.
I am trying to implement OAUTH for accessing Flickr APIs. My AJAX call to flickr.com keeps failing.
Sample Error Message:
XMLHttpRequest cannot load http://www.flickr.com/services/oauth /request_token?oauth_callback=oob&oauth…signature_method=HMAC-SHA1&oauth_timestamp=1368375405647&oauth_version=1.0. Origin http://localhost:8080 is not allowed by Access-Control-Allow-Origin.
Initially I used chrome and read the html file as file://path. I used to get the error 'null not allowed by access-control-allow-origin'. I solved this problem by copying the html file to 'local IIS server', 'local python webserver' and then a 'remote webserver'. I created python web server using > python -m http.server 8080'
I realize my cross browser call to flickr.com using XMLHttpRequest is failing. I tried by various solutions suggested in this forum:
Using newer Chrome 26.0.1410.64 m, which I guess supports CORS
I launched chrome with --disable-web-security
I created a web server using python -m http.server 8080 on local machine and then on a remote machine and copied the html file to the site
I copied file to a local MSFT IIS server
I defined URL in etc/hosts file to avoid numeric IP
I still get the same error (with relevant URL in the error message)
code clipping:
urlString="http://www.flickr.com/services/oauth/request_token?"+
"oauth_callback="+"oob"+'&'+
"oauth_consumer_key="+consumerKey+'&'+
"oauth_nonce="+nonce+'&'+
"oauth_signature="+esignature+'&'+
"oauth_signature_method="+macAlgorithm+'&'+
"oauth_timestamp="+timeStamp+'&'+
"oauth_version=1.0";
$.ajax({
url: urlString,
success:function(data){
alert(data);
}
});
In order to CORS work, both ends must enable it.
The first end is the browser, and, as you are using Chrome 26.*, yours is ok.
The second end is the server:
Before making a GET request to a domain different than the one the page is on, the browser sends an OPTIONS request to that domain. In response to this request, the server should include some headers that tell if a cross-domain request (GET, POST or other) is allowed.
One of those headers is Access-Control-Allow-Origin.
So when you run your page from your file system (file:// "protocol"), the OPTIONS means something like "Flickr, can I make a cross-domain call to you? I'm calling from null". Flickr does not recognize that domain as allowed and returns the error you are getting.
Same way, when you run your page from your local server, the OPTIONS says "(...) I'm calling from localhost:8080". Flickr does not recognize that domain as allowed as well.
The solution:
I don't know the Flickr oauth service, but I know that, as any other service, to make a CORS call to it, the page must be in a domain allowed by it. From your tests, I'm guessing Flickr does't allow many other domains.
But... an alternative to CORS is JSONP. I did a little research, Flickr oauth seems to support it.
Check this page for details: http://www.flickr.com/services/api/explore/flickr.auth.oauth.getAccessToken
There's another question talking about that specific subject:
Is JSONP supported in the new Flickr OAuth API?
About JSONP, this can get you started: How to make a JSONP request from Javascript without JQuery?
It is not possible to implement Oauth 1.0 through just javascript without any server side script. Since the flickr's new authentication process is based on Oauth 1.0a. You got to use a server-side script.
I tried to send the token request using JSONP in FireFox with CORS on(using a third-party add-on) and it worked fine. But without using any add-ons, it's not possible as the response from flickr is in text format(not in a JSON format) and the request fails.
You can either use server-side code for token request. OR Use the deprecated flickr API for authentication.
I'm trying to figure out why Chrome (26.0.1410.64) and IE10 don't seem to recognize the cookie I set in my response from an ASP.NET Web API controller. Here is the situation:
I have a drop-down menu login form on my page that makes an ajax call to my Web API method (via HTTP POST) and that Web API method returns some JSON data and also sets a cookie in the response (using the HTTP headers). It works perfectly in Firefox and Safari (so, WebKit) but not in Chrome or IE. Chrome and IE appear to completely ignore the cookie that's sent back in the response. I've verified (using Fiddler) that the cookie is sent back on the response so I know it's there - I can't figure out why IE10 and Chrome don't pick it up though.
Any ideas? Does it have something to do with how Chrome and IE10 handle response cookies in ajax requests?
So I figured out the issue, although it's not something I really would like to accept as a solution. I guess I will just have to deal with it and always test the site on my local machine using Firefox.
So here's the issue:
When I run my site locally by running it from Visual Studio and IIS on my local machine, it creates a website at an address like http://localhost:1839/. For some reason, ajax cookies get ignored by IE10 and Chrome when it's "localhost" - but not when it's a real-looking host name or IP Address. So if I edit my host file and create a generic entry like localhost.com and point it at 127.0.0.1:1839 then everything works fine in IE and Chrome (and Firefox still as well).
It's when I use the localhost:1839 address that ajax cookie only works in Firefox.
So what I ended up doing was deploying my website to a different test IIS server (on another machine) that I have a test.mydomain.com entry in my local host file for - that points to the test IIS server's IP address. Now IE, Chrome and Firefox all accept the ajax cookie from this faked "test.mydomain.com" domain.
So for those of you sending cookies back on an ajax request - beware of this "localhost" issue with Chrome and IE.
The Domain on the set cookie is most likely conflicting against using localhost. If you edit your hosts file and add a alias it will make test.mydomain.com point to your local machine:
Within c:\windows\System32\drivers\etc\hosts add the following:
127.0.0.1 test.mydomain.com
Start your webserver within Visual Studio
Close all browsers, then load test.mydomain.com