記一次微信公眾號的開發與后台搭建

一.背景

　　剛入新公司不久，就碰見一個同事要離職，就交接了這個項目給我。同事的離職比較倉促，所以交接的也不是很好，這也是后面問題偏多的一個客觀原因。項目如題所示，前端采用vue.js+node.js開發，后台采用c#開發接口，還需要開發一個c#的網站來展示數據。上一份工作做的是erp，用的是powerbuilder，所以這個項目還是涉及到比較多的生疏知識。

二.遇到的問題

　　1.微信測試環境搭建

　　　　微信的測試環境搭建還是比較麻煩的（對於新手來說），但是我回過頭去看的時候，也不知道該寫些什么，還是網上找教程吧。

2.微信錄音上傳下載

　　微信錄音如果想要下載的指定路徑，需要先上傳錄音到微信服務器，再根據返回的serverId（即下載的MEDIA_ID）去微信提供的接口下載到你目標路徑，微信測試環境沒問題的話，按照這個基本上就沒有問題，不過調試之類的比較麻煩，只能通過寫日志的方式查看。微信也提供了一個供測試的界面，輸入參數，可以獲取報錯信息。

/// <SUMMARY> 
        /// 下載保存多媒體文件,返回多媒體保存路徑 
        /// </SUMMARY> 
        /// <PARAM name="ACCESS_TOKEN"></PARAM> 
        /// <PARAM name="MEDIA_ID"></PARAM> 
        /// <RETURNS></RETURNS> 
        public string GetMultimedia(string ACCESS_TOKEN, string MEDIA_ID)
        {
            string file = string.Empty;
            string strpath = string.Empty;
            string stUrl = Common.TextHelper.WXUploadMediaUrl+"?access_token=" + ACCESS_TOKEN + "&media_id=" + MEDIA_ID;

            HttpWebRequest req = (HttpWebRequest)HttpWebRequest.Create(stUrl);

            req.Method = "GET";
            using (WebResponse wr = req.GetResponse())
            {
                HttpWebResponse myResponse = (HttpWebResponse)req.GetResponse();

                strpath = myResponse.ResponseUri.ToString();

                WebClient mywebclient = new WebClient();
                string basePath = AppDomain.CurrentDomain.BaseDirectory + "Attachment";//附件臨時存放路徑
                string amrFile = DateTime.Now.ToString("yyyyMMddhhmmssms")+".amr";
                string mp3File= DateTime.Now.ToString("yyyyMMddhhmmssms")+".mp3";
                try
                {
                    mywebclient.DownloadFile(strpath, Path.Combine(basePath, amrFile));
                    ConvertToMp3(Path.Combine(basePath, amrFile), Path.Combine(basePath, mp3File));
                    file = mp3File;
                    //file = amrFile;
                }
                catch (Exception ex)
                {
                    //savepath = ex.ToString();
                }

            }
            return file ;
        }

 

參考文檔: http://www.cnblogs.com/zhangs1986/p/3636234.html

3.微信錄音格式轉換

　　amr格式的文件，網頁不能播放，所以需要轉換成MP3格式，查看了許多都選擇使用第三方工具ffmpeg。剛開始使用的時候，遇到了MP3可以轉成wav格式，但是amr格式不能轉成mp3的尷尬局面。折騰了許久，后面經過檢查才發現用於測試的amr文件壞掉了。這個故事告訴我們一定要細心，還有遇到問題不用慌，深呼吸一口氣，從頭檢查一遍，或許會有收獲。

public string ConvertToMp3(string pathBefore, string pathLater)
         {
             string c = System.Web.HttpContext.Current.Server.MapPath("/ffmpeg/") + @"ffmpeg.exe -i " + pathBefore + " " + pathLater;
             log.WriteLine(c);
             string str = RunCmd(c);
             return str;
         }

        /// <summary>
        /// 執行Cmd命令
        /// </summary>
        private string RunCmd(string c)
        {
            try
            {
                ProcessStartInfo info = new ProcessStartInfo("cmd.exe");
                info.RedirectStandardOutput = false;
                info.UseShellExecute = false;
                Process p = Process.Start(info);
                p.StartInfo.UseShellExecute = false;
                p.StartInfo.RedirectStandardInput = true;
                p.StartInfo.RedirectStandardOutput = true;
                p.StartInfo.RedirectStandardError = true;
                p.Start();
                p.StandardInput.WriteLine(c);
                p.StandardInput.AutoFlush = true;
                Thread.Sleep(1000);
                p.StandardInput.WriteLine("exit");
                p.WaitForExit();
                string outStr = p.StandardOutput.ReadToEnd();
                p.Close();

                return outStr;
            }
            catch (Exception ex)
            {
                return "error" + ex.Message;
            }
        }

參考文檔: http://www.cnblogs.com/LittleBai/p/5924416.html

 

 

4.路徑正確，卻無法獲取附件（iis mine類型配置）

　　公眾號提交的信息包含圖片、音頻、視頻，上傳到服務器后都是放在同一個文件夾，但是網頁顯示的時候，圖片可以訪問，音頻、視頻卻提示不能訪問。問了老大才知道iis上mine類型需要加下配置。由於我之前做的不是網頁開發，甚至不是c#開發，所以很多坑還沒踩過，只能一個個踩過去，才會長記性。所謂經驗，大概就是踩過的坑比較多吧！

5.圖片旋轉

　　這個倒是沒什么好說的，圖片旋轉的簡單實現而已

　

function rotate(row)
{
    var deg = eval('get' + $("#" + row).css('transform'));//構造getmatrix函數,返回上次旋轉度數  
    var step = 90;//每次旋轉多少度  
    $("#" + row).css({ 'transform': 'rotate(' + (deg + step) % 360 + 'deg)' });
}

function getmatrix(a, b, c, d, e, f) {
    var aa = Math.round(180 * Math.asin(a) / Math.PI);
    var bb = Math.round(180 * Math.acos(b) / Math.PI);
    var cc = Math.round(180 * Math.asin(c) / Math.PI);
    var dd = Math.round(180 * Math.acos(d) / Math.PI);
    var deg = 0;
    if (aa == bb || -aa == bb) {
        deg = dd;
    } else if (-aa + bb == 180) {
        deg = 180 + cc;
    } else if (aa + bb == 180) {
        deg = 360 - cc || 360 - dd;
    }
    return deg >= 360 ? 0 : deg;
    //return (aa+','+bb+','+cc+','+dd);  
}

　參考文檔: http://m.blog.csdn.net/cengjingcanghai123/article/details/53537242

　　

　　

三.總結

　　花了將近一個月的時間，雖然過程磕磕碰碰，但總體來說還是完成了任務。不足之處有很多，比如前端樣式賊丑（雖然我不是前端，不過小公司只能前后端兼收並蓄了），比如效率略低（這個是因為我之前做的是pb，c#雖然有基礎，但是實際的開發經驗並不多）。大體來說，對自己的表現還算滿意，畢竟涉及到的東西都不太熟悉，一個月的時候能夠完成任務，打個60分吧！我的優點在於邏輯能力與數據庫（上一份工作是做erp的，虐出來），缺點也很明顯（基礎不夠好，所以還是需要狠補基礎），希望再接再厲！如果寫下的這篇文章能夠解決某個猿的部分問題，可以讓某些猿少踩一個坑，我就挺開心的！文筆不好，絮絮叨叨，求輕虐！