微信对话平台API开发
接入官方文档接入文档
下面我们开始使用前端来进行接入
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>客服页面</title>
<style>
/* 设置页面全屏 */
html,
body {
width: 100%;
height: 100%;
margin: 0;
padding: 0;
overflow: hidden;
}
/* 设置 iframe 元素全屏 */
iframe {
width: 100%;
height: 100%;
border: none;
}
</style>
<style>
/* 隐藏底部提供商信息 */
div[data-v-2b354a2a] {
display: none !important;
}
</style>
</head>
<body>
<script>
// 获取配置信息
var APPID = '';
var TOKEN = '';
var EncodingAESKey = '';
// 嵌入到第三方系统-匿名无鉴权
// var urlWithoutAuth = 'https://chatbot.weixin.qq.com/webapp/' + TOKEN + '?robotName=显示在页面顶部的title信息';
// 嵌入到第三方系统-有鉴权
var openid = '用户的唯一标识';
var nickname = '用户昵称';
var avatar = '用户头像';
var robotName = '显示在页面顶部的title信息';
var urlWithAuth = 'https://chatbot.weixin.qq.com/webapp/auth/' + TOKEN + '?openid=' + openid + '&nickname=' +
nickname + '&avatar=' + avatar + '&robotName=' + robotName;
// 创建 iframe 元素
var iframe = document.createElement('iframe');
iframe.setAttribute('sandbox', 'allow-same-origin allow-scripts allow-popups allow-forms');
// 设置 iframe 的 src 属性
iframe.src = urlWithAuth;
// 将 iframe 添加到页面中
document.body.appendChild(iframe);
</script>
</body>
</html>
我们需要注意的就是提交API权限申请通过即可

申请通过后填写在我的前端代码配置地方即可

微信对话平台API开发的更多相关文章
- 微信开放平台API开发资料
微信大概两年前开启了微信公众平台的API供开发者使用,从账号登陆.消息发送.用户账号管理.公众号菜单.客服接口.微信商店接口.用户卡券接口 以及微信支付接口.可以说是全方面覆盖了电商所需要的要素,与阿 ...
- 微信公众平台PHP开发
p=932" style="color: rgb(255, 153, 0); text-decoration: none;">微信公众平台PHP开发 2013.05 ...
- 微信公众平台网页开发实战--3.利用JSSDK在网页中获取地理位置(HTML5+jQuery)
复制一份JSSDK环境,创建一份index.html文件,结构如图7.1所示. 图7.1 7.1节文件结构 在location.js中,封装“getLocation”接口,如下: 01 wxJSSD ...
- 微信公众平台应用开发:方法、技巧与案例--柳峰,Java语言版本
他本人的博客:http://blog.csdn.net/lyq8479 作者简介: 刘运强,网名“柳峰”,资深微信公众平台应用开发工程师,国内微信公众平台应用开发的先驱之一,项目经验丰富.他还是一位资 ...
- 基于微信公众平台的开发(清华大学第二讲)_Alien的笔记
基于微信公众平台的开发(清华大学第二讲)_Alien的笔记 基于微信公众平台的开发(清华大学第二讲)
- 【课程分享】ASP.NET MVC5&微信公众平台整合开发实战(响应式布局、JQuery Mobile,Windows Azure、微信核心开发)
对这个课程有兴趣的,能够联系我QQ2748165793 基础知识储备 ASP.NET MVC 5基础(6讲) 第一讲-初识ASP.NET MVC并搭建整合开发环境 第二讲-深入MVC开发模式 第三讲- ...
- 微信公众平台开发 - 动手篇。使用weinxinFundation开始一个微信公众平台的开发
本文主要讲解如何使用 weinxinFundation 进行二次开发. 步骤如下: 1.创建新的web项目. 在eclipse里新建一个dynamicly web project,比如本文叫weixi ...
- 用node.js进行微信公众平台的开发
基本原理 用nodejs怎样来实现对微信公众平台的开发呢? 别的就不多说了,先来简单介绍微信公众平台的基本原理. 微信服务器就相当于一个转发服务器,终端(手机.Pad等)发起请求至微信服务器,微信服务 ...
- C#微信公众平台账号开发,从零到整,步骤详细。
想到微信的火热,想到其他公司开发手游,如雷电,酷跑类的,都不是很火,但是弱智的“打飞机”和“天天酷跑”却是那么火热.于是乎,想做个微信营销的软件.首先想到的是手机连电脑wifi,用抓包工具抓微信的包, ...
- 微信公众平台java开发详解(工程代码+解析)
原文:http://blog.csdn.net/pamchen/article/details/38718947 说明:本次的教程主要是对微信公众平台开发者模式的讲解,网络上很多类似文章,但很多都让初 ...
随机推荐
- 一文读懂火山引擎A/B测试的实验类型(1)——编程实验
一. 概述 编程实验:指的是通过代码编程进行AB实验,广泛使用于前端优化.策略优化和后端算法优化多种实验场景,包含客户端和服务端实验. 前置条件:接入客户端SDK或者服务端SDK,详见:应用接入 二. ...
- 火山引擎 DataLeap 通过中国信通院测评,数据管理能力获官方认可!
近日,火山引擎大数据研发治理套件 DataLeap 通过中国信通院第十五批"可信大数据"测评,在数据管理平台基础能力上获得认证. "可信大数据"产品能力 ...
- PPT 毕业答辩PPT应该怎么样改
PPT 毕业答辩PPT应该怎么样改
- SecureCRT 取消右击粘贴功能
SecureCRT 默认是选择复制.右击粘贴 但右击粘贴这个功能实在是太方便了,有时候会造成不必要的麻烦.所以一般情况下我是取消这个应用的 设置如下图所示,把勾取消就OK了
- that the pod didn't tolerate, 2 Insufficient cpu.
K8S Pod 一直处于 Pending 状态 有几个原因可以阻止 Pod 运行,但我们将描述三个主要问题: 调度问题:无法在任何节点上调度 Pod. 镜像问题:下载容器镜像时出现问题. 依赖性问题: ...
- Python 批量制作缩略图
本来想网上下个软件处理下的,给我加了水印,不然就让我升会员,程序员都是薅人家羊毛,哪能被人家薅羊毛 1. 安装组件 (指定国内源,速度快些),带上版本号,最新版本会卡在 XXX(PEP 517) 上. ...
- ABAP RSA方式调用工行银企直联API
目录 一.研究背景 二. RSA简介 RSA是非对称加密的一种. 对称加密算法: 在加密和解密时使用的是同一个秘钥:如图所示: 非对称加密算法: 需要一对密钥来加密解密,这两个密钥是公开密钥(pu ...
- 第四届蓝桥杯(2013)C/C++大学A组省赛题解
第一题:高斯日记 大数学家高斯有个好习惯:无论如何都要记日记. 他的日记有个与众不同的地方,他从不注明年月日,而是用一个整数代替,比如:4210 后来人们知道,那个整数就是日期,它表示那一天是高斯出生 ...
- 一文读懂 Serverless 的起源、发展和落地实践
讲师 | 洛浩(阿里云云原生高级架构师) Serverless 的发展轨迹 **2012 年,Serverless 这个单词第一次出现,由 Iron 公司提出,字面意思就是不需要服务器.但是真正被 ...
- Python追踪内存占用
技术背景 当我们需要对python代码所占用的内存进行管理时,首先就需要有一个工具可以对当前的内存占用情况进行一个追踪.虽然在Top界面或者一些异步的工具中也能够看到实时的内存变化,还有一些工具可以统 ...