微信公眾號開發遇到的一些問題

jayzou 發布于2019-08-23 13:55 / 2309人閱讀

摘要：寫這篇文章，主要是在前不久的微信公眾號開發的時候，遇到了一些問題，記錄一下，并希望其他在遇到這些問題，可以進行快速定位及處理。

寫這篇文章，主要是在前不久的微信公眾號開發的時候，遇到了一些問題，記錄一下，并希望其他在遇到這些問題，可以進行快速定位及處理。

微信底部工具欄白條，
1.首先，底部工具欄白條出現的原因是由于，瀏覽器跳轉留下了歷史信息，所以如果我們用H5開發時，如果需要跳轉頁面，使用window.location.replace這樣不會留下歷史信息。
2.由前端獲取微信授權，調用微信的API，微信在授權之后重定向原頁面時，會出現底部工具欄白條，且回退是微信授權的空白頁，體驗極差，處理辦法：其實授權可以讓后臺去調用微信授權，這樣讓后臺重定向頁面的時候，不要留下歷史信息，就可以拿到微信返回過來的參數，這樣也可以減少對后端的多次請求，由后端一次性返回微信返回的參數。

2 . 微信分享

1.微信分享，大家都做過，調用微信API 的分享接口，使用微信瀏覽器的右上角···去進行分享到朋友，或者分享到朋友圈，但是分享出去的是一個圖文模塊，更多產品需求是分享圖片，識別圖中二維碼來進入我們的頁面或者將圖片分享出去，但是微信的分享圖片機制是分享長摁位置的圖片，而不是將頁面直接轉化為圖片
 2. 后臺可以將分享頁面，使用后臺的插件進行繪圖，但是后臺畢竟是服務端語言，對圖形文字字體的處理沒有瀏覽器端處理的完美，比如 如果微信昵稱包含emjio表情包，那么在繪圖的時候就不會展示的很好，因為是是做H5頁面，所以我們可以使用canvas去進行繪制圖片，因為渲染在瀏覽器，所以對emjio的支持度很高
 
直接貼代碼
html
```
   
```
js
```
// 繪圖

var canvas = document.createElement("canvas");

        canvas.width = 750;
        canvas.height = 1206;
    var ctx = canvas.getContext("2d");
    var img = new Image();
    img.onload = function () {
         var img_left = new Image();
        
         img_left.onload = function () {
                 var img_ewm = new Image();
                 img_ewm.onload = function(){
                ctx.font = "24px 黑體";
                ctx.drawImage(img, 0, 0);
                ctx.drawImage(img_left, 310, 160,115,115);
                ctx.drawImage(img_ewm, 310, 925, 115, 115);
                ctx.fillStyle = "#773f15";
                ctx.textAlign="center";
                ctx.fillText(nickName,375,138);//用戶昵稱
                //$("body").html(canvas);
                $(".imageShare").attr("src",canvas.toDataURL("image/jpeg"))
                 }
                 img_ewm.src="../../images/financialTest/ewm.png";//二維碼
                img_ewm.crossOrigin = "anonymous";
         }
         img_left.src="/wechat/getuserImagesV2?urlHead="+urlHead;//用戶頭像
         img_left.crossOrigin = "anonymous";
    }
    img.src="../../images/financialTest/"+imageType;
    img.crossOrigin = "anonymous";
```

 這樣，就可以直接將分享頁轉化為`img`，而且前端繪圖，比后天繪圖，更容易調試和修改。

云服務器 GPU云服務器關于微信公眾號的問題微信公眾號開發微信公眾號開發者模式分享java視頻的微信公眾號

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/99796.html

使用vue開發微信公眾號下SPA站點的填坑之旅

摘要：原文見我的博客，點擊進入使用開發微信公眾號下站點的填坑之旅本文為我創業過程中，開發項目的填坑之旅。作為一個技術宅男，我的項目是做一個微信公眾號，前后端全部自己搞定，不浪費國家一分錢。原文見我的博客，點擊進入使用vue開發微信公眾號下SPA站點的填坑之旅本文為我創業過程中，開發項目的填坑之旅。作為一個技術宅男，我的項目是做一個微信公眾號，前后端全部自己搞定，不浪費國家一分錢^_^。 ...

yeyan1996 2019-08-21 15:09 評論0 收藏0
微信公眾號頁面(VUE)中如何配置微信JS-SDK和高德地圖,以及遇到的一些問題記錄

摘要：安裝并引入依賴包這里是說明文檔下載依賴包在需要用到的模塊引入檢查是否引入成功可以在引入的模塊中執行控制臺顯示以上代碼表示引入成功配置微信所有需要使用的頁面必須先注入配置信息，否則將無法調用開啟調試模式調用的所有的返回值會 1.安裝并引入JS-SDK依賴包這里是JS-SDK說明文檔 1.1 npm 下載依賴包 npm install weixin-js-sdk --save 1.2.在...

Joyven 2019-08-23 17:05 評論0 收藏0
Evil Python

摘要：用將倒放這次讓我們一個用做一個小工具將動態圖片倒序播放發現引力波的機構使用的包美國科學家日宣布，他們去年月首次探測到引力波。宣布這一發現的，是激光干涉引力波天文臺的負責人。這個機構誕生于上世紀年代，進行引力波觀測已經有近年。那些年我們寫過的爬蟲從寫 nodejs 的第一個爬蟲開始陸陸續續寫了好幾個爬蟲，從爬拉勾網上的職位信息到爬豆瓣上的租房帖子，再到去爬知乎上的妹子照片什么的，爬蟲...

Turbo 2019-07-30 15:07 評論0 收藏0
淺析微信支付：前篇大綱

摘要：淺析微信支付前篇大綱本文是淺析微信支付系列文章的第一篇，主要會介紹一下為何寫下這個系列以及對于微信支付的一點小經驗，與君共勉。下面講一下我是如何去學習微信支付的。淺析微信支付：前篇大綱本文是【淺析微信支付】系列文章的第一篇，主要會介紹一下為何寫下這個系列以及對于微信支付的一點小經驗，與君共勉。以下會分幾個步驟講一下我學習微信支付的過程，也是一部辛酸史，也是希望朋友們不要再次跌進...

mayaohua 2019-08-16 13:34 評論0 收藏0