the following architecture is working Working Use Case:
FrontEnd: React (web.example.com)
Server: Node.js (server.example.com)
BBB Server (bbb.example.com)
Note: The BBB is loaded in an iframe in frontend/react/web.example.com
Eg.
URL_TO_JOIN = is the url received from BBB after a meeeting is created via an API call
<iframe
allow="microphone; camera"
src={URL_TO_JOIN}
allowfullscreen={true}
>
</iframe>
Not Working Use Case:
if the FrontEnd is served in local environment React (web.example.local)
https is also setup
/etc/host
127.0.0.1 web.example.local
nginx serve the frontend/react/web.example.local traffic with https
Error message:
Unauthorized Session
not found
The following worked for me:
I've created a subdomain web.local.example.com and hosted the frontend/react/web.localhost.example.com using Nginx as load balancer with ssl
Note:
web.local.example solves the requirement of same-origin, hence resolves the issue
Related
I am using a NextJs app where I am using a simple fetch to send some POST data.
We I used app on localhost it worked fine but when I put it on the server it got following error.
Mixed Content: The page at 'https://speechwithai.com/home' was loaded
over HTTPS, but requested an insecure resource
'http://18.224.190.161:5000/fileToText'. This request has been
blocked; the content must be served over HTTPS.
The from and to are both on same IP address (https://speechwithai.com/). At the back I am running NGINX to server WebAPP at port 80 and Flask REST API at 5000. I am using Flask because I needed python libraries to process some files.
I tried multiple post but I did not find any solution. Could someone please help me?
All I want is to send a request to my FLASK API server which is running
http://someIPAddress:5000 from https://myLiveNextJsApplication.com
Since both servers are running behind same server and you already have nginx setup.
follow these steps
setup reverse proxy for flask
with some thing like below
events {}
http {
server {
listen 443;
location /flask_api {
proxy_pass http://127.0.0.1:5000/;
}
nginx configuration resides in /etc/nginx/nginx.conf
.
For more information visit https://docs.nginx.com/nginx/admin-guide/web-server/reverse-proxy/
configure ui to use this flask_api
url = https://speechwithai.com/flask_api
update flask path route to use /flask_api
I have installed keycloak using helm.
A Traefik ingress is created to allow access from public
After the admin password is created from localhost:8080, i am able to login into admin console only when i am port forwarded and local access.
When i use the public url and click on admin console, it redirects to https://website/auth/admin/master/console/ and shows a blank page.
I found the problem but when i change the servicePort: https inside ingress, i get an internal server error
status code 500.
when i use http port,i get these errors:
Mixed Content: The page at 'https://url/auth/admin/master/console/' was loaded over HTTPS, but requested an insecure script 'http://url/auth/js/keycloak.js?version=mxda6'. This request has been blocked; the content must be served over HTTPS.
Mixed Content: The page at 'https://url.ca/auth/admin/master/console/' was loaded over HTTPS, but requested an insecure script 'http://url/auth/js/keycloak.js?version=mxda6'. This request has been blocked; the content must be served over HTTPS.
i looked through traefik logs:
level=debug msg="'500 Internal Server Error' caused by: x509: cannot validate certificate for x.x.x.x because it doesn't contain any IP SANs"
I found a fix but it still doesn't answer my question why when ingress points to https, it doesnt work. Is there an answer?
So the fix is to add this under ENV in the statefulset keycloak deployment.
In the ingress, the service port is http
- name: PROXY_ADDRESS_FORWARDING
value: "true"
i found it at https://github.com/eclipse/che/issues/9429
I had the same issue. The white screen isn't helpful, but the browser console is. It is blocking mixed content, namely the script http://url/auth/js/keycloak.js?version=mxda6.
The documentation on Docker Hub says:
Specify frontend base URL
To set a fixed base URL for frontend requests use the following environment value (this is highly recommended in production):
KEYCLOAK_FRONTEND_URL: Specify base URL for Keycloak (optional, default is retrieved from request)
I provided the external url with https scheme in my manifest and the script in question is now appearing in the index.html as https url.
- name: KEYCLOAK_FRONTEND_URL
value: "https://url/auth"
Since it is "highly recommended" I suppose there are more slight problems without this variable set, like other links being generated wrong, e.g. in emails though I didn't check that yet.
I'm trying to implement URL redirects from http to https as described by [https://cloud.google.com/load-balancing/docs/https/setting-up-traffic-management][1] but I'm getting ERR_TOO_MANY_REDIRECTS
I have a storage bucket with a very simple HTML page.
I have an external HTTP load balancer in front of it. Static IP address. SSL cert. I managed to connect everything so that both http and https requests for the site load the contents of the bucket.
I tried to add the HTTP redirect as per the document:
Changes 'Host and path rules' from 'Simple' to 'Advanced...'.
The default route still points to the bucket
I added a new route. Host is 'www.example.com. The default path rule points to the bucket. The second path rule matches /* and does a prefix/HTTPS redirect as described in the above link.
Once the config is saved, either http or https requests to www.example.com results in ERR_TOO_MANY_REDIRECTS
What am I doing wrong? Really appreciate any help you can provide.
[Backend configuration][2]
[Frontend configuration][3]
[Host and path rules][4]
[Redirect path rule][5]
[1]: https://cloud.google.com/load-balancing/docs/https/setting-up-traffic-management
[2]: https://i.stack.imgur.com/lkhUF.png
[3]: https://i.stack.imgur.com/FYst0.png
[4]: https://i.stack.imgur.com/zsTOX.png
[5]: https://i.stack.imgur.com/2tEDE.png
FYI - someone in Google Groups pointed out that I needed 2 load balancers. 1 to terminate the HTTPS traffic and the second to redirect the HTTP traffic. Works like a charm.
I got problem when setup subdomain on the server with nuxt js.
I have setup /etc/hosts and put 127.0.0.1 subdomain.localhost then restart the nginx server and restart the pm2. And the main domain not using localhost:3000, so port is available. But I still got an error.
Error says: Server error
An error occurred in the application and your page could not be served. If you are the application owner, check your logs for details.
how can I solve this? Anyone can help?
pm2 has nothing to do with domain or subdomain.
As I understand, you want to proxy your nuxt app to a subdomain.
You have to launch your nuxt app with pm2:
pm2 start 'nuxt start'
and proxy localhost:3000 to your domain or subdomain like so:
server {
listen 80;
server_name subdomain.localhost;
location / {
proxy_set_header Host $http_host;
proxy_pass http://localhost:3000;
}
}
I had Plesk installed and using Plesk I have setup subdomain and put nuxt app there, seem to work. There are many ways Plesk is one way. To start app I used https://nuxtjs.org/faq/deployment-pm2/
I'm running meteor on localhost:3000 and I have apache set up to proxy requests for a domain to that meteor instance using a virtualhost and mod_proxy.
I'm getting this error when trying to log in to my meteor app using accounts-facebook:
Given URL is not allowed by the Application configuration.: One or
more of the given URLs is not allowed by the App's settings. It must
match the Website URL or Canvas URL, or the domain must be a subdomain
of one of the App's domains.
I think this is because my ROOT_URL is http://localhost:3000 . If I change the ROOT_URL to the domain, then of course meteor tries to listen to the domain, but can't because my apache server is in the way.
Is there a way I can make this work without another IP address?
From Meteor documentation,
Ensure that your $ROOT_URL matches the authorized domain and callback
URL that you configure with the external service (for instance, if you
are running Meteor behind a proxy server, $ROOT_URL should be the
externally-accessible URL, not the URL inside your proxy).
In my case, my app is listening on a configured port with mod_proxy behind an Apache proxy server, say it is listening http://www.example.com:8080. I have other applications running on other ports.
To get going, on Facebook I set Site URL and Valid OAuth redirect URIs to http://www.example.com:3000 and App Domains to www.example.com. On my machine I set ROOT_URL to http://www.example.com:3000, which is externally-accessible.
Such configurations work for me without a second IP address.
I could get it working by simply having
# /etc/hosts
127.0.0.1 localhost.localdomain localhost
And the facebook settings as in the image below. I've set a secondary (mobile) url to point to http://localhost:3000
I've created a whole facebook app like this, with login, access to graph-api etc. And everything was working both online and in the dev envrionment