如何解决Docsy主题Hugo站点Lunr.js离线搜索的CSP问题

方法1：重载主题模板替换脚本地址 #

Docsy主题的Lunr脚本引用在特定模板文件中，Hugo支持通过站点自定义模板覆盖主题默认模板，步骤如下：

• 找到Docsy子模块里的layouts/partials/search/offline-search.html文件
• 将该文件完整复制到你的Hugo站点根目录下的layouts/partials/search/路径（目录不存在则手动创建）
• 打开复制后的文件，找到引用unpkg的Lunr脚本行：

  <script src="https://unpkg.com/lunr@2.3.8/lunr.min.js"></script>
  

• 替换为测试可用的cdnjs地址：

  <script src="https://cdnjs.cloudflare.com/ajax/libs/lunr.js/2.3.9/lunr.min.js"></script>
  

• 重新构建部署站点，Hugo会优先使用你自定义的模板，不会被子模块的默认文件覆盖

方法2：本地托管Lunr脚本（彻底消除外部CDN依赖） #

• 下载Lunr.js 2.3.9的压缩版文件，放到你的站点static/js/目录（无此目录则新建）
• 按照方法1的步骤复制并修改offline-search.html模板，将脚本地址改为本地路径：

  <script src="/js/lunr.min.js"></script>
  

• 同时调整CSP规则，允许加载本地脚本（一般配置script-src 'self'即可满足）

方法3：调整CSP规则允许unpkg地址 #

如果不想修改模板，可直接在CloudFront的响应头策略中添加对应规则：

• 登录CloudFront控制台，找到目标分发
• 进入「响应头」配置，创建或修改响应头策略
• 在Content-Security-Policy的script-src中加入https://unpkg.com，最终规则示例：

  script-src 'self' https://unpkg.com;
  

• 保存并部署策略，等待CloudFront生效后即可正常加载unpkg的Lunr脚本

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