uniapp微信小程序使用高德天气api

最新推荐文章于 2024-08-07 15:43:21 发布
最新推荐文章于 2024-08-07 15:43:21 发布
阅读量956 收藏 2
点赞数
文章标签： uni-app 微信小程序 小程序
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/niuma_niuma/article/details/131783607
版权
本文介绍了登录高德账户，绑定支付宝并成为个人开发者的过程。接着，详细阐述了如何在开发者控制台创建应用，申请web服务的key，特别是选择了包含天气权限的服务。之后，提到调用API时需将key替换为申请到的web服务key，并指定城市编码来获取天气信息，参考高德API文档以理解返回的数据格式。
摘要由CSDN通过智能技术生成

登录高德用户，绑定支付宝，选择个人开发者

然后进入控制台，我的应用，创建应用，然后申请key

选择web服务，因为web服务包含了天气权限，可以让我们调用网上接口

 获取key，把key换成自己申请完web服务之后的那个key city后面放的是城市编码

具体请求过来的数据格式，可以参考高德api文档

https://restapi.amap.com/v3/weather/weatherInfo?city=110101&key=<用户key>
人码同源
关注
  • 0
    点赞
  • 踩
  • 2
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
【小程序地图】uniapp开发微信小程序，显示地图功能，且点击后打开高德或腾讯地图。
weixin_48596030的博客
06-22 8420
uniapp开发微信小程序，显示地图功能，且点击后打开高德或腾讯地图。
weather-uni-app
03-10
weather-uni-app
uniapp vue 获取天气数据
m0_46978096的博客
05-09 666
【代码】uniapp vue 获取天气数据。
uniapp微信小程序通过高德地图api获取地点和天气
最新发布
Aspen的博客
08-07 313
将其中key替换成自己的（第一步那个），原插件（common文件夹里那个就是）替换成上一步的插件，跟着评论区里大佬调整一下，就ok了。然后将index.vue中的内容 合并到 要获取地点和天气的页面.vue的 中。上面这段放的methods中，原按钮改@tap="refreshData"，另一个按钮删掉。应用管理 - 我的应用 - 创建新应用 - 添加key - 选择微信小程序。本人小白，谈不上懂，就暴力拼接，主打能用就行。一、将两个按钮合成一个。
uni-app 微信小程序 用高德sdk获取地理位置，以及天气信息
liubangbo的专栏
09-06 3961
你可能在开发微信开发者工具中，以及真机调试中都能获取地理位置和天气信息，但发布到体验版，或发布到显示，一直loading 获取不到天气信息。就是因为没有把高德小程序sdk接口用到的URL地址添加到小程序服务器域名中。在这个网页最下面，按步骤来就可以了。注意创建完应用后，点击添加按钮，选择小程序sdk 生成key。注意在接口传递参数中要加上fail 字段，否则控制台会报错。
UNIAPP获取天气
qq_44179528的博客
06-08 5528
onLoad() { uni.request({ url: 'http://wthrcdn.etouch.cn/weather_mini?city=沈阳', method: 'GET', success: res => { console.log("今天的天气",res.data.data.forecast[0].type); console.log("今天最高温度",res.data.data.forecast[0].high);
uniapp获取天气
无双
11-03 1295
uni.request({ url: 'http://wthrcdn.etouch.cn/weather_mini?city=' + city, data: {}, success: (res) => { console.log(res.data) //当前温度 ...
小程序/uniapp 使用高德地图api获取天气
hwjjjjjj的博客
10-14 1761
准备工作： 1.高德地图微信小程序插件js:相关下载-微信小程序插件 | 高德地图API 2.高德地图key：我的应用 | 高德控制台 编写代码 1.引入高德地图js //高德SDKjs import amap from '@/common/amap-wx.130.js'; //自己js的所在的位置 2.创建地图实例 var myAmapFun = new amap.AMapWX({ key: '高德地图申请的key' ...
微信小程序开发——调用免费天气api接口（高德、天气API）
热门推荐
Keeplearning
12-28 1万+
微信小程序开发——调用免费天气api接口一、注册并获取Key二、调用API接口 开发一个现实天气信息的微信小程序，主要的是从网上请求到天气信息数据，网上也有很多介绍免费天气api接口的，我试了好多没法用，或者就是像百度api一样弄了半天没搞明白，我这里使用了高德提供的天气api接口，链接如下： https://lbs.amap.com/api/webservice/guide/api/weatherinfo 一、注册并获取Key 使用时候需要注册获取Key，因为是阿里旗下公司，可以使用支付宝扫码注册。注册后
微信小程序 高德地图路线规划实现过程详解
10-16
在微信小程序中实现高德地图路线规划的过程涉及多个步骤，首先需要了解微信小程序的基本环境和高德地图API的使用。本文将详细介绍这个实现过程，并提供相关的代码示例。 1. 准备工作： - 注册并获取微信小程序的...
uni-app 中微信小程序使用高德地图等第三方 SDK的方法
mengmeng1_的博客
05-04 9174
获取SDK 首先在高德开放平台，注册账号并且申请相关的 key 等信息； 然后下载它的微信小程序版 SDK：微信小程序 SDK 然后填写app包名，申请原生sdk的appkey信息，但不需要下载原生sdk。注意：App侧在Android中使用定位，或者Android、iOS使用地图，仍然需要同时向高德申请原生sdk的key信息，填写在manifest的app sdk配置中。 新建一个 uni-ap...
uniapp多端适配5app开放式天气接口
08-09
uni-app 多端适配 5 app 开放式天气接口
微信小程序-即时天气（已上线）分享
01-27
WeatherWX 微信小程序 由于公司打算要搞一个小程序app,所以趁闲先自己搞一个试试手，小程序搜索----即时天气(已上线)。 浅谈项目 这个项目的天气数据使用了和风的天气api.由于请求用户当前位置的时候只有经纬度，所以又利用了高德的api进行地理反编码。接口方面就这么多了，很简单哈~ 浅谈项目中的难点吧 整体上反正是根据微信小程序官网文档进行开发，有html+css+js的基础的吧，上手很快~就是文档上的wxss的样式代码基本没有，所以有的时候怎么试都不行，像scroll-view，只能百度了，css的知识都忘了很多，像flex,display什么的简直是晕了。反正是一边做一边百度。假如要做一个大项目，看来要买本css的书好好从头看看了。 其他的就是头部的地址展示不会，背景要根据文字自适应,百度后核心代码： <view class='location' bindt
uniapp - 微信小程序利用腾讯地图插件实现搜索地点/位置功能，uniapp小程序平台端使用腾讯地图做搜索城市位置+底部自动根据关键字联想其他相关位置（详细示例源码，一键复制开箱即用！）
高级前端工程师
12-26 3354
uniapp，微信小程序，腾讯地图，uniapp微信小程序 腾讯地图实现地点搜索，uni-app小程序使用腾讯地图完成搜索功能，uniapp中使用腾讯地图，uni-app 微信小程序 地图 支持搜索，uniapp调用腾讯地图实现搜索位置地点名称功能详细教程，uniapp小程序平台如何利用腾讯地图实现搜索城市地点，搜索城市名称，搜索联想相关城市地点位置，uniapp腾讯地图搜索，uniapp 小程序使用腾讯地图搜索位置地点,获取省、市、县地，uni-app-小程序使用腾讯地图原生SDK完成搜索功能，uni-a
uni 获取天气预报
c_qianxia5040的博客
04-14 1780
uni.request({ url: 'http://wthrcdn.etouch.cn/weather_mini?city=' + city, method: 'GET', success: res => { let today = res.data.data.forecast[0] this.todayInfo.weather= today.type ? today.type : '' this.todayInfo.lower = today.low.substr(2) th
uni-app使用高德天气api
weixin_43969547的博客
07-12 2395
首先登录高德开放平台，这里有许多api接口，今天演示一下使用高德的逆地理接口以及天气预报接口，首先注册登录高德开放平台，申请注册成为个人开发者之后即可获得每日配额的api访问次数。高德开放平台 | 高德地图API高德开放平台官网https://lbs.amap.com/进入控制台，在我的应用处创建应用并选择应用类型。勾选web服务， 创建应用之后可以在查看配额中查看到每日请求访问量以及并发量。在使用uni.getlocation的时候，如果提示key访问次数达到上限了之类的，需要在manifest.json
uniapp通过定位获取天气信息，以及获取对应的城市名称
A1123352950的博客
11-07 1846
简单记录一下uniapp如何通过定位获取天气信息，以及获取对应的城市名称问题解决
uniapp通过定位获取当前所在城市的天气
weixin_48829367的博客
12-12 2141
简单进行记录一下，如何通过定位来获取经纬度，在通过高德开放的API来进行天气预报数据的获取。
uniapp微信小程序使用高德地图
08-18
要在uni-app中使用高德地图，需要进行以下步骤： 1. 首先，下载微信小程序版SDK，并将amap-wx.js文件复制到uni-app项目的common目录中。 2. 在uni-app中的index.vue文件中引入高德小程序SDK。可以使用以下代码片段： ``` import amap from '../../common/amap-wx.js'; ``` 3. 在onLoad生命周期方法中初始化一个高德小程序SDK的实例对象，并传入申请的key。可以使用以下代码片段： ``` onLoad() { this.amapPlugin = new amap.AMapWX({ key: this.key }); } ``` 4. 使用高德小程序SDK获取当前位置的地址信息。可以使用以下代码片段： ``` methods: { getRegeo() { uni.showLoading({ title: '获取信息中' }); this.amapPlugin.getRegeo({ success: (data) => { this.addressName = data [3<span class="em">1</span><span class="em">2</span><span class="em">3</span> #### 引用[.reference_title] - *1* *2* *3* [uniapp开发APP和微信小程序——使用高德实现定位](https://blog.csdn.net/qq_42374233/article/details/112857249)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v93^chatsearchT3_1"}}] [.reference_item style="max-width: 100%"] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值