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


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 相关文章推荐
JavaScript判断DOM何时加载完毕的技巧
Nov 11 Javascript
jQuery实现仿腾讯微博滑出效果报告每日天气的方法
May 11 Javascript
20分钟轻松创建自己的Bootstrap站点
May 12 Javascript
jQuery zTree树插件简单使用教程
Jan 10 Javascript
原生node.js案例--前后台交互
Feb 20 Javascript
理解 Node.js 事件驱动机制的原理
Aug 16 Javascript
[js高手之路]图解javascript的原型(prototype)对象,原型链实例
Aug 28 Javascript
JavaScript数组push方法使用注意事项
Oct 30 Javascript
react-native fetch的具体使用方法
Nov 01 Javascript
vue登录注册及token验证实现代码
Dec 14 Javascript
Vue实现左右菜单联动实现代码
Aug 12 Javascript
vant-ui组件调用Dialog弹窗异步关闭操作
Nov 04 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 字符截取 解决中文的截取问题,不用mb系列
2009/09/29 PHP
php采用file_get_contents代替使用curl实例
2014/11/07 PHP
CakePHP框架Model关联对象用法分析
2017/08/04 PHP
PHP中类型转换 ,常量,系统常量,魔术常量的详解
2017/10/26 PHP
php使用fullcalendar日历插件详解
2019/03/06 PHP
PHP添加PNG图片背景透明水印操作类定义与用法示例
2019/03/12 PHP
PHP的重载使用魔术方法代码实例详解
2021/02/26 PHP
通过ifame指向的页面高度调整iframe的高度
2006/10/05 Javascript
javascript arguments 传递给函数的隐含参数
2009/08/21 Javascript
文档对象模型DOM通俗讲解
2013/11/01 Javascript
瀑布流布局代码一例
2014/04/11 Javascript
javascript实现在网页中运行本地程序的方法
2016/02/03 Javascript
jQuery UI Bootstrap是什么?
2016/06/17 Javascript
微信小程序 出现47001 data format error原因解决办法
2017/03/10 Javascript
input 标签实现输入框带提示文字效果(两种方法)
2017/10/09 Javascript
vue中的event bus非父子组件通信解析
2017/10/27 Javascript
基于elementUI实现图片预览组件的示例代码
2019/03/31 Javascript
Vue动态生成表格的行和列
2019/07/18 Javascript
vue使用i18n实现国际化的方法详解
2019/09/05 Javascript
微信小程序左滑删除实现代码实例
2019/09/16 Javascript
微信小程序全局变量的设置、使用、修改过程解析
2019/09/24 Javascript
node事件循环和process模块实例分析
2020/02/14 Javascript
js实现移动端图片滑块验证功能
2020/09/29 Javascript
可拖拽组件slider.js使用方法详解
2020/12/04 Javascript
python处理数据,存进hive表的方法
2018/07/04 Python
对Python 检查文件名是否规范的实例详解
2019/06/10 Python
flask实现验证码并验证功能
2019/12/05 Python
python打印异常信息的两种实现方式
2019/12/24 Python
Python转换itertools.chain对象为数组的方法
2020/02/07 Python
tensorflow实现训练变量checkpoint的保存与读取
2020/02/10 Python
解析python 中/ 和 % 和 //(地板除)
2020/06/28 Python
行政部工作岗位职责范本
2014/03/05 职场文书
在校实习生求职信
2014/06/18 职场文书
2014年行政人事工作总结
2014/12/09 职场文书
党支部先进事迹材料
2014/12/24 职场文书
一些让Python代码简洁的实用技巧总结
2021/08/23 Python