部署SSL证书后，网站particles.js等脚本提示未认证来源如何解决？

AI 小北

2026-5-27

解决WordPress部署SSL后particles.js失效的混合内容问题

这绝对是**混合内容（Mixed Content）**导致的——自从你切换到HTTPS，浏览器会严格阻止HTTPS页面加载任何HTTP协议的资源，哪怕这些资源在你自己的服务器上也不行。Chrome的提示已经说得很清楚了，Safari和Firefox也会有类似的拦截行为。下面是几个针对性的解决步骤，按优先级来：

第一步：检查脚本引用的协议
先找到你加载particles.min.js和app.js的地方——可能是主题的header.php/footer.php，或者是自定义HTML小工具、主题设置里的脚本输入框。把所有硬编码的http://开头的URL改成https://，或者更灵活的相对协议//（比如//yourdomain.com/wp-content/...），这样脚本会自动适配当前页面的协议（HTTP/HTTPS）。

第二步：用WordPress内置函数加载脚本（推荐）
如果你的主题是通过硬编码<script>标签加载脚本的，改成用WordPress官方的wp_enqueue_script函数，它会自动使用网站当前的协议。比如在主题的functions.php里添加：

function enqueue_particles_scripts() {
    // 加载particles核心脚本
    wp_enqueue_script('particles-js', get_template_directory_uri() . '/js/particles.min.js', array(), '2.0.0', true);
    // 加载你的自定义app.js，依赖particles-js
    wp_enqueue_script('particles-app', get_template_directory_uri() . '/js/app.js', array('particles-js'), '1.0.0', true);
}
add_action('wp_enqueue_scripts', 'enqueue_particles_scripts');

这样就完全不用担心协议不匹配的问题了，get_template_directory_uri()会自动输出带正确协议的主题目录URL。

第三步：全局修复网站内的HTTP引用
如果你之前整个网站都是HTTP的，切换SSL后可能还有很多地方遗留HTTP链接。可以：
1. 先去WordPress后台「设置」→「常规」，把「WordPress地址（URL）」和「站点地址（URL）」都改成https://开头的。
2. 备份数据库后，用phpMyAdmin执行SQL语句替换内容里的HTTP链接：
```
UPDATE wp_posts SET post_content = REPLACE(post_content, 'http://yourdomain.com', 'https://yourdomain.com');
UPDATE wp_postmeta SET meta_value = REPLACE(meta_value, 'http://yourdomain.com', 'https://yourdomain.com');
```
  注意把yourdomain.com换成你的实际域名，wp_是你的数据库前缀（如果改过的话要对应）。
第四步：清除所有缓存
不管是WordPress的缓存插件（比如WP Rocket、W3 Total Cache），还是浏览器的缓存，都彻底清一遍——有时候旧的HTTP引用会被缓存，导致修改后还是不生效。
排查小技巧
打开Chrome开发者工具（F12），切换到「Console」标签，里面会明确指出哪个资源是HTTP协议被拦截的，跟着这个提示去修改对应的引用，效率会更高。

内容的提问来源于stack exchange，提问作者J-P