最近对Flutter Web产生了兴趣，之前一直在用Flutter写客户端，感觉写的很爽，既然Flutter对Web也进行了支持，我为啥不写一个web的来玩一下呢？ 然后着手写，静态页面写起来基本没啥问题，可是想加接口的时候，却遇到了浏览器跨域问题，很荣幸解决掉了，废话不多说，下面来分享下如何解决的吧：
前置条件：
待请求接口： 这里我们拿这个接口来试验
正常我们使用dio访问：
一定会遇到这个问题： 
讯享网
很明显，浏览器给限制跨域了。怎么解决呢？
解决方案其实蛮多的，对纯前端来说方案很多，Flutter呢，我比较推荐的这几个方法是：
- chrome 安装这个插件 插件地址 ：
安装后，简单配置下下面图中的一些值即可，主要就是
讯享网
然后在Web页面打开对应的开关即可。
- 配置Nginx，配置太多这里就不说了，网上很多。
- 接下来我们重点讲一下flutter特有的方式，参考思路来源前端的解决方案，先来看下前端的方案，对应文章地址：juejin.im/post/…
看到了这里，我正好周末看到dart可以写服务器，那是不是可以参考下？ 于是我找到了这个：
shelf_proxy 简单封装了一下： shelf
很早前我还看到过这个，不知干啥的，现在用到了，才知道原来如此，虽然star不多，但却是Dart官方的，用于本地调试接口使用，还是很靠谱的。
对应到我项目里怎么用的呢？我们来看下 关键代码：
讯享网
然后我把上面的这段代码，保存到前端的一个文件夹里面，放在,然后打开命令行，运行：,代理服务器启动了！
接下来，我们前端的flutter代码，也就是上面的请求，改成
接下来点请求，果然正常拿到结果：
到这为止，跨域的问题完美解决，全部用dart来解决了(这是我最想要的）！😸
当然了，这只是个demo级别的代码，还有很多细的东西可以重写定制。 如果大家有什么更好的建议，欢迎告诉我哦~
ps：为什么要把这个服务文件放在前端，目的是依赖库可以直接用，再就是运行代理服务也方便，后面可以跟运行代码一起启动，比如写个批处理是吧。。。
另外，现在应该运行不行，最近调试了下，需要改动一下shelf_proxy源码，增加对options的支持，可以参考这个change：github.com/dart-lang/s…
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容，请联系我们，一经查实，本站将立刻删除。
如需转载请保留出处：https://51itzy.com/kjqy/180181.html