2013-08-13

[Fiddler] Customize Rules

Fiddler的客製化規則.

最近需要做JavaScript的佈署跟測試,

希望可以在瀏覽網站的時候,如果是prod.xxx.com/scripts/demo.js的request可以導到stg.xxx.com/jsdemo/demo.js

如果只是為了從prod.xxx.com換到stg.xxx.com的話,是可以直接改hosts,但是現在除了FQDN外,還要處理路徑.

對於這樣的需求,如果你是使用Charles Proxy的話,它有個map remote的功能,可以很簡單的設定這樣的需求.

不過在這邊,我要說的是怎麼在Fiddler中設定這樣的功能.

下面是環境,需求及作法.

環境

網站 www.xxx.com : 放置Production網頁
網站prod.xxx.com/scripts/ : 放置production用的JS
網站stg.xxx.com/jsdemo/ : 放置測試用的JS

需求

將瀏覽prod.xxx.com/scripts/*.js的request 都導到測試環境stg.xxx.com/jsdemo/*.js,以便在測試prodcution上測試staging的JS檔.

作法

  1. 開啟Fiddler
  2. 點選[Rules/Customize Rules],這時會用編輯器開啟CustomRule.js這個檔案
  3. 在這個JS檔中找到"OnBeforeRequest"的function.
  4. 在OnBeforeRequest中增加下面的片段
    if (oSession.HostnameIs("prod.xxx.com")) {
        oSession.url = oSession.url.Replace("prod.xxx.com/scripts","stg.xxx.com/jsdemo");
        oSession.host = "stg.xxx.com";
    };
  5. 存檔,然後重新載入網頁.

2013-08-06

[Angular.js] directives in IE8

Angular.js中,使用directive的方式有EACM
Element, Attribute, Class 跟CoMment
也就是你可以在html中使用像下列的標籤
<my-directive></my-directive>
<div my-directive></div>
<div class="my-directive"></div>
<!-- directive: my-directive -->
然後再透過angular.js建立directive,並指定restrict指定那些標籤應該要被套用
var app = angular.module("app",[]).directive("myDirective", function () {
    return {
        restrict: 'A',
        template: "<div>hello world from attribute</div>"
    }
});
使用directive的方式,如果是透過attribute或是class的value的方式,在IE8上沒有甚麼太大的問題.
但是如果是透過element的方式的話,IE8就會出現像下面的錯誤
Error: Unknown runtime errorundefined
而要修正這個問題,你可以在header中加上下面片段
<!--[if lte IE 8]>
  <script>
    document.createElement('my-directive');
  </script>
<![endif]-->
而如果你是透過comment的方式,在IE8也會出現相同的錯誤訊息,
而這時你就要在directive的return的object定義中加上replace:true, 如
app.directive("myDirective", function () {
    return {
        restrict: 'M',
        replace: true,
        template: "<div>hello world from comment</div>"
    }
});
而這個replace這個設定值,也是跟所產生的html很有關係.
你可以在下面這個網址玩玩看.
demo : http://jsfiddle.net/ajunlee/nA2Sr/

最後總結 : 如果要自訂directive的話,比較好的方式還是統一使用attribute或是class的方式.

Google以後可以查祖譜嗎?

今天看到一篇INDISE的文章 : 比爾蓋茲和賈伯斯,他們的孩子都是 14 歲才能用手機 想說比爾蓋茲不是有點年紀了嗎? 他的小孩應該也都不小了. 他們14歲時應該還沒有甚麼智慧手機吧… 說不定還是在BB call的年代. 所以就好奇的用google查一下有沒...