var azure = require('azure-storage'); isn't working

Question

Basing myself on the official guide here https://azure.microsoft.com/en-us/documentation/articles/storage-nodejs-how-to-use-blob-storage/ I understand that using Azure-Storage with js is common, yet, I can't get it to work.

in my webRole app I have installed azure-storage using npm install azure-storage just like the guide instructs and got the node-modules library.

Now my app is looking like that: to avoid confusion I will add my complete app.js file of the app:

'use strict';

/**
 * @ngdoc overview
 * @name yapp
 * @description
 * # yapp
 *
 * Main module of the application.
 */

 angular
 .module('yapp', [
    'ui.router',
    'snap',
    'ngAnimate',
     'ngStorage'
    ])
 .config(function ($stateProvider, $urlRouterProvider) {


     var azure = require('azure-storage');

    $urlRouterProvider.when('/dashboard', '/dashboard/overview');

    $urlRouterProvider.otherwise('/login');

    $stateProvider
    .state('base', {
        abstract: true,
        url: '',
        templateUrl: 'views/base.html'
    })
    .state('login', {
        url: '/login',
        parent: 'base',
        templateUrl: 'views/login.html',
        controller: 'LoginCtrl'
    })
    .state('signup', {
        url: '/signup',
        parent: 'base',
        templateUrl: 'views/signup.html',
        controller: 'SignupCtrl'
    });
});

Once running the application (using google chrome, visual studio standard running of a webrole).

I am getting a blank page with this error: (Needless to mention, without the var azure line the app is working just fine, so it's not a configuration problem).

What to do. I am clueless and about to delete the whole project and start making the web with C#. I am starting to really hate Azure.

that isnt a angular module its a node module so you can't call it as you are doing, node is a backend stack so you must call require('azure-storage') in other place related with node (server.js/app.js) , if you want to use a node module inside angular in the way you are tring to call, you must use browserfy http://blog.npmjs.org/post/114584444410/using-angulars-new-improved-browserify-support — Mariano Montañez Ureta, Jan 11 '16 at 16:11
@MarianoMontañezUreta Connecting directly from the browser to azure blob storage is probably not a good idea. — Paul, Jan 11 '16 at 16:12
for shure, but its what hes trying to do or he need to learn a bit more, this is his second question about the same problem, but is more a missing learning so it will be downvoted when he unterstand the real problem :) — Mariano Montañez Ureta, Jan 11 '16 at 16:14
@MarianoMontañezUreta Yeah, I just wouldn't recommend pointing him to browserify when that could just get him in more trouble later. I think the first half of your comment was useful. PS. For someone to get notified when you respond to them you need to add `@username` to your comment unless you are responding to the person who wrote the post you are commenting on. — Paul, Jan 11 '16 at 16:18
@Paulpro got your point, i will take in mind in the next answers, thanks. — Mariano Montañez Ureta, Jan 11 '16 at 16:19
Mariano I have deleted the first question and posted a more detailed question pointing my exact problem. I can't understand what you mean at all, I gave my entire application library, can you tell me where I should create the variable? Because it's already happening in app.js. — Guy Ben-Moshe, Jan 11 '16 at 16:26
@paulpro I am doing it inside app.js so what exactly am I missing — Guy Ben-Moshe, Jan 11 '16 at 16:31
@GuyBen-Moshe The filename doesn't matter. It just needs to be done on a server not it a browser. You don't appear to be using `node.js` anywhere, but if you were, that would be where you would use `var azure = require('azure-storage');`. — Paul, Jan 11 '16 at 16:33
@paulpro so I have to do it as Frontend <-> Backend <-> Azure? I thought Azure is being used as my Backend.. — Guy Ben-Moshe, Jan 11 '16 at 16:50

score 1 · Accepted Answer · edited May 23 '17 at 11:44

Azure is a cloud platform which provides a large variety of services for developers building their applications, but not simply directly server for browser client.

And Azure-storage SDK in Node is designed for Node.js backend server. Angular is a frontend JavaScript framework but not a Node.js framework, the so Node.js modules (not only Azure-storage) and syntax (like require()) can not be directly used in Angular. Basic it obeys JavaScript syntax.

You can use any tech to build your backend server and leverage Angular to build your frontend app. E.G. Download file via Webservice and Push it to Azure Blob Storage via Node/Express or Upload HTML5 Canvas Converted to Image to Azure using Node/Express

var azure = require('azure-storage'); isn't working

1 Answers1