我是Flutter Web和GitHub Codespaces的初学者。
在调用http GET API时发生了一个错误,该错误应该是CORS错误。
我必须使用代码空间远程工作,终端环境是Ubuntu 20.04.4 LTS。
Chrome没有安装在那里,所以我在代码空间中打开端口,并通过浏览器连接到它。
请希望你弄清楚我如何能收到我的请求的响应。
谢谢!
代码
import 'package:flutter/material.dart';
import 'package:get/get.dart';
import 'package:http/http.dart' as http;
class TickerController extends GetxController {
RxString text = 'Idle'.obs;
getTicker() async {
text('Start');
var url = Uri.parse('https://api.bithumb.com/public/ticker/ETH_BTC');
var response = await http.get(url);
text(response.body);
}
}
class HomePage extends StatelessWidget {
final TickerController controller;
HomePage({Key? key})
: controller = TickerController(),
super(key: key);
@override
Widget build(BuildContext context) {
return Scaffold(
body: Column(
children: [
ElevatedButton(
child: const Text('Run'),
onPressed: controller.getTicker,
),
Obx(() {
return Text(controller.text.value);
}),
],
),
);
}
}
flutter run -d web-server --web-hostname=0.0.0.0
试试
将代码空间端口可见性设置为“public”
添加请求标头
var response = await http.get(url, headers: {
'Access-Control-Allow-Origin': '*',
'Access-Control-Allow-Credentials': 'true',
'Access-Control-Allow-Headers': 'Origin, Content-Type, X-Amz-Date, Authorization, X-Api-Key, X-Amz-Security-Token, locale',
'Access-Control-Allow-Methods': 'GET, POST',
});
使用python http.server运行
from http.server import HTTPServer, SimpleHTTPRequestHandler
class CORSRequestHandler(SimpleHTTPRequestHandler):
def end_headers(self):
self.send_header('Access-Control-Allow-Origin', '*')
self.send_header('Access-Control-Allow-Methods', 'GET, POST')
self.send_header('Cache-Control', 'no-store, no-cache, must-revalidate')
return super(CORSRequestHandler, self).end_headers()
server = HTTPServer(('localhost', 8000), CORSRequestHandler)
server.serve_forever()
并构建flutter项目flutter build web
,运行python服务器../build/web$
python server.py
2条答案
按热度按时间58wvjzkj1#
要将CodeSpaces端口可见性设置为公共,请在运行Codespaces时转到VSCode中的“ports”选项卡。右键单击导出Web服务器的端口(可能是端口3000),并将“Port Visibility”设置为“Public”。Location of ports tab in VSCode
使用此功能,您可以使用Dart-Debug Chrome扩展在Chrome浏览器上调试Flutter应用。
bqf10yzr2#
将
OPTIONS
添加到Access-Control-Allow-Methods
响应头中,请参阅Preflight request的详细信息。Access-Control-Allow-*
头用于响应,这意味着客户端不应将它们包含到请求中。