Flask不响应来自Vue的“GET”请求

时间:2018-02-27 22:20:24

标签: flask webpack vue.js cors axios

我使用Vue.js和Flask创建了一个网站。我使用“localhost”作为主机名在本地计算机上测试,一切正常。但是当我向我的服务器发送代码并使用我的域名(example.com)更改主机名时,虽然我在服务器端(在服务器上打开firefox)时运行良好,但我无法从客户端进行(在我的本地计算机上打开一个firefox)。在web开发者控制台中没有错误(没有任何响应或来自烧瓶控制台的日志),但我注意到,当从客户端访问时,所有的get请求都以某种方式被阻止。我正在使用axios和CORS但不熟悉它们。任何人都可以帮助我吗?谢谢!

以下是我的一些代码。

package.json

中的部分代码

"scripts": { "dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js --public example.com", "start": "npm run dev", "build": "node build/build.js" },

webpack.dev.conf.js

中的部分代码
devServer: {
clientLogLevel: 'warning',
historyApiFallback: {
  rewrites: [
    { from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
  ],
},
hot: true,
contentBase: false, // since we use CopyWebpackPlugin.
compress: true,
host: 'example.com',//HOST || config.dev.host,
port: PORT || config.dev.port,
open: config.dev.autoOpenBrowser,
overlay: config.dev.errorOverlay
  ? { warnings: false, errors: true }
  : false,
publicPath: config.dev.assetsPublicPath,
proxy: config.dev.proxyTable,
quiet: true, // necessary for FriendlyErrorsPlugin
watchOptions: {
  poll: config.dev.poll,
}
},

前端发送请求的ReactPanel.vue中的部分代码

getNaiveMetricsFromBackend(){
        var sub_area_list=this.getAreaConfList()
        const path = `http://example.com:5000/api/naivemetrics`
        axios.get(path, {params:{
            data:JSON.stringify(sub_area_list)
        }})
        .then(response => {
            this.results = response.data.subSet
        })
        .catch(error => {
            console.log(error)
        })
    }

flask_prog.py中用于后端响应的部分代码

# TO avoid {{}} conflict with Vue
class CustomFlask(Flask):
    jinja_options = Flask.jinja_options.copy()
    jinja_options.update(dict(
    block_start_string='<%',
    block_end_string='%>',
    variable_start_string='%%',
    variable_end_string='%%',
    comment_start_string='<#',
    comment_end_string='#>',
    ))

app = CustomFlask(__name__,
static_folder='../../dist/static',
template_folder='../../dist') # To use frontend built files

# use this only when need external visit from frontend
cors=CORS(app,resources={r"/api/*":{"origins":"*"}})

@app.route('/api/naivemetrics/')
def naivemetrics():
    sub_area_str=request.args["data"]            
    res=naiveHandler(sub_area_str)
    response={
        'subSet':res
    }
    return jsonify(response)

0 个答案:

没有答案