const response = axios({
method: 'post',dataType: 'jsonp',url: 'https://awww.api.com',data: {
'appToken':'','request':{
'applicationName':'ddfdf','userName':'jaime@dfd.com','password':'dfd','seasonIds':[1521ddfdfd5da02]
}
}
});
return{
type:SHARE_REVIEW,payload:'response'
}
}
附件是我的WebPack.config.js
module.exports = {
entry: [
'./src/index.js'
],output: {
path: __dirname,publicPath: '/',filename: 'bundle.js'
},module: {
loaders: [{
exclude: /node_modules/,loader: 'babel',query: {
presets: ['react','es2015','stage-1']
}
},{ test: /\.json$/,loader: "json-loader"}]
},resolve: {
extensions: ['','.js','.jsx']
},devServer: {
historyApiFallback: true,contentBase: './'
},node: {
dns: 'mock',net: 'mock'
},};
解决方法
您也可以尝试使用单独的jsonp模块.据我所知,axios不支持jsonp.所以我不确定您使用的方法是否符合有效的jsonp请求.
对于CORS问题还有另一个糟糕的工作.您必须使用Nginx服务器部署代码,该服务器充当服务器和客户端的代理.
我们将使用proxy_pass指令来解决这个问题.配置您的Nginx服务器,使处理您的特定请求的位置块将proxy_pass或将您的请求重定向到您的实际服务器.
CORS问题通常是由于网站域名的变化而引起的.
当您有一个单独的代理服务器作为您的客户端和服务器的面孔时,浏览器会误以为服务器和客户端位于同一个域中. Ergo没有CORS.
考虑这个例子.
您的服务器是my-server.com,您的客户端是my-client.com
配置Nginx如下：
// Nginx.conf upstream server { server my-server.com; } upstream client { server my-client.com; } server { listen 80; server_name my-website.com; access_log /path/to/access/log/access.log; error_log /path/to/error/log/error.log; location / { proxy_pass http://client; } location ~ /server/(?<section>.*) { rewrite ^/server/(.*)$/$1 break; proxy_pass http://server; } }
在这里,my-website.com将是可访问代码的网站的最终名称(代理网站的名称).
一旦Nginx以这种方式配置.您需要修改请求,以便：
>所有API调用都从my-server.com/\u0026lt;API-path\u0026gt更改;到my-website.com/server/\u0026lt;API-path\u0026gt;
如果您不熟悉Nginx,我会建议您通过documentation.
要简要说明上面配置中发生的事情：
>上游定义了将请求重定向到的实际服务器
>服务器块用于定义Nginx服务器的实际行为.
>如果有多个服务器块,则server_name用于标识将用于处理当前请求的块.
> error_log和access_log指令用于定义日志文件的位置(用于调试)
>位置块定义了不同类型请求的处理：
>第一个位置块处理以/所有这些请求开始的所有请求被重定向到客户端
>第二个位置块处理以/ server /< API-path>开头的所有请求.我们将所有这些请求重定向到服务器.
注意：/ server用于区分客户端请求和服务器端请求.由于域是相同的,因此没有其他区分请求的方法.请记住,没有这样的约定迫使您在所有这些用例中添加/ server.它可以更改为任何其他字符串,例如. / my-server /< API-path>,/ abc /< API-path>等.
尽管这种技术可以解决问题,但我强烈建议您将CORS支持添加到服务器,因为这是处理这类情况的理想方式.
如果您希望在开发时避免这样做,可以使用this chrome扩展.它应该允许您在开发期间执行跨域请求.
