Vue.js app hosted on githubpages not working with custom domain - vue.js

So i have a Vue.Js bassed app, on localhost it works great. When i host it on github-pages without custom domain it works aswell, but when i change custom domain it shows 404 error :
I've checked dns via https://dnschecker.org both A Records and CNAME gets resolved.
Github pages also resolves my dns:
As mentioned in this so i've created a 404.html file in public folder.
Repo link : Github
Domain : https://www.amberkrynica.pl

It seems that not all DNS servers can resolve your nameservers. https://dnschecker.org/#NS/www.amberpokoje.pl
My guess is that this may be a problem with your registrars DNS changes not getting picked up by big DNS providers.
If the domain is new, the new nameservers may take some time to pop-up everywhere.
If it's not a new domain, try to contact your provider to check with them if everything is working.

Related

mysite.com/api and mysite/images not being aliased to my domain

I have a site being hosted on heroku so I can go to myapp.herokuapp.com/ and my SPA loads. I got a domain and used cloudflare with a CName record to alais mydomain.com to myapp.herokuapp.com. Great the sites load. Within my SPA i load some images. If my app loads directly from heroku *myapp.herokuapp.com/images/filex.png" it works fine but if I call (or type in the address bar) myDomain.com/images/files.png" I just get my site back like i types mydomain.com
Is this an issue with cloudflare? Do i need additional routing rules?
or is this an issue with my express server that is serving the app and images? does the redirected
request look different and do I need to add code to handle the redirect?
I'm not sure why the redirect is happening without more information. My best guess is that you need to follow these instructions from Heroku. Without this, Heroku servers will have no idea what to do with a request that has a host header of mydomain.com, and will perform in some unexpected way. Heroku needs some way on its side to know that all mydomain.com requests should be handled identically to myapp.herokuapp.com requests.
If this configuration is already in place, your underlying code needs to handle myapp.herokuapp.com and mydomain.com, but I believe by default express will not care about hostname.
Seems to have been an issue with heroku. It’s working fine on aws.

Cannot connect Heroku to custom Google Domain

In Heroku, my domain name for www.[somesite].com shows an ACM Status of "OK".
I also am using automatically managed SSL.
On Google Domains, I have a CNAME for www pointing to the DNS target.
I also have a synthetic record forwarding # for .[somesite].com to https://www.[somesite].com, with Temporary Redirect, Do not forward path, and Disable SSL.
If I use "Enable SSL" I get an error saying that:
The SSL Certificate for this domain hasn't been created yet.This process may take up to 24 hours to complete.
However, the site does not work. I do not know why Heroku shows that it does nor why it gives a ACM Status of OK.
I have been beating my head against this for several hours and have no idea what to do. Anyone have an idea?
Updated 2021
The following guide will help you to set up a website with SSL and forward all versions of your site to the appropriately secured site (https).
(Heroku) Deploy the site on Heroku (either with CLI or Github integration)
(Heroku) Upgrade to the "Hobby" Dyno (for $7).
(Heroku) Add SSL by going to Settings -> Configure SSL. Choose "Automatically".
(Heroku) Add a domain (on heroku.com) by clicking "Add domain". Be sure to use www in the domain name. So the Domain Name text field would be "www.example.com".
(Google Domains) Add a Custom Resource Record
Name: www
Type: CNAME
TTL: 600
Data: URL from Heroku
For example, behavior-apple-eh2cfqgjkiop23q1wvd4372b.herokudns.com.
(Google Domains) Add a Synthetic Record
Subdomaine Forward
Subdomain: #
Destination URL: https://www.example.com
Permanent Redirect (301)
Forward path
Enable SSL
(Google Domains) If you are using a domain that requires DNSSEC (such as a .dev domain), enable DNSSEC in the DNSSEC section.
You will have to wait about 15 minutes for everything to propagate. At the conclusion of the 15 minutes, you will be able to go to every combination of your site, and it will redirect to https://www.example.com.
Some of the errors you may see along the way are as follows:
ACM Issue
On Heroku:
ACM is failing for 1 domain name
www.example.com Unable to resolve DNS for www.exampe.com
Solution: the reason you are seeing this is because your CNAME is not set up on Google Domains. Complete step (5) above to resolve this issue.
Extra Period Issue
(On Google Domains) "A period keeps getting added to the end of the "Data" section of the URL when I put it in."
Solution: This is expected.
Helpful images
Final Heroku Page
Final Google Domains Page
Resources
Other StackOverflow answer
My root domain isn’t working, what’s wrong?
Heroku Devcenter: Add a Custom Root Domain

GitHub pages repository linked to a custom domain, but the content is not rendering

I've deployed my web site to GitHub pages and it worked perfectly with the GitHub URL. Then I configured my custom domain from Godaddy to my repository and I believe it's properly configured because when I go to my custom domain in the browser the title appears in the browser tab, however no content is being rendered on the screen. It's a blank page. Any guesses on what the problem could be is much appreciated. The domain name is "connorjaksik.com"
Originally I didn't set up the DNS records properly on "GoDaddy".
I didn't add a CNAME with a value of my GitHub account username.
After that I noticed the domain was reaching my repository on github, but not rendering the content.
I had to change the repositories package.json "homepage" setting from the default, to my custom domain.
The source HTML code for your blank page shows "http://parked-content.godaddy.com/park/...", which means the redirection is not happening and Godaddy provides a placeholder page in the meantime.
Check your DNS provider settings, as explained here: it needs to allow "Naked" CName records in order to redirect your GitHub pages to a all domain name.

How to setup Heroku custom domain with DNS?

Short story: I build a web app, hosted it on Heroku, I have a domain from a Dutch provider "mijndomein.nl" Now I want to use the custom domain for my app.
I have followed the Heroku guide, but without success, I have watched a few videos, but the DNS settings in the videos are not exactly the same as I have at the mijndomein DNS control panel, and since I don't have a lot of experience setting up DNS and domain pointing I can't figure it out for my self. I will provide a screenshot of the mijndomein settings, and probably you will laugh that I haven't figured it out already and tell me how it works.
I'm confused with the * wildcard domain, and if the www (is a subdomain or not) that's not 100% clear in the Heroku guide. Heroku says that wildcard domains are not allowed when using ACM (automatic SSL certificate), but I need to obtain SSL ofc. and mijndomein's base settings looks to be using a * wildcard DNS. How do I set it up correctly so that when I enter:
oppascentrale.nl -> I go to my heroku app with SSL
www.oppascentrale.nl -> I go to my heroku app with SSL
Do I add with or without 'www' in the heroku control panel when adding custom domain?
This is how mijndomein DNS settings looks like when I do a factory reset
I'm also not sure if I can delete some of the DNS settings lines? I can't read anywhere if any of these different settings will interfere with each other.
As you can see in the shot below, Heroku is not exactly clear about how the custom domain should be added, first with, and then without 'www.' - I have tried both, but neither seemed to work with their SSL.
I also never managed to access my app from oppascentrale.nl, Do I some how have to redirect to www.oppascentrale when hitting oppascentrale.nl? And if yes, how do i set up that?

Pointing GoDaddy DNS to GitHub page uses http over https

I have my DNS settings as shown in the image
DNS Setting along with an additional CNAME with host www and value as my GitHub page. Next I setup a CNAME entry in my GitHub page with an apex entry to my domain. The issue I face is that whenever I visit my domain with an https protocol, it shows a warning that the connection is not secure. I get the following in Chrome:
NET::ERR_CERT_COMMON_NAME_INVALID
How do I fix this? I have both https and http access for my domain.
UPDATE: Github introduced custom domain support for HTTPS on May 1, 2018.
If you are using GoDaddy and want to upgrade to HTTPS, do the following:
Go to DNS settings for your site in your GoDaddy account.
Remove all existing A records.
Open a terminal and do dig +noall +answer <YOUR-USERNAME>.github.io. You should see a table listing 4 slightly different IP addresses:
On GoDaddy, create 4 new A records, each one pointing to one of the IPs. For host use # and set the TTL to a low user-defined value (if you are in a hurry).
Go to your page repository settings on Github, and clear the custom domain name and save. Wait a while (minutes).
When executing dig +noall +answer <YOUR-CUSTOM-DOMAIN> yields the 4 IP addresses that you entered in the A records, go back to the Github repository settings and re-enter and save your custom domain name (which you just cleared) in the custom domain cell.
Optionally, check the box Enforce HTTPS. But make sure that https://<YOUR-DOMAIN>is responsive first.
Make sure you have a CNAME record in your DNS settings also. Host should be www and it should point to your <YOUR-USERNAME>.github.io.
Make sure there is a file in your website repository named CNAME containing the name of your custom domain (in my case ulfaslak.com).
Reference
EDIT: Please see answer below by Arturo Herrero: https://stackoverflow.com/a/50203412/462015
GitHub pages does not support HTTPS for custom domains.
The only work around for doing so is to use an SSL provider as the middle man, such as Cloudflare. However, this would involve pointing your DNS name servers at Cloudflare's, which takes some time and complicates things.
If you want HTTPS support using GitHub pages you'll have to use GitHub's provided URL instead of your custom domain.
Another great option for static sites if you want custom domain name HTTPS is Amazon Web Services. You could set up an S3 bucket for your static website, configure CloudFront to distribute the static content, point your domain name at the CloudFront distribution, and use a free SSL certificate from Amazon's cert manager. This option comes out to less than $1/Month with a low-traffic website. A great in depth tutorial for that would be here.
I hope this answered your question! GitHub pages is a great hosting option, and it's not the end of the world if you decide to forget about HTTPS.
Custom domains on GitHub Pages gain support for HTTPS since May 01, 2018
https://blog.github.com/2018-05-01-github-pages-custom-domains-https/