Where to put $sceDelegateProvider on MEAN Js

Question

I'm trying to implement the following whitelisting in my project using $sceDelegateProvider: External resource not being loaded by AngularJs

The thing is everywhere I think it should go it keeps throwing errors and I believe I'm not implementing it correctly.

The code can be found here: https://github.com/festiveox/PartyRaptor

Basically, I want to be able to call {{vm.game.video}} (which is a YouTube video URL provided by the user) to be called as the src inside iframe tags on /modules/games/client/views/view-game.client.view.html - like I'm doing with the image tag. I understand that for that I need to white-list or trust the URL source coming from the database, where should I put this code?

In your linked SO answer, it's written into [an AngularJS config block](https://docs.angularjs.org/guide/module#configuration-blocks). Have you tried putting it there? What errors are you getting? — Jorge Valle, Oct 16 '17 at 03:26
I think I've tried? I'm not sure if I put it in the right place.I'm trying to understand within my development where would it go to make it work, since MEAN is different than just a plain Angular application. — mishchief, Oct 16 '17 at 13:23
MEAN is just the stack. The code in question belongs in the AngularJS front end, in a config block. Show us what you have so far, please. — Jorge Valle, Oct 16 '17 at 15:43
Everything is on the github repository I linked. https://github.com/festiveox/PartyRaptor Specifically on the Games module on the modules folder — mishchief, Oct 17 '17 at 16:06

score 0 · Answer 1 · answered Oct 17 '17 at 09:37

That particular code block can be inserted during the config phase, and in MEAN.JS it should be added in this file /modules/core/client/app/init.js, particularly after line 26:

function bootstrapConfig($compileProvider, $locationProvider, $httpProvider, $logProvider, $sceDelegateProvider) {
    $locationProvider.html5Mode({
     enabled: true,
    requireBase: false
    }).hashPrefix('!');

    $httpProvider.interceptors.push('authInterceptor');

    // Disable debug data for production environment
    // @link https://docs.angularjs.org/guide/production
    $compileProvider.debugInfoEnabled(app.applicationEnvironment !== 'production');
    $logProvider.debugEnabled(app.applicationEnvironment !== 'production');


    $sceDelegateProvider.resourceUrlWhitelist([
        // Allow same origin resource loads.
        'self',
        // Allow loading from our assets domain.  Notice the difference between * and **.
        'http://srv*.assets.example.com/**'
    ]);


  }

Angular documentation regarding $sceDelegateProvider here

Where to put $sceDelegateProvider on MEAN Js

1 Answers1