使用Gatsby部署到github页面时的内容安全策略

时间:2019-01-26 16:34:43

标签: javascript reactjs github github-pages gatsby

所以我一直在尝试让我的Gatsby页面与Github页面一起使用,但是我仍然是React和Javascript的新手。

这是仓库(here)。

Firefox控制台抛出此404错误。

Refused to load the image 'http://www.alexingberg.com/favicon.ico' because it violates the following Content Security Policy directive: "img-src data:".

这是我的package.json

{
  "name": "alexing.github.io",
  "description": "alexingberg.com",
  "repository": {
    "type": "git",
    "url": "https://github.com/alexing/alexing.github.io"
  },
  "homepage": "https://alexing.github.io",
  "license": "MIT",
  "scripts": {
    "develop": "gatsby develop",
    "build": "gatsby build",
    "serve": "gatsby serve",
    "deploy": "gatsby build && gh-pages -b master -d public",
    "deploy:github": "npm run build && node ./scripts/deploy-github"
  },
  "dependencies": {
    "@fortawesome/fontawesome-svg-core": "^1.2.12",
    "flexboxgrid": "^6.3.1",
    "font-awesome": "^4.7.0",
    "gatsby": "^1.9.279",
    "gatsby-link": "^1.6.39",
    "gatsby-plugin-google-analytics": "^1.0.24",
    "gatsby-plugin-google-fonts": "0.0.4",
    "gatsby-plugin-sass": "^1.0.23",
    "gh-pages": "^2.0.1",
    "include-media": "^1.4.9",
    "milligram-scss": "^1.3.0",
    "node-sass": "^4.11.0",
    "react-helmet": "^5.2.0"
  },
  "devDependencies": {
    "@fortawesome/fontawesome-free": "^5.6.3"
  }
}

我已经安装了gh-pages,并且试图将www.alexingberg.com用作CNAME。 我想我已经浏览了所有互联网上的问题,但没有找到我所得到的404的答案。

如果您需要更多数据,请告诉我。 谢谢!

1 个答案:

答案 0 :(得分:0)

您可以在项目的根目录下创建一个名为static的文件夹。您放入该文件夹的每个文件都将被复制到公用文件夹中,并将您的CNAME文件放入static/文件夹中,并且在gatsby build的根目录或public/文件夹中将被原样复制,准备通过gh-pages

复制到GitHub Pages

部署脚本看起来像这样

 "deploy": "gatsby build && cp ./static/CNAME public/ &&gh-pages -d public --branch master"

此外,您应该创建一个单独的分支,例如“开发”,然后将分支切换到要部署的主服务器。