现在有一个需求,要在PC微信上打开小程序,然后在小程序里面上传文件。
选择文件第一步需要拉起文件选择器选择文件,wx.chooseMessageFile 再PC小程序上会报错。
解决方案:
用web-view打开一个html文件,然后html里面让用户选择文件进行上传。
<div class="f-bpx" style="margin-top: 40px">
<div class="s-box1">点击上传最终合同</div>
<input id="uploadInput" type="file" name="upload" accept="docx,xlsx,xls" class="s-box2" />
</div>
document.querySelector("#uploadInput").addEventListener("change", function () {
var fileInput = document.getElementById("uploadInput");
var selectedFile = fileInput.files[0];
//selectedFile 就是选择的文件
}
然后获取文件之后可以用axios 上传上去。将这个文件放入服务器,将地址填入web-view的src中
如果要将小程序的token带入,则通过url传值
<web-view :src="https://xxxx.com/index.html?token=123456789" @message="handlePostMessage"></web-view>
然后浏览器中获取
function getUrlParam(name) {
const urlParams = new URLSearchParams(window.location.search);
return urlParams.get(name);
}
getUrlParam(token) //123456789 然后可以把token放入axios的请求头中
如何将结果通知到小程序