前言

我以前曾使用过并开发了微信的小程序，但是我没有遇到任何H5页面兼容。因此，在使用和开发微信系和H5的过程中，我遇到了许多问题。

1。按钮具有黑色边框

使用标签，检查手机上的黑色边框，设置：无；也没有效果。

原因：该按钮使用伪元素实现边界

解决方案：将标签的伪元素设置为：无或：无；

button:after{ boder:none; }

2。配置反向代理以处理跨域

微信小程序没有跨域问题。如果未配置服务器域名，则无法请求接口。您只需要在不验证法定域名的情况下检查微信开发工具，然后您就可以请求它。

在本地开发环境中，如果在浏览器中调试H5页面，则会发生跨域问题。如果后端不处理它，则前端需要配置反向代理以处理跨域

一个。在.json的源代码视图中，找到H5的配置位置并配置代理

注意：“”必须说出连接使用代理

b。在请求接口中使用

// '/api'就是manifest.json文件配置的devServer中的proxy uni.request({

url: '/api'+ '接口url', ... })

c。配置后，您需要重新启动项目

3。使用uni。（）API上传图像文件

使用此API在微信中上传图像没有问题，但是在H5页面上将图像上传时，上传的文件在后台永远无法获得。

一开始，使用uni。（）API从本地专辑中选择图片或使用相机拍摄照片。成功后，您可以返回图片（）的本地文件路径列表和图片的本地文件列表（每个项目都是文件对象）

在微信小程序中获取临时路径图片，并在浏览器中获取Blob路径图片。微信系列使用uni。（）上传临时路径映像，并且可以成功上传，但是H5无法成功（浏览器中的值传输方法将显示为，而不是文件流文件）

可能的原因：

使用Uni。（）将BLOB文件上传到服务器。后端无法获得后缀名称，并且上传失败。

由uni上传的文件。（）不正确

解决方案：

改为将文件上传到H5中，然后更改Uni的格式。（）上传

H5

微信系

4。包装H5

问题：包装出来，在线部署，页面空白，显示在控制台中

原因：包装配置有问题

解决方案：

一个。 Web配置未选择路由模式，并且运行的基本路径没有填充（它是在开始时写的）

b。 “”设置为空（我不知道为什么，也许不需要配置代理，网站和界面是相同的域名）

"proxy" : { "/api" : { "target" : "xxx", "changeOrigin" : true, "secure" : true, "pathRewrite" : {} } }

注意：上一个接口中的“/API”也需要取消