刪除 Azure Table 裡所有使用者記錄的問題

今天遇到的問題是 Azure TableStorage 使用上的問題,我們的系統使用了一個 table來記錄使用者註冊時相關的資料,像是 email、facebook帳號… 這個 table 的 partition key 是 type,像是 “email” | “phone” | “facebook”… row key 則為儲存的 data,然後有一個欄位 userId,當使用者使用 email 來登錄系統時,我們就可以用像 pk=”email” rk=”user@gmail.com” 這樣的查詢很快的找到使用者是不是已經登錄過了。

我們的後台有個清除使用者資料的功能,可以用 userId 來清除相關的記錄,最近發現這個程式沒辦法清除所有的資料,而殘留的資料導致測試帳號不能再重複使用。原來清除記錄的程式如下:

var query = new azure.TableQuery().where("userId eq ?", userid);
tableService.queryEntities(tableName, query, null, null, async (err, results) => {
    for (var i = 0; i < results.entries.length; i++) {
        var pk = (<any>results.entries[i]).PartitionKey._;
        var rk = (<any>results.entries[i]).RowKey._;
        Logger.info("deleting table row from accounts.", pk, rk);
        log += "delete:" + pk + "," + rk + "\r\n";
        var deletingAccount = new TableContext.AccountInfo(pk, rk);
        await accountTableContext.deleteAsync(deletingAccount);
    }
});

修改後的程式如下:

let token;

const queryAndDeleteEntities = (tbl, qry, tok) => {
    tableService.queryEntities(tbl, qry, tok, (err, result) => {
        if (err) throw err;

        result.entries.forEach(e => {
            const row = new TableContext.AccountInfo((<any>e).PartitionKey._, (<any>e).RowKey._);
            accountTableContext.deleteAsync(row).then(result => {
                console.log("row deleted.", row, result);
            });
        });

        if (result.continuationToken) {
            queryAndDeleteEntities(tbl, qry, result.continuationToken);
        }
    });
};

queryAndDeleteEntities(tableName, query, token);

原本的程式犯了兩個錯誤,修正如下:

  1. line #4 tableService.queryEntities() 是 async function 整個程式的執行不會停下來,所以在裡面放 log += … 是認知上的錯誤,程式結尾所得到的 log 不會有 callback function 裡執行的東西。
  2. line #14 在查詢 Azure TableStorage 時因為不是 pk/rk 的 query,所以 Azure 會先傳回一部份資料,然後會在 result 上加個 continuationToken,我們必須要使用這個 token 再去要資料回來直到 Azure 告知沒有 continuation token 才結束。

因為須要呼叫 query and delete 好幾次,所以在 line #3 定義了 arrow function,然後在 line #20 才呼叫。

Reactive JS

Reactive JS: Are you ready for the next big paradigm shift? (課程連結)

目前正在練這個課程,

Session 1: Introduction
除了觀念說明之外,先把 playground 架起來:
  • 用 gulp 來 watch code change 然後用 babel 把 js transpile 到 build folder
  • server 部份用 nodemon 來 restart nodejs
  • client 部份用 live-server 來 refresh browser
我實作的過程在此:

一開始我故意沒用 gulp#4.0,結果出現錯誤才改回去

 

 

如何持續不斷的進步?

Eduardo Briceño: How to get better at the things you care about

https://embed.ted.com/talks/lang/en/eduardo_briceno_how_to_get_better_at_the_things_you_care_about

這影片很值得有經驗的工程師一看!

工作了幾年之後,會不會突然發現沒辦法再進步了?工作上雖然都能勝任,遇到問題網路上查查找找,後來都能解決,可是你心理總是有沒辦法再往上提昇的感覺?說不定你只是缺了這影片裡提到的那個 mindset!

到底是什麼方法你們自己去看囉,覺得自己英文聽力不好的,可以先讀 transcript 再看,更重要的是看完之後要試著去做,這也是我成立這個部落格的宗旨之一:別光看,要實作!還有牛人來跟你說這個重要,你就去研究吧,別期待人家來跟你解釋清楚。

 

Angular 2 的起手式

Angular 2 & TypeScript Beginner Web Development (Udemy課程連結)

這堂課的老師有點囉嗦,不過對於基礎還不穩固的新手來說有人苦口婆心是不錯的。

他要求大家別用剪貼的,所有的東西都要自己打一遍。

這跟我的學習方式很吻合,打字不止是慢而且常常會打錯,看起來沒效率,可是剛好相反:

  • 慢,讓你的頭腦有時間去消化吸收新知識。
  • 打錯,讓你訓練你的除錯技巧。
  • 當然最後一定要把東西做出來,才證明你是真的懂。

這是我依照老師所教的,一行一行打出來的:

Section 2: Angular 2 – Creating a Skeleton Project
https://gitlab.com/bentham/ng2-skeleton

Section 3: Angular 2 Fundamentals – Task Card App
https://gitlab.com/bentham/ag2-task-card

建議大家可以依照這個方法來學習:

  • 有決定想學的時候再開始。
  • 一開始先去 Git (我是用 gitlab.com) 建立一個 project。
  • 依照老師的步驟,一行行自己打,熟悉的部份可以用剪貼的。
  • 每一段影片結束後 commit 一次。
  • 如果遇到困難不必等到影片完可以先 commit,事後再 commit 你解決問題的辦法。
  • 日後你可以清楚的看到自己的學習歷程,也可以幫助下個新人。

 

SEO 跟 SPA

花了一天做好了 SEO 相關的功能。

我們的網站大多數的頁面是登入後才能看見內容的,因此搜索引擎的 crawler 即使來訪也看不到東西,為了支持 SEO 只好把一些與個資無關的頁面打開,讓沒有登入的人也可以看見內容,這也會方便日後使用者在 social network 上分享。接著要思考的問題:

  • 公開的網址跟登入後的網址是否為同一個?
  • 由於使用了 Angular,所有的網頁即使網址不同但其實是同一頁,(SPA: single page app),搜索引擎支持嗎?
  • 我們的網頁是依參數來決定內容,排列組合起來有千萬個,如何讓搜索引擎來 crawl ?

結果:

  • 決定把公開跟私密的定義成不同的 route,有些程式可以共用,但是 view 是分開的,維護上也比較容易,免去一堆 ng-if 來控制什麼時候顯示什麼內容。當使用者分享時要產生新的分享網址,而用公開網址進來時如果發現使用者已經登入,可以轉到私密網址去。
  • Google 是支持 SPA 的
    這篇文章有詳細說明 AngularJS & SEO – finally a piece of cake
  • Bing 不支持 SPA,我沒有再進一步去找解決方案。
  • Update meta tag 我選用了這個
    https://github.com/jvandemo/angular-update-meta

只要在 view 裡面加上 update-meta directive 就可以更新 meta tag:

<update-meta name="description" content="{{desc}}"></update-meta>

我沒注意到 keyword 是更新,在原來的網頁上要先有 meta tag 要不然不會更新,還以為是我的程式有問題,花時間走了點冤枉路。

  • 我們決定自己 submit sitemap.xml 來告訴 Google 我們有那些網頁,不過怕 Google 把我們當垃圾內容網站,所以一開始不會馬上給幾百萬個連結。

基本的構想

  1. 別只是讀,自己打出來的程式才是真的。
  2. 快速建立實驗場,驗證自己的了解是否正確?or 只是強記?
  3. 用 Git 記錄學習歷程,方便日後複習。
  4. 用英文學電腦技術,記住英文關鍵字。
  5. 從小地方開始,一次一個小專案。
  6. 我是怎樣學會的?整理學習心得傳給另一個人。

顯示/隱藏 長文字

今天遇到一個問題,在頁面中公司簡介太長,使用者要捲一下才能看到其他的資訊,所以應該要只顯示200個字,然後加上 show more 打開,之後用 show less 收起來。。。

到這裡請停一下,要是你會用什麼關鍵字來找解法呢?是自己想解法寫程式?還是去套即有的元件呢?最好是你自己先試著解決,之後再接著看下去收穫較多。

capture

因為我們的專案是 AngularJs 所以我搜尋了 “angular show more less”,,找到了一個不錯的東西 (MIT license)

https://github.com/ismarslomic/angular-read-more