particle.js 没有正确加载到页面上答案

【问题标题】：particles.js not loading on page correctlyparticle.js 没有正确加载到页面上
【发布时间】：2018-05-14 20:27:27
【问题描述】：

HTML 脚本

<div id="particles-js"></div>
<script src="https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js"></script>
<script>
    particlesJS.load('particles-js', 'particles.json',
    function(){
        console.log('particles.json loaded...')
    })
</script>

粒子的 CSS

#particles-js {
    margin-top: 100px;
    width: 100vw;
    height: 400px;
    background: linear-gradient(45deg, #0ac8f8, #081866);
    z-index: 9;
}

现在每当我加载页面时，我都会收到这些错误（在控制台中）：

particles.min.js:9 Failed to load file:///G:/actualtest/particles.json: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
window.particlesJS.load @ particles.min.js:9
(anonymous) @ home.html:66
particles.min.js:9 Error pJS - XMLHttpRequest status: 0
particles.min.js:9 Error pJS - File config not found

【问题讨论】：

标签： javascript html css particles

【解决方案1】：

正如@TemaniAfif 指出的，这里缺少逗号：

<script>
    particlesJS.load('particles-js', 'particles.json'
    function(){
        console.log('particles.json loaded...')'
    })
</body>

...因为底部的内联函数是supposed作为particleJS.load函数调用的参数。它需要一个结束脚本标签。尝试将以上内容替换为：

<script>
    particlesJS.load('particles-js', 'particles.json',
    function(){
        console.log('particles.json loaded...')'
    })
</script>
</body>

【讨论】：

谢谢。我试过了，但现在控制台中出现了意外或无效的令牌错误，不过我猜它的进度。
很高兴知道，现在听起来像是一个身份验证问题。

【解决方案2】：

请尝试以下代码：

<script>
particlesJS.load('particles-js', 'particles.json',
    function(){
        console.log("particles.json loaded...");
    });
</script>

您是否将“particle.json”文件正确保存在您的应用程序运行的根目录中？

【讨论】：

将我的 json 配置添加到编辑中，是的，它在我的应用程序运行的根目录中 @SnowBallz