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


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 面向对象 function类
May 13 Javascript
JS实现距离上次刷新已过多少秒示例
May 23 Javascript
jquery插件推荐浏览器嗅探userAgent
Nov 09 Javascript
jQuery结合HTML5制作的爱心树表白动画
Feb 01 Javascript
javascript实现获取浏览器版本、浏览器类型
Dec 02 Javascript
JavaScript过滤字符串中的中文与空格方法汇总
Mar 07 Javascript
js前端日历控件(悬浮、拖拽、自由变形)
Mar 02 Javascript
jQuery使用正则验证15/18身份证的方法示例
Apr 27 jQuery
webpack踩坑之路图片的路径与打包
Sep 05 Javascript
bootstrap table sum总数量统计实现方法
Oct 29 Javascript
AjaxUpLoad.js实现文件上传
Mar 05 Javascript
node.js 微信开发之定时获取access_token
Feb 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框架之路由与控制器
2017/05/07 PHP
Yii框架分页实现方法详解
2017/05/20 PHP
php安装扩展mysqli的实现步骤及报错解决办法
2017/09/23 PHP
js 面向对象的技术创建高级 Web 应用程序
2010/02/25 Javascript
picChange 图片切换特效的函数代码
2010/05/06 Javascript
JS按位非(~)运算符与~~运算符的理解分析
2011/07/31 Javascript
jquery在Chrome下获取图片的长宽问题解决
2013/03/20 Javascript
你必须知道的Javascript知识点之&quot;this指针&quot;的应用
2013/04/23 Javascript
js 页面元素的几个用法总结
2013/11/18 Javascript
js加入收藏以及使用Jquery更改透明度
2014/01/26 Javascript
如何编写高质量JS代码
2014/12/28 Javascript
JS实现单行文字不间断向上滚动的方法
2015/01/29 Javascript
JS解析XML实例分析
2015/01/30 Javascript
jQuery+jRange实现滑动选取数值范围特效
2015/03/14 Javascript
使用bootstrap validator的remote验证代码经验分享(推荐)
2016/09/21 Javascript
浅谈JavaScript中的apply/call/bind和this的使用
2017/02/26 Javascript
vue中使用rem布局代码详解
2019/10/30 Javascript
js实现点击上传图片并设为模糊背景
2020/08/02 Javascript
vue 调用 RESTful风格接口操作
2020/08/11 Javascript
jQuery实现简单全选框
2020/09/13 jQuery
如何手写简易的 Vue Router
2020/10/10 Javascript
Python浅拷贝与深拷贝用法实例
2015/05/09 Python
Python中Class类用法实例分析
2015/11/12 Python
实例探究Python以并发方式编写高性能端口扫描器的方法
2016/06/14 Python
Python实现使用卷积提取图片轮廓功能示例
2018/05/12 Python
Django 全局的static和templates的使用详解
2019/07/19 Python
在python中实现同行输入/接收多个数据的示例
2019/07/20 Python
Python打印特殊符号及对应编码解析
2020/05/07 Python
Oakley官网:运动太阳镜、雪镜和服装
2016/09/30 全球购物
Overload和Override的区别。Overloaded的方法是否可以改变返回值的类型
2013/10/30 面试题
实习鉴定范文
2013/12/19 职场文书
纠风工作实施方案
2014/03/15 职场文书
部门2014年度工作总结
2014/11/12 职场文书
网吧员工管理制度
2015/08/05 职场文书
导游词之金鞭溪风景区
2019/09/12 职场文书
mysql如何配置白名单访问
2021/06/30 MySQL