微信小程序获取公众号文章列表及显示文章的示例代码


Posted in Javascript onMarch 10, 2020

微信小程序中如何打开公众号中的文章,步骤相对来说不麻烦。

1、公众号设置

小程序若要获取公众号的素材,公众号需要做一些设置。

1.1 绑定小程序

公众号需要绑定目标小程序,否则无法打开公众号的文章。
在公众号管理界面,点击小程序管理 --> 关联小程序

微信小程序获取公众号文章列表及显示文章的示例代码

输入小程序的AppID搜索,绑定即可。

微信小程序获取公众号文章列表及显示文章的示例代码

1.2 公众号开发者功能配置

(1) 在公众号管理界面,点击开发模块中的基本配置选项。

微信小程序获取公众号文章列表及显示文章的示例代码

(2) 开启开发者秘密(AppSecret),注意保存改秘密。
(3) 设置ip白名单,这个就是发起请求的机器的外网ip,假如是在自己电脑那就是自己电脑的外网ip,若部署到服务器那就是服务器的外网ip。

微信小程序获取公众号文章列表及显示文章的示例代码

2、获取文章信息的步骤

以下只是作为演示。

实际项目中在自己的服务端程序中获取,不要在小程序中直接获取,毕竟要使用到appid、appsecret这些保密性高的参数。

2.1 获取access_token

access_token是公众号的全局唯一接口调用凭据,公众号调用各接口时都需使用access_token。API文档

private String getToken() throws MalformedURLException, IOException, ProtocolException {
		// access_token接口https请求方式: GET https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
		String path = " https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential";
		String appid = "公众号的开发者ID(AppID)";
		String secret = "公众号的开发者密码(AppSecret)";
		URL url = new URL(path+"&appid=" + appid + "&secret=" + secret);
		HttpURLConnection connection = (HttpURLConnection) url.openConnection(); 
		connection.setRequestMethod("GET");
		connection.connect();
		
		InputStream in = connection.getInputStream();
		byte[] b = new byte[100];
		int len = -1;
		StringBuffer sb = new StringBuffer();
		while((len = in.read(b)) != -1) {
			sb.append(new String(b,0,len));
		}
		
		System.out.println(sb.toString());
		in.close();
		return sb.toString();
	}

2.2 获取文章列表

API文档

private String getContentList(String token) throws IOException {
		String path = " https://api.weixin.qq.com/cgi-bin/material/batchget_material?access_token=" + token;
		URL url = new URL(path);
		HttpURLConnection connection = (HttpURLConnection) url.openConnection(); 
		connection.setRequestMethod("POST");
		connection.setDoOutput(true);
		connection.setRequestProperty("content-type", "application/json;charset=utf-8");
		connection.connect();
		// post发送的参数
		Map<String, Object> map = new HashMap<>();
		map.put("type", "news"); // news表示图文类型的素材,具体看API文档
		map.put("offset", 0);
		map.put("count", 1);
		// 将map转换成json字符串
		String paramBody = JSON.toJSONString(map); // 这里用了Alibaba的fastjson
		
		OutputStream out = connection.getOutputStream();
		BufferedWriter bw = new BufferedWriter(new OutputStreamWriter(out));
		bw.write(paramBody); // 向流中写入参数字符串
		bw.flush();
		
		InputStream in = connection.getInputStream();
		byte[] b = new byte[100];
		int len = -1;
		StringBuffer sb = new StringBuffer();
		while((len = in.read(b)) != -1) {
			sb.append(new String(b,0,len));
		}
		
		in.close();
		return sb.toString();
	}

测试:

@Test
	public void test() throws IOException {
		
		String result1 = getToken();
		Map<String,Object> token = (Map<String, Object>) JSON.parseObject(result1);
		String result2 = getContentList(token.get("access_token").toString());
		System.out.println(result2);
	}

微信小程序获取公众号文章列表及显示文章的示例代码

转换成json格式,参数说明查看上面的API文档

微信小程序获取公众号文章列表及显示文章的示例代码

微信小程序获取公众号文章列表及显示文章的示例代码

其中第二张图片中的url即为公众号文章的地址,获取到多少片tem项中就会有多少项,只要得到上面的结果那么在小程序中打开公众号文章已经成功一大半了。

最后在小程序中利用<web-view src="...."></web-view>组件打开即可,src中为文章的url地址。

微信小程序获取公众号文章列表及显示文章的示例代码

到此这篇关于微信小程序获取公众号文章列表及显示文章的示例代码的文章就介绍到这了,更多相关小程序获取公众号文章列表内容请搜索三水点靠木以前的文章或继续浏览下面的相关文章希望大家以后多多支持三水点靠木!

Javascript 相关文章推荐
IE中createElement需要注意的一个问题
Jul 13 Javascript
Javascript中的默认参数详解
Oct 22 Javascript
JavaScript中使用Object.create()创建对象介绍
Dec 30 Javascript
JS实现漂亮的淡蓝色滑动门效果代码
Sep 23 Javascript
Javascript中作用域的详细介绍
Oct 06 Javascript
Extjs让combobox写起来简洁又漂亮
Jan 05 Javascript
利用Query+bootstrap和js两种方式实现日期选择器
Jan 10 Javascript
探索webpack模块及webpack3新特性
Sep 18 Javascript
jquery动态添加带有样式的HTML标签元素方法
Feb 24 jQuery
Vue 理解之白话 getter/setter详解
Apr 16 Javascript
vue 需求 data中的数据之间的调用操作
Aug 05 Javascript
javascript实现图片轮换动作方法
Aug 07 Javascript
jquery实现烟花效果(面向对象)
Mar 10 #jQuery
非常漂亮的js烟花效果
Mar 10 #Javascript
微信小程序搜索框样式并实现跳转到搜索页面(小程序搜索功能)
Mar 10 #Javascript
微信小程序实现搜索功能
Mar 10 #Javascript
原生JS实现烟花效果
Mar 10 #Javascript
JS实现iframe中子父页面跨域通讯的方法分析
Mar 10 #Javascript
详解vue-template-admin三级路由无法缓存的解决方案
Mar 10 #Javascript
You might like
PHP与已存在的Java应用程序集成
2006/10/09 PHP
ThinkPHP 防止表单重复提交的方法
2011/08/08 PHP
Zend的MVC机制使用分析(一)
2013/05/02 PHP
php中关于socket的系列函数总结
2015/05/18 PHP
win7系统配置php+Apache+mysql环境的方法
2015/08/21 PHP
php实现贪吃蛇小游戏
2016/07/26 PHP
Date对象格式化函数代码
2010/07/17 Javascript
Js如何判断客户端是PC还是手持设备简单分析
2012/11/22 Javascript
JS调用CS里的带参方法实例
2013/08/01 Javascript
JS图片无缝、平滑滚动代码
2014/03/11 Javascript
javascript实现简单的二级联动
2015/03/19 Javascript
JavaScript整除运算函数ceil和floor的区别分析
2015/04/14 Javascript
JS中判断字符串中出现次数最多的字符及出现的次数的简单实例
2016/06/03 Javascript
浅谈Nodejs应用主文件index.js
2016/08/28 NodeJs
scroll事件实现监控滚动条并分页显示(zepto.js)
2016/12/18 Javascript
利用Vue实现移动端图片轮播组件的方法实例
2017/08/23 Javascript
jQuery实现的淡入淡出与滑入滑出效果示例
2018/04/18 jQuery
JavaScript解析机制与闭包原理实例详解
2019/03/08 Javascript
Vue 开发必须知道的36个技巧(小结)
2019/10/09 Javascript
python的numpy模块安装不成功简单解决方法总结
2017/12/23 Python
在PyCharm下打包*.py程序成.exe的方法
2018/11/29 Python
python实现连连看辅助之图像识别延伸
2019/07/17 Python
python计算波峰波谷值的方法(极值点)
2020/02/18 Python
python中Ansible模块的Playbook的具体使用
2020/05/28 Python
Python延迟绑定问题原理及解决方案
2020/08/04 Python
Selenium alert 弹窗处理的示例代码
2020/08/06 Python
利用Python如何制作贪吃蛇及AI版贪吃蛇详解
2020/08/24 Python
Python中用xlwt制作表格实例讲解
2020/11/05 Python
非常震撼的纯CSS3人物行走动画
2016/02/24 HTML / CSS
HTML5 body设置全屏背景图片的示例代码
2020/12/08 HTML / CSS
新加坡领先的在线生活方式和杂货购物网站:EAMART
2019/04/02 全球购物
日本酒店、民宿、温泉旅馆、当地旅行团中文预订:e路东瀛
2019/12/09 全球购物
酷瑞网络科技面试题
2012/03/30 面试题
护理学应聘自荐书范文
2014/02/05 职场文书
服务整改报告
2014/11/06 职场文书
同事去世追悼词
2015/06/23 职场文书