Question

我正在尝试通过ajax请求将客户端与服务器连接。

我的客户端在localhost：8080上运行，有一个按钮，它调用一个函数，对本地运行的服务器localhost：5000执行简单的ajax请求。

onClick功能：

  handleClick() {
console.log("check flights button was clicked!");
console.log(this.state);
const baseUrl = 'localhost:5000'
ajax.get(`${baseUrl}/flights/${this.state.origin}_${this.state.destination}`)
.end((error, response) => {
  if (!error && response) {
    console.log('got a valid response from the server')
  } else {
    console.log(`Error fetching data from the server: `, error)
  }
});}

用烧瓶实现的（非常）简单服务器如下：

from flask import Flask, request
from flask_restful import Resource, Api
from json import dumps

app = Flask(__name__)
api = Api(app)

class Flights(Resource):
    def get(self, origin, destination):
    answer = 'we got some data ' + origin + ' ' + destination
    print answer

api.add_resource(Flights, '/flights/<string:origin>_<string:destination>')

if __name__ == '__main__':
    app.run()

我可以访问服务器，如果我只是转到localhost：5000 / flights / origin_destination，它会打印一条消息，说明它已收到来源和目的地。但是，当我尝试执行ajax请求时，我收到以下错误：

XMLHttpRequest无法加载localhost：5000 / flights / Porto_Lisboa。交叉源请求仅支持协议方案：http，数据，chrome，chrome-extension，https。

有关如何纠正此行为的任何建议？提前谢谢

Answer 1

如错误所示，您在请求中缺少协议名称。尝试在字符串的开头添加它：

const baseUrl = 'http://localhost:5000'

而不只是localhost:5000

允许使用Flask和React进行CORS请求

1 个答案: