jsp-web端進行QQ和微信的分享

之前開發了關於web頁面上關於微信和qq的分享，今天閑來無事給大家分享一下我自己的開發心得。

首先是QQ的分享--->我介紹的是自定義按鈕分享到QQ，你可以去QQ分享的開發文檔直接引用QQ給的實例QQ分享組件簡介

function shareToQQ() {
		var url = "https://connect.qq.com/widget/shareqq/index.html";
		var shareUrl = "http://www.baidu.com";
		var title = "分享標題";
		var summary = "分享顯示的內容簡介";
		var pics = "圖片地址";
		var width = "32";
		var height = "32";
		var allUrl = url + "?url=" + encodeURIComponent(shareUrl) + "&title=" + title + "&summary="
				+ summary + "&pics=" + pics + "&width=" + width + "&height="
				+ height;
		openNewWin({
			url : allUrl,
			target : "_blank",
		});
	}

接下來我們分析下這段js代碼

var url = "https://connect.qq.com/widget/shareqq/index.html";//qq分享的url

var shareUrl = "http://www.baidu.com";//這個url是點擊分享內容跳轉的鏈接

var title = "分享標題";//分享后顯示的標題

var summary = "分享顯示的內容簡介";//顯示在qq分享界面的簡介內容

var pics = "圖片地址";//分享到QQ顯示的圖片

var width = "32";

var height = "32";

后面我就不介紹分享成功的樣子了，大家自己調試一下就行了

下面是微信的分享---> 因為微信沒有給我們提供相應直接分享的借口，但是微信的自帶瀏覽器有分享功能，所以現在基本上所有的應用做關於微信的分享都是通過微信掃描二維碼，然后通過微信自帶的的瀏覽器進行分享。所以微信分享主要是我們頁面上將我們要分享的鏈接生成相應的二維碼。

因為jQuery有相應的js生成二維碼 ，首先我們先下載jQuery.qrcode.min.js jQuery.qrcode

接下來就是使用js生成二維碼圖片

首先我們應該新建一個div 用來顯示二維碼，並把div的id設置成qrcodeid

   	//此處生成名片二維碼\
		var url = "http://www.baidu.com";
		var the_text = utf16to8(url);
		//alert(the_text);
		$('#qrcodeid').qrcode({
			width : 140,
			height : 140,
			render : "canvas", //設置渲染方式 table canvas
			typeNumber : -1, //計算模式 
			correctLevel : 0,//糾錯等級 
			background : "#ffffff",//背景顏色 
			foreground : "#000000",//前景顏色 
			text : the_text,
		});
   	}
	function utf16to8(str) { //解決中文亂碼
		var out, i, len, c;
		out = "";
		len = str.length;
		for (i = 0; i < len; i++) {
			c = str.charCodeAt(i);
			if ((c >= 0x0001) && (c <= 0x007F)) {
				out += str.charAt(i);
			} else if (c > 0x07FF) {
				out += String.fromCharCode(0xE0 | ((c >> 12) & 0x0F));
				out += String.fromCharCode(0x80 | ((c >> 6) & 0x3F));
				out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
			} else {
				out += String.fromCharCode(0xC0 | ((c >> 6) & 0x1F));
				out += String.fromCharCode(0x80 | ((c >> 0) & 0x3F));
			}
		}
		return out;
	}

接下我們就是調節一下二維碼的位置就可以了。
其實還有很多其他的分享，我就不一一介紹了。感興趣的大家就到網上搜索一下。