Facing issues with Blazor webapp deployed on Netlify

Support
, , , ,
1

I’m pretty new to web development, I might talk non-sense. After following some tutorials I’ve found a way to deploy a Blazor webapp on Netlify. For that I’m using a DotNet action on Github. It works almost perfectly, here is is the link: https://chefty.netlify.com. The thing is, my website is blocked by my antivirus (Avast). Page is stuck on “Loading…” blank screen saying “An unhandled error has occurred. Reload”. I ended up looking for solutions and found out that it could come from the fact I’m missing a _headers file. People were also advising to add a _redirects file. So I added those to the root of my website, next to index.html:
_headers

/*
X-Frame-Options: DENY
X-XSS-Protection: 1; mode=block
Referrer-Policy: no-referrer
X-Content-Type-Options: nosniff

_redirects

/* /index.html 200

I also used this website https://securityheaders.com to test my url headers and I get a D grade… When I check my github action workflow those two files are there, in the dist folder I deploy. Then when I dot Inspect element sources on my page, there files are missing, no idea why. Any help would be much appreciated !

Cheers,

2

Heya, welcome! Can you share your file structure and/or a link to your repo (if it’s public)? At first glance, it looks like your header attributes aren’t indented, so that could be part of the problem for that file. Have you tried something like:

/*
  X-Frame-Options: DENY
  X-XSS-Protection: 1; mode=block
  Referrer-Policy: no-referrer
  X-Content-Type-Options: nosniff

The _redirects file looks right to me!

As for files not appearing where you expect them after deploy, are you using a build command in the Netlify UI? It would be here:

3

Hi ! Thank you. Sure, here is my repo: https://github.com/Chefty/Portfolio.
I think the indentation should be ok with my files ? I followed this thread to be sure.
I checked if the files were there by doing a right click on my webpage then, inspect element, in the sources tab. I can see the index and other folders but no _headers or _redirects files.
About Netlify continuous deployment due to the fact my website is not static I can’t use it. It needs to build to re-update everything. I use Github workflows action, you can check it out in my repo in .github/workflows/dotnetcore.yml. I hope you can find what I am doing wrong there…

4

I’m not super familiar with this framework so take this guidance with that grain of salt, but scanning this tutorial, it seems like there is a build to /dist folder step that is missing from your setup. I see in your Github actions yaml that you’re deploying a Portfolio/dist directory to Netlify, but I’m not able to see that in your repo anywhere. Can you confirm that when you create that directory locally, it contains your _redirects and _headers files?

5

I’ve already been through this tutorial and I guess It might solve my problem to deploy my project this way. Although I would be a bit disappointed to give up all the time I spent trying to setup this automated workflow to build/deploy from Github to Netlify on every commit. In the end, I’m not even sure those two files are what causing Avast antivirus blocking my website…
Also, I did check if my Portfolio/dist build folder was containing those files and it does, here is a screenshot:

image
image1407×565 22.5 KB

At this time I didn’t add the _headers yet but it should be there if _redirects was.

6

Hi, @Chefty, there are three non-printing bytes at the start of the _headers file causing it not to be proceesed:

$ hexdump -C  _headers
00000000  ef bb bf 2f 2a 0a 20 20  58 2d 46 72 61 6d 65 2d  |.../*.  X-Frame-|
00000010  4f 70 74 69 6f 6e 73 3a  20 44 45 4e 59 0a 20 20  |Options: DENY.  |
00000020  58 2d 58 53 53 2d 50 72  6f 74 65 63 74 69 6f 6e  |X-XSS-Protection|
00000030  3a 20 31 3b 20 6d 6f 64  65 3d 62 6c 6f 63 6b 0a  |: 1; mode=block.|
00000040  20 20 52 65 66 65 72 72  65 72 2d 50 6f 6c 69 63  |  Referrer-Polic|
00000050  79 3a 20 6e 6f 2d 72 65  66 65 72 72 65 72 0a 20  |y: no-referrer. |
00000060  20 58 2d 43 6f 6e 74 65  6e 74 2d 54 79 70 65 2d  | X-Content-Type-|
00000070  4f 70 74 69 6f 6e 73 3a  20 6e 6f 73 6e 69 66 66  |Options: nosniff|
00000080

It is the first three bytes (ef bb bf) causing this issue. If you delete those three bytes from this file, the headers will begin working.

Yes, I spend time doing binary (or hexadecimal in this case) analysis of text files. Why would I do such a thing? Because I’ve seen this root cause before. :smiley:

3 Likes
7

Hi, sorry for the late reply, I ended up using a Github Page for my website…
Thanks anyway @luke for your help, it fixed my issue !
Now I got a B grade on https://securityheaders.com and the website is not anymore blocked by my antivirus.