Query for insects: the case of BOM header manufacturing is blank for no reason

A very strange BUG occurred in a website recently:

 

Next, troubleshoot the error:

In the beginning, it was thought that the before statement in the CSS style had an impact on the page elements. However, before only sets the body elements, but only adds one element, it will not cause the separation distance between so many elements to be opened; and the problem still exists after deleting the: before statement. Therefore, this possibility is ruled out.

Then we began to carefully check (the process was very painful) and found that these problems all have one thing in common: Because the website adopts static implementation and uses static content on the server, and each redundant line appears in each containing file (<! -- # Include virtual = "**. inc" -->. So we can look at the file generation process and remove the line breaks and blank strings that may be generated at the beginning and end of the file generation. However, after the program is updated, the static file is regenerated, and the problem persists.

Later, I could not find the problem. I had to release it to complete other functions. However, this unsolved problem has been lingering in my mind, and I can always think of it. I always wonder why "? If the throat is blurred, it cannot be swallowed. I always feel that the same thing is not done, and it is not practical to do other things.

Because the basic confirmation is that there is a problem with the inclusion of the file, it is concentrated in the file generation and inclusion to exclude. When doing other things, I accidentally thought about the file encoding, so I wondered if it was the impact of this factor. So I searched the internet and found the following articles:

1. What is the BOM header?

2. Explain BOM headers and remove Methods

3. XML BOM

After reading, vaguely think it should be to find the problem; so looked at their own program, found in the generation of static files, using the UTF-8 encoding to set the byte stream, at the same time, the UTF-8 encoding is used when saving to the file, the Code is as follows:

File.WriteAllText(Task.FullPath + filename + Task.Extension, content, Encoding.UTF8);

So I decided to first use UE to remove the BOM header try effect: open a static inc file, save as select "UTF-8 without BOM", BOM header. For example:

 

Save the file and browse it again. It is determined that the BOM header will be parsed as an empty row or block-level element in Some browsers. When saving a file in a program, if the file encoding format is specified as a UTF-8, a bom header is added to the file.

Therefore, when the file is generated, instead of removing the UTF-8 encoding specified when the file is saved, the byte stream still uses UTF-8 encoding.

content = Encoding.UTF8.GetString(bytes);File.WriteAllText(Task.FullPath + filename + Task.Extension, content);

At the same time because the byte stream uses UTF-8 encoding, in the html page needs to specify the page encoding method, otherwise there will be garbled:

<meta http-equiv="content-type" content="text/html; charset=utf-8" />

After the above processing, refresh and view all the inc files in different browsers and solve the problem.

After confirming the cause of the BUG and finally solving the problem, I found an article about the shtml page include problem solution that caused a blank line by the BOM header of UTF-8 !! Why did I find such an article that can accurately guide the solution after I tried to solve the problem?

In addition, we recommend an article on encoding: starting with garbled web programs (Bom header, Character Set, and garbled code)

For program development, the more you know, the less you know. Too many pitfalls. It is absolutely hard to learn.