thinkphp5 微信分享朋友圈集成JS-SDK過程記錄

一、微信公衆號準備工作:

1、設置—公衆號設置—功能設置裏,填寫『JS接口安全域名』

2、加入IP白名單

3、獲取開發者ID和開發者密碼,並添加到config.php中

到2019.5.19日,微信公衆號只做以上準備工作,經測可以實現分享給朋友及朋友圈功能。

二、將官方示例代碼下載:http://demo.open.weixin.qq.com/jssdk/sample.zip

三、將下載的php示例代碼中的access_token.php、jsapi_ticket.php和jssdk.php放入到tp5框架的第三方接口擴展目錄下,路徑爲extend/org/wechat/文件。

四、將jssdk.php文件重命名爲Jssdk.php文件,設置命名空間,因爲tp路由的關係,需要加上私有屬性path,並在構造函數中設置 $this->path = __DIR__ . DS; 

五、將get_php_file以及set_php_file函數返回值中的$filename改爲 $this->path . $filename ,否則會報錯。

六、在app的common文件中加入以下代碼,以下爲借鑑代碼:

七、前端代碼:

<script src="https://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
<script type="text/javascript">
	var imgUrl = "__PC____PUBLIC__/img/logo.jpg";
	var link = "http://www.webqi.cn";
	var descContent = "測試測試";
	var shareTitle = "什麼什麼?";
	wx.config({
		debug: true,
		appId: '{$appId}',
		timestamp: '{$timestamp}',
		nonceStr: '{$nonceStr}',
		signature: '{$signature}',
		jsApiList:[
		'onMenuShareTimeline',
		'onMenuShareAppMessage',
		]
	});
	wx.ready(function(){
      
		wx.onMenuShareTimeline({
		    title: shareTitle, // 分享標題
		    link: link, // 分享鏈接,該鏈接域名或路徑必須與當前頁面對應的公衆號JS安全域名一致
		    imgUrl: imgUrl, // 分享圖標
		    success: function () {
			    // 用戶點擊了分享後執行的回調函數
              
			}
		})
		wx.onMenuShareAppMessage({ 	
	        title: shareTitle, // 分享標題
	        link: link, // 分享鏈接,該鏈接域名或路徑必須與當前頁面對應的公衆號JS安全域名一致
	        desc: descContent,
	        imgUrl: imgUrl, // 分享圖標
	        success: function () {
	        }
	    })

	});
</script>

七、在測試的過程中遇到的坑:

1、發現access_token.php中寫入access_token沒有寫成功,需要做以下操作才能寫成功(也就是第五點的操作):set_php_file函數返回值中的$filename改爲 $this->path . $filename

2、onMenuShareTimeline中的line中的L應爲小寫,俺寫成大寫,結果好一頓測試。

3、將access_token.php等需要寫入的文件賦予可寫入的權限。

4、在thinkphp5上傳文件時提示:請對上傳接口返回JSON字符。經過測試發現是因爲文件沒有上傳成功,而沒有上傳成功的原因也是相關的文件夾的權限不夠。

參考網址:https://www.cnblogs.com/sunshineliulu/p/8034286.html

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章