Udesk即时通讯网页插件发送咨询对象（二、使用专用链接）

本文链接：https://blog.youkuaiyun.com/zczhangzhenqi/article/details/109492799

张振琦

前篇介绍了使用内嵌代码实现发送咨询对象，本篇来介绍一下如果使用的是专用连接，该如何传参。

参数说明：

名称	值	说明
product_title	String	标题
product_url	String	跳转页的链接地址
product_image	String	显示图片地址
product_send	true或false	为true时,咨询对象下方会出现发送按钮,点击发送会将当前咨询对象作为商品消息发送给客服
product_<自定义参数>		可定义多个自定义参数，可为中文

基于前篇的代码简单修改，页面添加iframe来显示专用链接。需要注意一点，拼接进url的参数需要进行urldecode编码

<!DOCTYPE html>
<html>
	<head>
		<meta charset="utf-8">
		<title>IM</title>
		<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
	
		<style>
			.product {
				width:200px;
				float:left;
				padding:20px;
				margin:10px;
				border:solid 1px red;
				border-radius:25px;
			}
			.bt {
				float:right;
			}
		</style>
	</head>
	<body>
	
		
		<div style="width:600px">
			<div class="product">
				<img src="http://img14.360buyimg.com/n1/jfs/t2191/111/699154754/198998/32d7bfe0/5624b582Nbc01af5b.jpg" style="width:200px;height: 200px;">
				<p>Java编程思想（第4版）</p>
				<p>价格：￥108.00</p>
				<p>促销价：￥102.60</p>
				<button type="button" onclick="product1()" class="bt">咨询商品</button>
			</div>
			
			<div class="product">
				<img src="http://img10.360buyimg.com/n1/jfs/t1/119119/28/16355/390609/5f4870aaE11ee9a70/a3942abebcb6534a.jpg" style="width:200px;height: 200px;">
				<p>JavaScript高级程序设计</p>
				<p>价格：￥129.00</p>
				<p>促销价：￥86.50</p>
				<button type="button" onclick="product2()" class="bt">咨询商品</button>
			</div>
			
			
		</div>
		
		<div id="imdiv" style="width:600px;height:500px"></div>
		
		<script>
		
			var imurl = "你的即时通讯专用链接";
			
			
			function product1() {
				
				var title = "Java编程思想（第4版）";
				var url = "https://item.jd.com/10058164.html";
				var image = "http://img14.360buyimg.com/n1/jfs/t2191/111/699154754/198998/32d7bfe0/5624b582Nbc01af5b.jpg";
				
				var product_arg = "product_title="+encodeURI(title)+"&product_url="+encodeURI(url)+"&product_image="+encodeURI(image)+"&product_"+encodeURI("价格")+"="+encodeURI("￥108.00")+"&product_"+encodeURI("促销价")+"="+encodeURI("￥102.60");
							
				$('#imdiv').append("<iframe id='im' style='width:100%;height:100%'  src='"+imurl+"&"+product_arg+"'></iframe>");
				
			}
			
			function product2() {

				var title = "JavaScript高级程序设计";
				var url = "https://item.jd.com/12958580.html";
				var image = "http://img10.360buyimg.com/n1/jfs/t1/119119/28/16355/390609/5f4870aaE11ee9a70/a3942abebcb6534a.jpg";
				
				var product_arg = "product_send=true&product_title="+encodeURI(title)+"&product_url="+encodeURI(url)+"&product_image="+encodeURI(image)+"&product_"+encodeURI("价格")+"="+encodeURI("￥129.00")+"&product_"+encodeURI("促销价")+"="+encodeURI("￥86.50");
							
				$('#imdiv').append("<iframe id='im' style='width:100%;height:100%'  src='"+imurl+"&"+product_arg+"'></iframe>");
				
			}
			
		</script>
	</body>
</html>