Question

我在网上搜索，不确定如何在我的反应应用中设置X-FRAME-OPTIONS，web.config.js看起来像这样，它使用内联选项

当我加载index.html时，它会给出响应X-FRAME-OPTIONS：DENY我需要它将其更改为X-FRAME-OPTIONS：SAMEORIGIN，因为我需要在我的应用程序中打开iframe。现在我收到了chrome错误和firefox错误。

我不确定如何在开发中更新我的web.config.js，我非常困惑。

module.exports = {
  devtool: 'eval',
  entry: {
    app: [
      'react-hot-loader/patch',
      'webpack-dev-server/client?http://0.0.0.0' + web_port,
      'webpack/hot/only-dev-server',
      './src/index'
    ],
    vendor: [
      'react',
      'react-dom',
      'react-router',
      'react-router-dom',
      'react-forms-ui',
      'mobx',
      'mobx-react',
      'sockjs-client',
      'react-table',
      'react-bootstrap-table',
    ],
    fonts: glob.sync("./src/webfonts/*")
  },
  output: {
    path: path.join(__dirname, 'dist'),
    filename: '[name].bundle.js',
    publicPath: '/static/'
  },

Answer 1

X-Frame-Options是一个HTTP标头，它的设置取决于您用作HTTP服务器的应用程序，而不是所服务的文件。在这种情况下，如果您要为webpack-dev-server设置标题，可以这样做（setting in webpack.config.js）：

devServer: {
    ...
    headers: {
        'X-Frame-Options': 'sameorigin'
    }
}

使用create-app反应js如何在webpack上设置X-FRAME-OPTIONS

1 个答案: