添加XSLT样式表后浏览器无法显示XML：跨域问题求助

问题概述 #

在Microsoft Edge中直接打开本地XML书目文件（关联XSLT样式表）时，页面无内容显示，控制台抛出跨域请求错误：

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at file:///C:/Users/HP/Desktop/TPXML/biblio1.xsl. Reason: CORS request does not use HTTP.

核心原因 #

浏览器同源策略禁止file://协议下的跨资源请求，本地直接打开文件属于file协议而非HTTP/HTTPS协议，因此触发CORS拦截，导致XSLT文件无法加载解析。

解决方案 #

1. 本地HTTP服务器加载（推荐） #

通过HTTP协议访问本地文件，绕过file协议的CORS限制：

• 打开命令行，切换到文件所在目录（C:/Users/HP/Desktop/TPXML）
• 执行对应命令启动本地服务器：
  • Python 3：python -m http.server 8000
  • Node.js（需先安装http-server包）：npx http-server -p 8000
• 在Edge浏览器中访问 http://localhost:8000/biblio.xml，即可正常渲染XSLT转换后的页面。

2. 修改Edge启动参数（临时测试用） #

通过添加启动参数放宽file协议的访问限制，此方法会降低浏览器安全性，仅用于临时测试：

• 右键Edge快捷方式 → 「属性」
• 在「目标」字段末尾添加参数（注意与原有内容间加空格）：
  --allow-file-access-from-files
• 重启Edge，直接打开本地XML文件即可。测试完成后建议移除该参数恢复默认设置。

3. 本地预转换为HTML #

使用XSLT工具提前将XML转换为HTML文件，无需依赖浏览器解析：

• 下载XSLT处理工具（如Saxon）的Java包，执行命令：
  java -jar saxon.jar -s:biblio.xml -xsl:biblio1.xsl -o:biblio.html
• 直接打开生成的biblio.html文件，即可看到渲染后的内容。

额外优化提示 #

原XSLT文件中有文本混淆问题：

<li>Code : <xsl:value-of select="@nom"/></li>
<li>Code : <xsl:value-of select="@age"/></li>

建议将「Code」分别改为「Nom」和「Age」，优化显示：

<li>Nom : <xsl:value-of select="@nom"/></li>
<li>Age : <xsl:value-of select="@age"/></li>

原文件代码 #

biblio.xml #

<?xml version="1.0" ?>
<!DOCTYPE BIBLIO SYSTEM "./biblio0.dtd">
<?xml-stylesheet type="text/xsl" href="./biblio1.xsl"?>
<BIBLIO>
    <ETUDIANT code="E1" nom="Missaoui" prenom="Mostapha" age="20">
        <LIVRE id="L1" titre="Java" dateEmprunt="2022-11-11" rendu="NON"/>
        <LIVRE id="L2" titre="XML" dateEmprunt="2022-12-11" rendu="OUI"/>
    </ETUDIANT>
    <ETUDIANT code="E2" nom="Missaoui" prenom="Abderrahman" age="20">
        <LIVRE id="L1" titre="Java" dateEmprunt="2022-01-11" rendu="NON"/>
    </ETUDIANT>
</BIBLIO>

biblio0.dtd #

<?xml version="1.0" encoding="UTF-8"?>
<!ELEMENT BIBLIO (ETUDIANT+) >
<!ELEMENT ETUDIANT (LIVRE+) >
<!ELEMENT LIVRE EMPTY>
<!ATTLIST ETUDIANT 
             code NMTOKEN #REQUIRED 
             nom CDATA #REQUIRED 
             prenom CDATA #REQUIRED 
             age NMTOKEN #IMPLIED>
<!ATTLIST LIVRE 
             id NMTOKEN #REQUIRED 
             titre CDATA #REQUIRED 
             dateEmprunt CDATA #REQUIRED  
             rendu (OUI|NON) "NON" >

biblio1.xsl #

<?xml version="1.0" encoding="UTF-8"?>
<xsl:stylesheet xmlns:xsl="http://www.w3.org/1999/XSL/Transform" version="2.0">
    <xsl:template match="/">
        <html>
            <head>
                <title>Biblio</title>
            </head>
            <body>
                <h3>Liste des etudiats</h3>
                <xsl:for-each select="/BIBLIO/ETUDIANT">
                    <ul>
                        <li>Code : <xsl:value-of select="@code"/></li>
                        <li>Code : <xsl:value-of select="@nom"/></li>
                        <li>Code : <xsl:value-of select="@age"/></li>
                    </ul>
                    <table border="1" width="75%">
                        <tr><!--ligne-->
                            <th>Id</th>
                            <th>Titre</th>
                            <th>Date</th>
                            <th>Rendu</th>
                        </tr>
                        <xsl:for-each select="LIVRE">
                            <tr>
                                <td><xsl:value-of select="@id"/></td>
                                <td><xsl:value-of select="@titre"/></td>
                                <td><xsl:value-of select="@dateEmprunt"/></td>
                                <td><xsl:value-of select="@rendu"/></td>
                            </tr>
                        </xsl:for-each>
                    </table>
                </xsl:for-each>
            </body>
        </html>
    </xsl:template>
</xsl:stylesheet>

内容的提问来源于stack exchange，提问作者mostapha