a web dev proxy server that has implement request cors and cookie cors, base on shelf_proxy
- Modify response headers and cookie for cors in web dev
Define your target host and local proxy host and port in a dart file ,just like :
class LocalProxyConfig{
static String targetUrl = 'https://navi-api.xxx.tech';
static const String localHost = 'localhost';
static const int localPort = 8033;
static const String localProxyUrlWeb = "http://$localHost:$localPort";
}
define a main method in another dart file:
import 'package:web_dev_proxy/src/shelf_proxy_for_web_dev.dart';
import 'proxy_web_local_config.dart';
Future<void> main() async {
await startLocalProxyServerForWebDebug(LocalProxyConfig.localHost,LocalProxyConfig.localPort,LocalProxyConfig.targetUrl);
}
Run the main method in step2
use LocalProxyConfig.localProxyUrlWeb as your base url in project when platform is web.
just like what you will do in nginx when release in web
// 添加上跨域的这几个header
// 这里设置请求策略,允许所有
server.defaultResponseHeaders.add('Access-Control-Allow-Origin', '*');
server.defaultResponseHeaders.add('Access-Control-Allow-Credentials', true);
server.defaultResponseHeaders.add('Access-Control-Allow-Headers', '*');
server.defaultResponseHeaders.add('Access-Control-Max-Age', 36000); //加这个是为了不会每次都检测跨域,然后总会有两次请求
server.defaultResponseHeaders.add('Access-Control-Expose-Headers', '*'); //加这个是为了能获取header里面的其他项
void transferCookies(http.StreamedResponse clientResponse,String localHost) {
String? cookie = clientResponse.headers['set-cookie'];
if (cookie == null || cookie.isEmpty) {
return;
}
//服务器要发送多个 cookie,则应该在同一响应中发送多个 Set-Cookie 标头。
Cookie cookie2 = Cookie.fromSetCookieValue(cookie);
cookie2.secure = true;
cookie2.httpOnly = false;
cookie2.domain = localHost;
clientResponse.headers['set-cookie'] = cookie2.toString() + ";SameSite=None;";
print("reset set-cookie header from $cookie to \n ${clientResponse.headers['set-cookie']}\n");
}