I am building a reverse proxy with NGINX that controls the access to a three docker containers which contain a little App I've developed. This proxy can only be accessed by an apy-key authorized by Kong with the key-auth plugin. The scheme is something like this:
If the clients don't have the api-key the request is denied. It seems to be working, but I have a problem with the static css files. From the browser I can access the application, but the CSS and JS does not load because they don't send the api-key in the request. For this reason I get a 401 HTTP unauthorized response when the browser tries to load the styles:
GET http://localhost:8000/myapp/r2/docs/stylesheets/library.css[HTTP/1.1 401 Unauthorized 1ms]
message "No API key found in request"
So my app is loading in the browser without styles. These are my style headers in the app:
<link href="myapp/r2/docs/stylesheets/library.css" rel="stylesheet" type="text/css">
How can I send my api-key to load the styles and js too?
Related
I have a problem I can't get my head around. On some pages of our website we use SignalR. Recently some clients, notably our clients that use our website from behind a corporate proxy/firewall, have issues with the SignalR pages. They cannot load the /signalr/hubs script, a HTTP status code 406 is returned.
For example, when one of our clients requests the page from a cloud environment, this is the result:
If I request the same page, it loads fine:
I can't explain why it would give a 406 status code, accept: */* and accept-language should do the trick. The only notable difference I see is the disabled caching in the 2nd image.
The necessary scripts are in the proper order:
<script src='//ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js' type='text/javascript'></script>
<script type="text/javascript" src="/Collectief/Scripts/jquery.signalR-2.2.0.min.js"></script>
<script type="text/javascript" src="/Collectief/signalr/hub"></script>
Has anybody encountered this issue? Would it help to disable the auto-generated hub script and generate a physical file as described here?
It appeared that the call to /Collectief/signalr/hub never reached our server, and was blocked by the corporate firewall of our client. They had a barracuda firewall. It seems that some firewall manufacturers (maybe more than just barracuda) have updated their filters and are now blocking SignalR functionality.
We replaced the autogenerated /signalr/hub with a physical file to circumvent the issue, but then the negotiate call would fail with another 406 status code.
We now tell our clients to change the firewall settings: whitelist our site or allow all SignalR calls.
I am working on Angular 1 / ASP.net tech stack based web application.
For some reason, I can not deploy api server on my local env, using Production server. And I launched UI side with nginx in local env.
Login page is:
http://localhost:8080/login.html
And when click login button, it calls API from production server.
http://devprod2.com/api/oauth/login
But I am getting error:
Response for preflight has invalid HTTP status code 400
I opened Cross domain option in browser, with chrome CORS extension.
But it seems this error is related with some CORS problem.
Would you like to help me to fix this problem?
A preflight request occurs when you use certain methods, e.g. POST
It is a request that automatically happens before the cross domain POST happens.
It is checking to see that the correct CORS headers are in place on the server before making the POST request.
It seems like your preflight OPTIONS request is giving an invalid response. On your server, make sure you return 200 for all OPTIONS requests and make sure the CORS headers are in place on the server for all requests.
I believe Angular 1 also has options for a POST request that will prevent preflight requests from being made but you would have to investigate this further yourself.
Alternatively, depending on your setup, it maybe possible to rewrite the request to avoid CORS which is only enforced by browsers.
when I moved to AMP, the Google Tag Manager stopped to working.
The problem occurs every time when I open my AMPed page, I can see some errors in browser console, e.g.
First error:
https://www.googletagmanager.com/amp.json?id=MY_GTM_TAG>m.url=MY_HTTP_URL
(403)
Second error:
No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin '' is therefore not allowed access. The response had HTTP status code 403. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.
In my class that extends WebMvcConfigurerAdapter I overwritten the method addCorsMappings like this:
#Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins("*")
.allowedHeaders("*")
.allowCredentials(true);
};
But it still doesn't work (this method is executed on startup, I checked it). Do you have any ideas / tips why?
EDIT 1 (22.12.2016):
Q: How are you loading tag manager? Are you using the AMP version of the script? (#Jim Jeffries)
A: Yes, in <head> I included the following piece of code:
<script async custom-element="amp-analytics" src="https://cdn.ampproject.org/v0/amp-analytics-0.1.js"></script>
and in <body> there is:
<amp-analytics config="https://www.googletagmanager.com/amp.json?id=${googleTagId}>m.url=SOURCE_URL" data-credentials="include"></amp-analytics>
I was having the same issue and it turns out you can't use your old GTM "Web" container for this so you'll have to create a specific AMP Container.
As per Google's instructions found here:
Create an AMP container
Tag Manager features an AMP container type. Create a new AMP container for your project:
On the Accounts screen, click More Actions (More) for the account
you'd like to use. Select Create Container.
Name the container. Use a descriptive name, e.g. "example.com - news - AMP".
Under "Where to Use Container", select AMP.
Click "Create".
Based from this thread, maybe you are doing an XMLHttpRequest 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.
*When you are using postman they are not restricted by this policy. Quoted from Cross-Origin XMLHttpRequest:*
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.
Also based from this forum, the app must authenticate as a full admin and POST the desired CORS configuration to /rest/system/config.
I have my meteor app running on cloud9. I have AdminLTE installed. When running the app on my local host, all is well. Running on cloud9-IDE I get the following browser error related to the AdminLTE package:
Mixed Content: The page at 'https://app-user.c9users.io/'
was loaded over HTTPS, but requested an insecure stylesheet
'http://0.0.0.0:8080/packages/mfactory_admin-lte/css/AdminLTE.min.css'.
This request has been blocked; the content must be served over HTTPS.
'http://0.0.0.0:8080/packages/mfactory_admin-lte/css/skins/skin-green.min.css'.
This request has been blocked; the content must be served over HTTPS.
How can I correct this? I red somewhere that I has to do with accessing http over https. I'm a bit clueless when it comes to https. Any ideas?
Found the solution. The environment variable must be forced.
Thus to run the app:
ROOT_URL="https://app-username.c9users.io/" meteor --port $IP:$PORT
I'm thinking about my website architecture that's using https.. I now have a CDN server hosting images , css and more static files.
The website itself is using HTTPS for securing sensitive costumer data. Will using the static images , loaded by for example 'http://cdn.example.com/images/test.jpg' on a website 'https://www.example.com' popup a "Loading insecure data" message?
So loading external NOT SECURED data on a SECURED website.
Will this be causing a popup warning "Loading insecure data, continue?"?
Thx!
Yes.
If a page is loaded over HTTPS then every resource it uses should also be loaded over HTTPS.
Otherwise a man-in-the-middle could replace images with misleading ones (or ones that exploit buffer overflow issues in browsers to execute code) and scripts with ones that do different things (such as leak data to the third party).
You have to load every resource over https to get rid of that warning. You can either move the resources to your server that supports encryption, or link to an external resource over https.
If you really want to load http content in https, you can follow this method using a backend handler in charge of downloading and exposing the required content with self forged links including a hash. The security issue is then fixed and you get the content accessible through https.
Dealing with HTTP content in HTTPS pages
I did this recently.
I have a raspberry pi loaded with nginx, and PHP.
I us Https to handle requests from the web to the PHP code which in turn sends http requests to my local network to assemble the page. Works well.