React js 使用 create-app 如何在 webpack 上设置 X-FRAME-OPTIONS [英] React js using create-app how to set X-FRAME-OPTIONS on webpack
问题描述
我在网上搜索过,不知道如何在我的 React 应用程序中设置 X-FRAME-OPTIONS,web.config.js 看起来像这样,它使用的是内联选项
I've searched over the net, not sure how to set X-FRAME-OPTIONS in my react app, the web.config.js looks like this, it's using inline option
当我加载 index.html 时,它给出响应 X-FRAME-OPTIONS:DENY 我需要将它更改为 X-FRAME-OPTIONS:SAMEORIGIN,因为我需要在我的应用程序中打开一个 iframe.现在我收到了 chrome 错误和 firefox 错误.
when I load index.html it gives response X-FRAME-OPTIONS:DENY I need it to change it to X-FRAME-OPTIONS:SAMEORIGIN, as I need to open an iframe within my app. Right now I'm getting a chrome error and firefox error.
不确定如何在开发中更新我的 web.config.js,我非常困惑.
Not sure how I can update my web.config.js in development, I'm super confused.
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/'
},
推荐答案
X-Frame-Options
是一个 HTTP 标头,它的设置取决于您用作 HTTP 服务器的应用程序,而不是文件被送达.在这种情况下,如果你想为 webpack-dev-server
设置一个 header,你可以这样做(webpack.config.js
中的设置:
X-Frame-Options
is a HTTP header and setting it depends on the application you use as HTTP server, not on the files being served. In this case, if you want to set a header for webpack-dev-server
, you can do it like this (setting in webpack.config.js
):
devServer: {
...
headers: {
'X-Frame-Options': 'sameorigin'
}
}
这篇关于React js 使用 create-app 如何在 webpack 上设置 X-FRAME-OPTIONS的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!