I've hosted my webapp to Github pages, thus website is on 'https'. But now, I want it to make a 'Http' request to some external site.(I don't have a custom domain to change hosted site to http.)
I'm getting the 'Mixed-content' error -
Mixed Content: The page at 'https://username.github.io/MyHostedSite/' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://someHttpApi'. This request has been blocked; the content must be served over HTTPS.
Is there a way to proxy this so I can do a 'http' request over 'https' ?
Get a custom domain, and do DNS with Cloudflare (free)
… you can turn https on at Cloudflare (in page rules) — then you don't have to worry about github's http/https settings and mixed content errors.
There are good instructions for setting up a custom domain with github pages, you can see it here: Custom domain for GitHub project pages
You just have to decide if you want to serve your site at the apex domain, or with the www subdomain:
http://example.com
vs
http://www.example.com
page rules at Cloudflare look like this:
Related
I am using guthub pages to host a simple website with a custom domain. To manage the the DNS I am using CloudFlare.
I had pages rules setup on CloudFlare for forwarding to my google drive file:
example.com/pdf Foreward rule code 301 https://drive.google.com/file/d/ZZZZZZZZZZZZZZZZZZZ
A while back I enabled HTTPS for my custom domain. Domain is assigned to the guthub page using CNAME and on the github settings page I have enabled Forced HTTPS
I only recently noticed my short links to the google drive files were down.
Is this due to HTTPS? Can replicate forwarding to foreign domain effect without compromising on HTTPS?
You need to make sure that site-wide SSL is reflected in the rule, because Cloudflare first enforces the SSL and only then processes the rules.
https://example.com/pdf 301 https://drive.google.com/file/.........
I am trying to use API Gateway to route traffic to an internal network load balancer.
All routes to the base path (/) are working, so I know the VPC Link is up and reachable.
I added a proxy resource (/{proxy+}), with ANY http method. In the ANY "Integration Request" I selected:
Integration Type: VPC Link
Use Proxy Integration
Method: ANY
VPC Link: My-VPC-link (abcdefg)
Endpoint URL: (i.e. http://abcd1234.cloudfront.net/{proxy})
I can see that the my web server responds with a redirect:
(b9d0c629-31ec-11e8-b452-0f13c3c62b81) Endpoint response body before
transformations: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 3.2 Final//EN">
<title>Redirecting...</title>
<h1>Redirecting...</h1>
<p>You should be redirected automatically to target URL: http://abcd1234.cloudfront.net/api/. If not click the link.
(b9d0c629-31ec-11e8-b452-0f13c3c62b81) Method completed with status: 301
The web page shows:
{"message":"Forbidden"}
Also, if I try to directly link to the CloudFront URL I get the same error.
In addition to the CloudFront URL, I've also tried the following:
Custom Domain Name
403 Forbidden
The URL of my deployed stage
{"message": "Internal server error"}
What URL should be in the 'Endpoint URL' field in the integration request?
It turns out that the API-Gateway must call the VPC Link with 'http' not 'https' for the VPC Link URL.
Everything seems to be in order in your configuration of API Gateway, including the endpoint URL.
My guess is that you are messing something with the redirections. Is it possible that your server is redirecting to the same place again and again, or that the redirection rules always apply?
To be sure that the problem is at your server's side, try a simpler set up. Try making an API call to somewhere that doesn't redirect, just return a simple response.
I have my Angular front-end set up to try and hit a RESTful endpoint. The Angular front-end is being served on localhost:3000, and the RESTful back-end is being hosted on localhost:8080.
In my Angular rest client service, I make the call (which I subscribe to elsewhere in my application):
getCurrentSlides(): Observable<Slide[]> {
return this.http.get("localhost:8080/app/slides")
.map(extractData)
.catch(handleError);
}
But when Angular tries to hit that URL, I get the following error:
XMLHttpRequest cannot load localhost:8080/app/slides. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
And yes, CORS is enabled on my server.
this.http.get("localhost:8080/app/slides")
You're missing the http:// in the URL. With that, most browsers will still require CORS for the different ports, but IE does not, so when adding http:// you should be able to test using IE:
IE Exceptions
Internet Explorer has two major exceptions when it comes to same origin policy
Trust Zones: if both domains are in highly trusted zone e.g, corporate domains, then the same origin limitations are not applied
Port: IE doesn't include port into Same Origin components, therefore http://company.com:81/index.html and http://company.com/index.html are considered from same origin and no restrictions are applied.
These exceptions are non-standard and not supported in any other browser but would be helpful if developing an app for Windows RT (or) IE based web application.
That said, you should enable CORS. (But it seems you did, so then it's just the missing http:// prefix.)
I am using Github Pages as my hosting site for my domain. The pages are hosted at username.github.io. As per github pages documentation I have put the CNAME file in the root directory pointing to example.com
And in my godaddy DNS manager I have added CNAME www to username.github.io
Later I switched to CloudFlare to use the Universal Free SSL for my Github Custom Domain page.
Currently the CloudFlare DNS Manager includes these two items:
A exmaple.com 192.30.252.153
CNAME www username.github.io
Since I have enabled SSL in cloudfare and redirect http (naked or otherwise) addresses to https, I have put a Page Rule as http://*example.com/* with Always use https turned on.
Now all types of addresses are getting redirected to https://example.com (this is my end requirement)
However the 301 redirection from http://www.example.com to https://example.com is happening this way:
http://www.example.com to
https://www.example.com/ to
http://example.com/ to
https://example.com/
This multiple redirection will affect the site loading speed if a user types the address as www.example.com. And (possibly?) these multiple redirections will affect page ranking in search sites.
Hence is it not better to put direct 301 instead of multiple? Or using multiple redirection is what normally all web-masters do in a situation like this?
If no, then someone please guide me to enable the 301 redirection from http://www.example.com directly to https://example.com/ without any multiple redirections.
You can set Page Rules in CloudFlare and change the order to your intended effect.
If this is still problematic you can also enable HSTS which will require the browser to access the HTTPS version after the first time you visit the site. This also makes the site more secure by not allowing anyone to man-in-the-middle your secure connections.
I notice Google recently changed Webmaster Tools to treat http and https as completely different sites - same as www and non-www version of the URL. So I now need to configure and review four separate sites? What a PITA!
They said the do it because we asked for it. I can see how maybe 0.01% of the Internet may use the protocol to separate content on the same URL. But what a pain for the rest of us!
Is there a way to get it to merge all the data as one?
It's recommended to use either www or non-www, but not both. Same with http and https, pick one, use that, and redirect the other. You can find many answers about how to do the redirect. Here are some examples for Apache: redirect non-www to www, redirect www to non-www, redirect http to https and redirect https to http.