Can I access MVC web.config values in my angularjs module config method? - angularjs

Question

How do I pass my MVC web.config values to my angular module config method?
I want to set the $logProvider.debugEnabled value with parameter from my MVC web.config. This way I won't have to remember to change the setting as I move from Dev to Test to Prod.
I have found a solution for passing parameters that are accessible from my angular controller, but I need them in my config method.
Here is what I have now in my app.js
(function () {
var app = angular.module("myApp", ['configSettings']);
app.config('settings', [function (settings, $logProvider) {
var envr = settings.serverConfig;
if (!envr == "LOCAL") {
$logProvider.debugEnabled(false);
}
}]);
}());
Thanks in advance,
John

Answer 1

I'm using a custom http handler for this:
public class JavascriptResourceHandler : IHttpHandler
{
#region IHttpHandler Members
public bool IsReusable
{
// Return false in case your Managed Handler cannot be reused for another request.
// Usually this would be false in case you have some state information preserved per request.
get { return true; }
}
public void ProcessRequest(HttpContext context)
{
var sb = new StringBuilder();
sb.Append("var js = {};");
sb.Append("js.settings = { ");
var settings = ConfigurationManager.AppSettings.AllKeys.Where(k => k.StartsWith("JS_")).ToList();
for (int i = 0; i < settings.Count; i++)
{
var key = settings[i];
var name = key.Replace("JS_", string.Empty);
var value = ConfigurationManager.AppSettings[key];
sb.Append(name);
sb.Append(":");
sb.Append("'");
sb.Append(HttpUtility.JavaScriptStringEncode(value));
sb.Append("'");
if (i != settings.Count - 1)
sb.Append(",");
}
sb.Append("};");
context.Response.Clear();
context.Response.ContentType = "text/javascript";
context.Response.Write(sb.ToString());
}
#endregion
}
then add this handler into <system.webServer><handlers>:
<add name="JavascriptResourceHandler" verb="GET" path="JavascriptResourceHandler.axd" type="MyNamespace.JavascriptResourceHandler, MyAssembly, Version=1.0.*, Culture=neutral" />
reference this from html:
<script src="~/JavascriptResourceHandler.axd"></script>
then use JS_ prefix for config values to propagate these to javascript (this is for security reason because we do not want usually propagate all app settings to client side code):
<add key="JS_Key" value="MyConfigValue" />
config values will be available in javascript:
var myValue = js.settings.Key; // the JS_ prefix will be automatically removed
your example:
(function () {
var app = angular.module("myApp", ['configSettings']);
app.config('settings', [function (settings, $logProvider) {
var envr = js.settings.serverAppSettingsKeyWithoutJSPrefix;
if (!envr == "LOCAL") {
$logProvider.debugEnabled(false);
}
}]);
}());