Javascript bundle obfuscation and Bundletransformer

Question

I was trying to obfuscate the output of our JavaScript bundles on the fly and came across the bundletransformer (a bundling extension that uses YUI Compressor), but had no success implementing it! So far by reading the provided documentation I've written the following code in the RegisterBundles method:

        var nullBuilder = new NullBuilder();           
        var cssTransformer = new CssTransformer();

        var yuiSettings = new BundleTransformer.Yui.Configuration.YuiSettings();
        yuiSettings.JsMinifier.ObfuscateJavascript = true;

        var jsTransformer = new JsTransformer();

        var nullOrderer = new NullOrderer();

        var scriptBundle = new CustomScriptBundle("~/jscbundle/").Include(
                      "~/Assets/Scripts/jquery.js",
                      "~/Assets/Scripts/jquery-ui.js");

        scriptBundle.Builder = nullBuilder;
        scriptBundle.Orderer = nullOrderer;


        scriptBundle.Transforms.Add(jsTransformer);

        bundles.Add(scriptBundle);

and the following code in the web.config :

<bundleTransformer xmlns="http://tempuri.org/BundleTransformer.Configuration.xsd">
<core>
  <css>
    <minifiers>
      <add name="NullMinifier" type="BundleTransformer.Core.Minifiers.NullMinifier, BundleTransformer.Core" />
      <add name="YuiCssMinifier" type="BundleTransformer.Yui.Minifiers.YuiCssMinifier, BundleTransformer.Yui"  />
    </minifiers>
    <translators>
      <add name="NullTranslator" type="BundleTransformer.Core.Translators.NullTranslator, BundleTransformer.Core" enabled="false" />
    </translators>
  </css>
  <js defaultMinifier="YuiJsMinifier" usePreMinifiedFiles="true">
    <minifiers>
      <add name="NullMinifier" type="BundleTransformer.Core.Minifiers.NullMinifier, BundleTransformer.Core" />
      <add name="YuiJsMinifier" type="BundleTransformer.Yui.Minifiers.YuiJsMinifier, BundleTransformer.Yui" />
    </minifiers>
    <translators>
      <add name="NullTranslator" type="BundleTransformer.Core.Translators.NullTranslator, BundleTransformer.Core" enabled="false" />
    </translators>
  </js>
</core>
<yui>
  <css compressionType="Standard" removeComments="true" lineBreakPosition="-1" />
  <js compressionType="Standard" obfuscateJavascript="true" preserveAllSemicolons="false" disableOptimizations="false" ignoreEval="false" severity="0" lineBreakPosition="-1" encoding="UTF8" threadCulture="en-us" />
</yui>

Judging from the bundle output I can infer that not only it's not obfuscated but the compression is not taking effect at all! I could not find any samples online and tried changing a few settings here and there with no luck! So I'm pretty clueless and any solutions or suggestions would be much appreciated. Thanks in advance!

score 3 · Answer 1 · edited May 25 '16 at 15:50

Bahador,

Actually, we only need very simple code:

namespace TestYui
{
    using System.Web.Optimization;

    using BundleTransformer.Core.Bundles;
    using BundleTransformer.Core.Orderers;

    public class BundleConfig
    {
        public static void RegisterBundles(BundleCollection bundles)
        {
            var nullOrderer = new NullOrderer();

            var scriptBundle = new CustomScriptBundle("~/jscbundle/");
            scriptBundle.Include(
                "~/Assets/Scripts/jquery.js",
                "~/Assets/Scripts/jquery-ui.js");
            scriptBundle.Orderer = nullOrderer;

            bundles.Add(scriptBundle);
        }
    }
}

And settings in the Web.config file:

<configuration>
    …
    <bundleTransformer xmlns="http://tempuri.org/BundleTransformer.Configuration.xsd">
        <core>
            <css>
                <minifiers>
                    <add name="NullMinifier" type="BundleTransformer.Core.Minifiers.NullMinifier, BundleTransformer.Core" />
                    <add name="YuiCssMinifier" type="BundleTransformer.Yui.Minifiers.YuiCssMinifier, BundleTransformer.Yui" />
                </minifiers>
                <translators>
                    <add name="NullTranslator" type="BundleTransformer.Core.Translators.NullTranslator, BundleTransformer.Core" enabled="false" />
                </translators>
            </css>
            <js defaultMinifier="YuiJsMinifier">
                <minifiers>
                    <add name="NullMinifier" type="BundleTransformer.Core.Minifiers.NullMinifier, BundleTransformer.Core" />
                    <add name="YuiJsMinifier" type="BundleTransformer.Yui.Minifiers.YuiJsMinifier, BundleTransformer.Yui" />
                </minifiers>
                <translators>
                    <add name="NullTranslator" type="BundleTransformer.Core.Translators.NullTranslator, BundleTransformer.Core" enabled="false" />
                </translators>
            </js>
        </core>
    </bundleTransformer>
    …
</configuration>

Rather, problem is caused by fact, that the web application run in debug mode.

Switch a web application to release mode by using the following settings in the Web.config file:

<configuration>
  …
  <system.web>
    <compilation debug="false"  … />
    …
  </system.web>
  …
</configuration>

Or add to the App_Start\BundleConfig.cs file the following code:

BundleTable.EnableOptimizations = true;

Before you read the documentation for Bundle Transformer, i recommend to read chapter “Bundling and Minification” of the ASP.NET MVC 4 tutorial.

Thank you for your response and sorry about the code mess, as I said I was clueless and was trying to set the setting manually... so any way I will try it again with the code you provided and will report here shortly. BTW The debug was already set to "false" and EnableOptimizations to "true". — Bahador Izadpanah, Apr 07 '14 at 08:57
Dear @Andrey, Unfortunately the result is still the same and I've also noticed that the code you kindly provided does not contain any setting regarding obfuscation, I've alse added the tag after the tag like the one mentioned in my original question, but either way the result still seems minified but not obfuscated and the comments are not removed either. Can you kindly suggest a way to debug whether the YUI module is being called or not? or any means of debugging the process? Thank you very much for your help. — Bahador Izadpanah, Apr 07 '14 at 09:26
I just noticed that the bundler code you provided does not contain the code for adding new JsTransformer, isn't that needed? — Bahador Izadpanah, Apr 07 '14 at 09:35
I wrote detailed answer in the [«Javascript bundle obfuscation»](https://bundletransformer.codeplex.com/discussions/541419) discussion on bundletransformer.codeplex.com. — Andrey Taritsyn, Apr 07 '14 at 13:10

Javascript bundle obfuscation and Bundletransformer

1 Answers1