微信小程序访问不了阿里云oss图片链接解决办法

已于 2023-12-07 14:14:06 修改
阅读量1.6k 收藏 10
点赞数 9
文章标签： 微信小程序 阿里云 小程序 spring boot java 云计算
于 2023-12-07 13:56:39 首次发布
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/weixin_45810161/article/details/134853691
版权

以下都有可能导致访问不了oss图片

1.小程序没有加访问白名单

这个需要前端搞,加上白名单,如果是域名加域名白名单,ip的话加ip白名单

2.阿里云设置域名白名单

打开bucket列表,选择对应的bucket
在这里插入图片描述
配置这个白名单,配置好以后,开发者工具可以预览了,手机端预览不了,查看自己的路径是不是https开头的,这个时候需要配置域名证书
https://servicewechat.com
在这里插入图片描述
选择bucket中的域名管理,上传证书,不配置证书,改成http访问也行
在这里插入图片描述
这个时候如果还是访问不了,再配置跨域
在这里插入图片描述

该用户已被封禁无法显示
关注
  • 9
    点赞
  • 踩
  • 10
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
微信小程序阿里云OSS-sdk
08-16
阿里云OSS-sdk，大小536KB 微信小程序纯前端从阿里云OSS下载，可直接引用 文章地址：https://blog.csdn.net/qq_44695727/article/details/132154404
微信小程序上传图片到阿里云oss（纯前端）
01-12
微信小程序上传图片到阿里云oss（纯前端）
前端-- 微信小程序图片直传阿里云OSS（bucket私有权限）和防盗链之URL签名标签的实现---总结（排坑）篇
weixin_42112865的博客
05-21 7563
前端-- 微信小程序图片直传阿里云OSS（bucket私有权限）和防盗链之URL签名标签的实现—总结（排坑）篇 为了减轻服务器的压力，公司开发的微信小程序最近开始改为使用啊里云的oss服务来存放图片。用户通过手机相册选择图片（类似发朋友圈）发表，前端调用微信接口直接把图片上传到阿里云的oss存储空间（权限设为私有），后端和前端约定图片的路径，后端拼接图片的url存放在数据库，前端从后台调来的url...
阿里云oss存储视频加防盗链导致ios端微信小程序无法正常播放的问题
yizhousai0662的博客
03-25 558
阿里云oss存储视频加防盗链导致ios端微信小程序无法正常播放的问题
【微信小程序】上传文件到阿里云OSS
IVanLyf的博客
07-10 2941
小程序上传文件到OSS也是利用OSS提供的PostObject接口来实现表单文件上传到OSS 步骤1：配置Bucket跨域访问 客户端进行表单直传到OSS时，会从浏览器向OSS发送带有Origin的请求消息。OSS对带有Origin头的请求消息会进行跨域规则（CORS）的验证。因此需要为Bucket设置跨域规则以支持Post方法。 登录OSS管理控制台。 单击Bucket列表，之后单击目标Bucket名称。 单击权限管理 > 跨域设置，在跨域设置区域单击设置。 单击创建规则，配置如下图所示 步骤
vue 在页面中使用阿里云oss网络图片，解决图片不显示的问题
Suger的博客
02-27 4345
vue 在页面中使用阿里云oss网络图片，解决图片不显示的问题
微信小程序上传图片到阿里云oss
08-08
微信小程序上传文件到阿里云oss存储，改下配置就可以用了
微信小程序调用阿里云oss 代码
qq_32134891的博客
06-27 969
为你的阿里云OSS参数。
微信小程序访问阿里云oss存储资源的方法
热门推荐
ljflemon的博客
07-27 1万+
前言 我们团队的小项目有小视频的上传和浏览的业务场景，一开始我们将视频的上传和浏览都跑在我们1核2G1M的小水管服务器上，整个流程是通的，但就是卡的让人怀疑人生。所以我们考虑将视频上传到阿里云oss服务器上，提升一下访问速度。后面还遇到一些小问题，全部解决之后特意记录总结一下。 注册阿里云账号，开通oss服务 这个就不多说了，目前这种大厂的saas的模式真的是很方便，极大降低了个人和小公司的...
微信小程序上传图片到阿里云OSS，读取上传后oss后的图片
qq_53836672的博客
12-21 932
小程序上传图片到阿里云OSS
微信小程序将资源上传阿里云OSS
weixin_38516972的博客
10-12 2436
微信小程序将资源上传阿里云OSS
微信小程序获取公众号文章列表及显示文章的示例代码
11-21
微信小程序中如何打开公众号中的文章，步骤相对来说不麻烦。 1、公众号设置 小程序若要获取公众号的素材，公众号需要做一些设置。 1.1 绑定小程序 公众号需要绑定目标小程序，否则无法打开公众号的文章。 在公众号管理界面，点击小程序管理 –> 关联小程序 输入小程序的AppID搜索，绑定即可。 1.2 公众号开发者功能配置 (1) 在公众号管理界面，点击开发模块中的基本配置选项。 (2) 开启开发者秘密（AppSecret），注意保存改秘密。 (3) 设置ip白名单，这个就是发起请求的机器的外网ip，假如是在自己电脑那就是自己电脑的外网ip，若部署到服务器那就是服务器的外网ip。
微信小程序上传文件到阿里OSS教程
01-03
这里我们要在小程序后台配置上传域名（上面的域名是我自己的申请的，后台配置的是公司的的域名，使用的时候你们用一套东西即可）。 下图是bucket管理，这里可以新建文件的保存路径，域名管理。 （三）服务端签名直...
微信小程序开发 上传图片或录音文件到oss
02-21
此文件是对微信小程序，上传图片或者录音文件到阿里云oss代码的封装个， 1上传图片引用示例 wx.chooseImage({ count: 3, // 默认最多一次选择9张图 sizeType: ['original', 'compressed'], // 可以指定是原图还是...
微信小程序监听App中的globalData——全局数据监听
qq_45142260的博客
04-23 615
需求：微信小程序项目需要全局监听某个数据。 方法：在 app.ts/app.js 中定义 globalData 公共数据，然后定义一个监听方法 watch，在其他页面或组件中通过使用 【发布订阅 】 模式，进行数据的监听操作。
微信小程序webview和小程序通讯
q759859479的博客
04-23 1091
1.1需要再小程序嵌入vr页面，同时在vr页面添加操作按钮与小程序进行通信交互1.3 开发工具：uniapp开发小程序1.3原型图点击体验官带看跳转小程序的体验官带看页面点击立即咨询唤起小程序弹窗打电话web-view | uni-app官网 (dcloud.net.cn)
从0开始学习制作一个微信小程序 学习部分（2）json文件的说明与app.json文件的操作
最新发布
m0_74475812的博客
04-27 1089
本文是小程序制作系列的学习篇的第二篇 学习篇第一篇我们讲了编译器下载，项目、环境建立、文件说明与简单操作：[第一篇链接](https://blog.csdn.net/m0_74475812/article/details/138244488) 本篇将继续讲解一些基础的编码，分析json文件的作用,着重讲解app.json里可以对小程序进行的切换页面，改变图标等操作。
微信小程序 讯飞录音 点击按钮录音内容转文字
qq_27806371的博客
04-23 364
微信小程序 讯飞录音 点击按钮录音内容转文字
微信小程序，图片上传阿里云oss。写一个例子
05-27
好的，以下是一个简单的微信小程序中图片上传到阿里云OSS的例子： 1. 在微信小程序中，使用wx.chooseImage()方法选择需要上传的图片，并将其保存在本地变量tempFilePaths中。 ``` wx.chooseImage({ success: function(res) { var tempFilePaths = res.tempFilePaths; // 上传图片到阿里云OSS uploadImage(tempFilePaths[0]); } }) ``` 2. 编写上传图片的函数uploadImage()，其中需要设置header、formData、name、url等参数，并调用wx.uploadFile()方法上传图片。 ``` function uploadImage(filePath) { // 阿里云OSS的Bucket名称和上传文件夹名称 var bucketName = 'your-bucket-name'; var folderName = 'your-folder-name/'; // 生成上传文件的唯一key var timestamp = new Date().getTime(); var key = folderName + timestamp + '-' + Math.floor(Math.random() * 10000) + '.jpg'; // 生成OSS的上传接口地址 var policyBase64 = 'your-policy-base64'; var signature = 'your-signature'; var aliyunUrl = 'https://' + bucketName + '.oss-cn-hangzhou.aliyuncs.com'; // 设置header和formData var header = { 'content-type': 'multipart/form-data' }; var formData = { 'key': key, 'policy': policyBase64, 'OSSAccessKeyId': 'your-access-key-id', 'success_action_status': '200', 'signature': signature }; // 调用wx.uploadFile()方法上传图片 wx.uploadFile({ url: aliyunUrl, filePath: filePath, name: 'file', header: header, formData: formData, success: function(res) { // 上传成功，获取图片URL地址 var imageUrl = aliyunUrl + '/' + key; console.log('上传成功，图片URL地址为：' + imageUrl); }, fail: function(res) { // 上传失败 console.log('上传失败：' + res.errMsg); } }) } ``` 需要注意的是，以上代码仅为一个示例，实际使用时需要按照阿里云OSS的规定进行设置，并在后端服务中编写相应的签名验证逻辑。

“相关推荐”对你有帮助么？

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值