How to host static website of 'multiple pages' on google cloud - google-cloud-platform

I have followed everything from the above link. By following the link .I had hosted my website on google cloud. My static website contains multiple pages(5 pages). In the hosted website I cant find images and other html pages except "index.html" page.
Can anyone please help me by letting me know how to host static website of multiple pages and letting me know how to keep my website secured?, so it would be very helpful for me.
https://codelabs.developers.google.com/codelabs/cloud-webapp-hosting-gcs#5

i think reason behind image is not loading is
you examine the file paths for your files, also be sure that you spelled the name of the image correctly.
refer this link for more details.

Since you didn't provide any more details I can only give you some pointers on what to focus on.
Create a bucket named www.yourdomain.com - www is very important unless you just want to use just yourdomain.com.
Change access permissions so everyone can read it's contents.
Upload your files to the main directory. When someone accesses the site first file that GCP will look for is index.html so make it your home page. Make sure you uploaded all of them. If the images in your page are stored in a folder (img, images etc) then upload that folder with the files inside to your bucket. From your description it looks like either you're missing them or they are in the wrong folder.
Obtain your own SSL certificate or use GCP's managed certificate (free of charge)
Set up a load balancer
Point your domain to your LB's external IP
At that point you're ready to go and your site is up & running.
If this is the first time you're doing it I recommend to start from readin official documentation on how to set up a static website in GCP.
You can access your site without using load balancer to check if it's running correctly by using a link in the format https://storage.googleapis.com/my-bucket/my-object. Have a look at the truobleshooting static websites to get more insight.
Have a look at my other answer covering this topic: https://stackoverflow.com/a/64442826/12257250
Alternatively you can try hosting your site using firebase.

Related

How to host images stored inside S3 static website, over HTTPS?

I have an S3 bucket which I'm using for storing images uploaded by users. Then I save paths to those images in my database, each path looks like so https://bucket-name.s3.eu-central-1...
I then added an image resizing feature which requires the S3 bucket to be a static website, so that redirection rules can be used.
Appearantly this static website thingy made it impossible to download those pictures using old paths with https protocol, and because my website is using https - I can't make http requests. So now all the profile pictures of the users aren't displayed at all.
I'm looking for a solution to this problem. I can change pictures' paths stored in the database if needed.
One possible solution I have in mind is using a subdomain with CloudFront, e.g. pictures.my-website.com/name-of-the-picture.png
Do you think it'll work and it's a good solution, or there is a better way?
Use CloudFront as a server with predefined domain and SSL certificates https://medium.com/#tsubasakondo_36683/serve-images-with-cloudfront-s3-8691d5c387b6

Redirect wrong URL/path DigitalOcean Spaces

I'm using Digital Ocean Spaces CDN to host a static website, so far so good, if I it my index.html everything is working as expected.
The problem I'm facing now, is that if the user hit any path which that is not index.html it gets back an Access Denied error.
I've looked inside the Digital Ocean Spaces CDN Settings and found nothing about redirecting on wrong url/path
Is there a way I could achieve that?
I would need a service like cloudflare in front of my CDN?
Sorry, but looking around on the web got me nowhere so far.
You need to check a couple of things:
You need to make all HTML files public
Enable File Listing
DO Spaces does not support static page hosting (if someone visits your domain, you cant make redirection from "/" to "/index.html". IMO that's big no no. If you want free static hosting, just use https://www.netlify.com/ or git hosts (Github and Gitlab).

Why isn't AWS CloudFront updating my files?

I'm new to AWS.
But, I have an S3 Bucket containing a static website and it is hooked up to CloudFront. Originally, I had just a "under construction" HTML file. But since I removed it and actually added my website, I'm still seeing the old HTML.
If I browse to the cloudfront.net or the us-east-1.amazonaws.com I can see my full website. But its when I browse to my actual domain name when I see the old HTML.
I have changed the meta-data to to one hour and I also tried the same within CloudFront TTLs.
I also read that I had to invalidate my old file, which I did do but it doesnt seem to be doing anything.
Any suggestions would be appreciated!

Hosting a Tumblr blog on Amazon Web Services as subdomain

How do I use a custom (sub)domain (or secondary page) on AWS to 'host' a Tumblr blog?
I'm using Amazon S3, CloudFront, and Route 53 to host a static website. The static news/blog section I've made lives under http://wavefrontbiometric.com/news.html. So far, so good.
Now I've set up a blog/news page on Tumblr (so http://wavefrontbiometric.tumblr.com) that I want to have replace http://wavefrontbiometric.com/news.html. I understand that this might need to change to a two-level structure http://news.wavefrontbiometric.com/), and that's fine.
So far I've tried following these instructions from Tumblr, but with no luck. I've added a 'Hosted Zone' on Route 53 for http://news.wavefrontbiometric.com/, but failed to point the C-NAME record to 'domains.tumblr.com'.
Basically I'm using Tumblr as a backend for the news page only. Users shouldn't be able to notice any visual difference from any other page. I've already got my HTML & CSS markup perfected.
Any help is much appreciated. Thank you.
The only interaction between Tumblr and your (sub)domain is Route53. No other services are needed. Your subdomain should be a CNAME as shown in the instructions; if that isn't working, something is wrong in your Tumblr configuration, which is outside the scope of stackoverflow.

S3 Static Website Only Displays Index.html (but not other dependent files)

I've been messing around with AWS lately and it definitely great. As a first test I'm trying to host the most basic static website via S3. The site is simply just one html file and a few javascript, css and image files.
Whenever I load the static URL the only thing that loads is the index.html file, its contents and for some strange reason the only image that loads is my avatar, yet all the images are stored in the same folder. All of the css, js and image files are also written as relative links too of course.
I've made sure all the files and folders permissions are set to "world" multiple times.
I also looked at the network tab in dev tools and its giving me 200's on every GET request.
I'm completely stumped as to why this is happening. Does anyone have an idea of what I'm missing?
The url is available at http://www.mikefisher.io.s3-website-us-east-1.amazonaws.com/
I should add that the site works perfectly locally as well as on a traditional web server.
I checked my browser console and it gives me this error which I think might have something to do with it.
Resource interpreted as Stylesheet but transferred with MIME type binary/octet-stream:
Fixed it!
The issue I was having is the metadata for the CSS files in Amazon S3 were set to 'binary/octet-stream' by default.
The way I fixed this was selecting the individual files in the bucket, clicking the properties tab, then in the meta-data section typing in 'text/css' as the value.