uniapp中H5在部分老版本机型中打开出现空白页的问题解决

作者: 周星星的学习笔记 | 来源:发表于2022-06-10 16:42 被阅读0次

uniapp中H5在部分老版本机型中打开出现空白页的问题解决
uniapph5部署到服务器刷新页⾯出现404
uniapp弹框遮罩下面内容滑动问题解决
09_之前写过h5吗？有遇到过哪些兼容性问题？说下怎么解决的
uniapp转h5并使用腾讯地图
H5页面收回键盘后留空白区域问题解决
2019-11-25
uniapp中使用websocket，后端为http,非ws
uniapp修改h5打包后的代码路径
微信小程序转uniapp在转h5

这两天一直有一个问题困扰着我，就是使用uniapp开发的H5页面，在部分手机中访问会出现空白页情况。特别是老版本的手机，使用vconsole查看日志，也没有报错信息，但是发现网络请求的状态码是0，请求接口数据是空的，所以界面没有渲染出来，如下图所示，换了其他机子是正常的，用这台机子访问页面就是空白的，一直没有头绪，不知道到底是什么原因。后来网上看到这篇文章感觉现象跟我的差不多，后来试了一下，果然解决了问题，特此记录一下，主要是跨域请求造成的。

image.png

一、解决方案总结两种方式：

方式一：避免跨域请求：将前后端部署在同一个域下面。
方式二：服务端跨域配置：Access-Control-Allow-Headers * 修改为 Access-Control-Allow-Headers: accept, content-type, origin, ... 等等，即将自定义请求头和默认请求头全都写出来的方式。content-type 一定要写上，我之前忘了加了，就出问题了，加上就ok了。