Hangout app XMLHttpRequest cannot load error when trying to call a .php file to get data - mysql

I am trying to talk to mysql from my Google Hangout app and the test code works fine from an HTML page, but gets blocked when I run it in the app .XML wrapper in a hangout.
There I get this in the console (I had to replace the URLs due to me being new here) :
<<<<<>>>>>
XMLHttpRequest cannot load XXXXXX MY file URL XXXXX. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https XXXXXX GOOGLE USER CONTENT XXXXX' is therefore not allowed access. ifr?url=app%3A%2F%2F609528936436%2Fhangout&container=hangout&view=default&lang=all&country=ALL&debu…:1
GET XXXXXX MY file URL again only with https XXXXX net::ERR_CONNECTION_REFUSED ifr?url=app%3A%2F%2F609528936436%2Fhangout&container=hangout&view=default&lang=all&country=ALL&debu…:1199
XMLHttpRequest cannot load XXXXXX MY file URL XXXXX. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'https XXXXXX GOOGLE USER CONTENT XXXXX' is therefore not allowed access. ifr?url=app%3A%2F%2F609528936436%2Fhangout&container=hangout&view=default&lang=all&country=ALL&debu…:1
<<<<<>>>>>
What am I doing wrong? Thank you!

ANSWER Thanks to Gerwin Sturm:
Your problem seems to be that with the Hangout App running inside of an iframe hosted on Google servers your server refuses to send content to this different domain.
Two possible solution:
1) Set the headers on your server to allow cross-origin request. In your php script you should be able to do this by calling
header("Access-Control-Allow-Origin: *");
2) Use https://hangoutiframer.appspot.com, which allows you to run the hangout app on your own server, preventing CORS problems that way.

Related

WebTorrent Broken

I'm trying to figure out how to get web torrent to play a video, but I'm getting some weird errors. Here is a pastebin: https://pastebin.com/raw/3wp5F8Fh
And here is a live version: https://41182065-e8d9-40b1-8dd9-9433b402bce9.htmlpasta.com/
When we go to the chrome console, we get this:
Mixed Content: The page at 'https://41182065-e8d9-40b1-8dd9-9433b402bce9.htmlpasta.com/' was loaded over HTTPS, but requested an insecure script 'http://momentjs.com/downloads/moment.min.js'. This request has been blocked; the content must be served over HTTPS.
/favicon.ico:1 Failed to load resource: the server responded with a status of 404 ()
(index):1 Access to XMLHttpRequest at 'https://nyaa.si/download/941788.torrent' from origin 'https://41182065-e8d9-40b1-8dd9-9433b402bce9.htmlpasta.com' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
webtorrent.min.js:4 Uncaught Error: Error downloading torrent: XHR error
at webtorrent.min.js:5
at t.exports.<anonymous> (webtorrent.min.js:7)
at t.exports.t (webtorrent.min.js:5)
at t.exports.r.emit (webtorrent.min.js:4)
at XMLHttpRequest.c.onerror (webtorrent.min.js:7)
The explanation is in the error message, but in short: your browser has blocked the request because you're using AJAX to communicate with a remote server and that server isn't sending the appropriate 'Access-Control-Allow-Origin' header.
The reason such requests are blocked is to protect you from malicious scripts - if you're logged in to website A and have access to some private data, then website B shouldn't be able to trigger an AJAX request to access that data unless A trusts B.
The general term for this kind of access is 'Cross Origin Resource Sharing' or 'CORS' - for more information, Mozilla have a nice summary here: https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS
If you have control of the remote server then responding with the appropriate header will allow the request to go through (although note that some browsers such as Safari will still block cookies from the remote server because this technique can be used for tracking).

Postman Oauth 2 callback url - Chrome App

I am using The Chrome App for Postman and I am setting up my Access Tokens using OAUTH2. When I fill out the form, I am using the following:
Auth Url: https://[MY_API_URL]/api/authorize
Access Token URL: https://[MY_API_URL]/api/request/token
Client ID: xxxxxxxxxxx
Client Secret: xxxxxxxxxx
Scope: blank
Grant Type: Authorization Code
The callback url in my outh server is set to "https://www.getpostman.com/oauth2/callback"
When I click Request Token, I am taken to the proper Authentication page. When I submit my credentials, a new Chrome tab opens up with a blank page with the url https://app.getpostman.com/oauth2/callback?code=xxxxxxxxxx
I expect that this is supposed to redirect to the app so it can perform the access token request. from the access token url, but nothing is happening. Is this not the right callback uri?
This is an old question and things have changed since.
Google deprecated Chrome Apps, so Postman had to deprecate their old Chrome App client too, and so the old redirection URL (https://www.postman.com/oauth2/callback) no longer works.
According to this, with the more recent versions of Postman, the new redirection URL is https://oauth.pstmn.io/v1/callback.
You have change your permission type. Use Client Credentials instead of Authorization
I also faced same problem.
Just change Grant Type: Authorization Code to Grant Type: Client Credentials.
It worked for me.
Certainly as mentioned in other comments, for client_credentials it would work but for the Implicit or Authorization Code, I used "https://app.getpostman.com/oauth2/callback" as the callback url and it worked. Also it need to be configured in the application settings in oauth provider.
I've been using this callback url:
https://getpostman.com/oauth2/callbackurl

Cross-Origin Request Blocked: ........................... . (Reason: CORS header ‘Access-Control-Allow-Origin’ missing)

I have a simple html file saved in my desktop. This html file needs to send the link to a json file(stored in azure blob) to the app included in this webpage.
Script part of the webpage
<script>
var zbc = "https://blobtempdemo.blob.core.windows.net/path/to_required_file.json";
require(['scripts/SampleApp/App'], function(App)
{
App.start(abc);
});
The json file is stored in microsoft azure blob. When i run the webpage in Mozilla Firefox, it gives a warning saying
Warning
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://blobtempdemo.blob.core.windows.net/path/to_required_file.json. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).
The app/ web page works perfectly when all the files are saved in my desktop.
When i paste the url in the firefox, it can get the file and ask me if i want to download it. But it does not work when the file is in the blob and i open this webpage.
Any Help?
Just allow CORS from all the domains (just to test) in the target storage account. That should do it. Use * as the value for allowed domains.
Reference:
https://learn.microsoft.com/en-us/rest/api/storageservices/fileservices/cross-origin-resource-sharing--cors--support-for-the-azure-storage-services

History and XHR issues with Sails running on localhost

With the default configuration, I am unable to make XHRs in my Mithril app if I run its Sails server in localhost. All I get is:
XMLHttpRequest cannot load http://localhost:1337/json/test-realms.json. The 'Access-Control-Allow-Origin' header contains the invalid value ''. Origin 'null' is therefore not allowed access.
If I enable CORS with allRoutes: true, origin: '*' that problem goes away, and instead I get:
DOMException: Failed to execute 'replaceState' on 'History': A history state object with URL 'http://localhost:1337/#!/' cannot be created in a document with origin 'null'.
What exactly is the issue here?
Updates:
I am using sails lift as server.
The web app is loaded via http://test.pink. The domain is set to a LAN IP via the HOSTS file.
No resources are loaded via file:/// or localhost.
Turns out the problem was related to Content Security Policy. I had set sandbox 'allow-scripts' 'allow-forms', which as per this and this would treat the page as an iframe with an unique origin.
Disabling the sandbox policy or adding allow-same-origin suffices to fix it.

XMLHttpRequest cannot load http://localhost:9090/receive. No 'Access-Control-Allow-Origin' header is present on the requested resource

I am opening a html file through nginx server and then the html file passes the "POST" request from the dropzone to the nginx server which then proxy_pass to my go server.This go server then accepts the request.
But when i try to use my html file and drop something in the dropzone i get the error :
XMLHttpRequest cannot load http://localhost:9090/receive. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:9009' is therefore not allowed access.
PLease help me out.
In your error above you have the page loading from http://localhost:9009 requesting to http://localhost:9090/. These are different origins according to the Same Origin description here: https://www.rfc-editor.org/rfc/rfc6454#section-5
The origins must match:
scheme
host
port
For you the the scheme and host are the same, but the ports are different. Thus you will need to add the CORS headers to allow the caller to call your server on http://localhost:9090.