2016-04-02 19 views
0

Yönetici paneli ile mükemmel çalışan bir uygulama var.MEAN uygulaması

Sunucum dinlediği: http://localhost:3003/#/admin/

Şimdi yönetici paneli ve istemci panelini ayırmak istiyorum, ama müşteri paneli ı çalıştığımızda gibi erişilebilir değil: http://localhost:3003

yönetici paneli burada erişebilir Bu url, gösteri şey

http://localhost:3003/#/client

benim server.js dosyası da ekspres v 10.xxbirden çok görünüm sağlayan güncelledikgibi:

app.set('views', [__dirname + '/admin/views', __dirname + '/client/views']);

Sorunun Bu yönetici/index.html her zaman işlemek

app.get('/', function (req, res) { res.render('index.html'); });

ile olduğunu düşünüyorum.

İşte dizin yapıyorum! Burada

mean-app 
     ----admin 
       | 
       -----js 
        | 
        ---controllers 
        ---app.js 
       -----views 
        | 
        ---partials 
        ---index.html 
     ----client 
       | 
       -----js 
        | 
        ---controllers 
        ---app.js 
       -----views 
        | 
        ---partials 
        ---index.html 

    config 
    controllers 
    services 
    models 
    node_modules 
    services 
    bower_components 
    package.json 
    bower.json 
    server.js 

benim server.js olduğunu

var express   = require('express'); 
var app     = express(); 
var bodyParser  = require('body-parser'); 
var mongoose   = require('mongoose'); 
var apiRoutes  = require('./config/api-routes'); 
var auth    = require('./config/authorization'); 

app.set('views', [__dirname + '/admin/views', __dirname + '/client/views']); 
app.engine('html', require('ejs').renderFile); 
app.use(bodyParser.urlencoded({extended:true})); 
app.use(bodyParser.json()); 

var dbUrl = process.env.MONGOLAB_URI || "mongodb://127.0.0.1:27017/ecommerce-app-db"; 
var port = process.env.PORT || 3003; 

mongoose.connect(dbUrl); 


app.listen(port, function(){ 
     console.log('Listening on port ' + port); 
}); 

app.get('/', function (req, res) { 
    res.render('index.html'); 
    }); 

    app.get('/partials/:name', function (req, res) { 
    console.log(req.params.name); 
    res.render('partials/' + req.params.name); 
    }); 


app.use('/adminjs', express.static(__dirname + '/admin/js')); 
    app.use('/clientjs', express.static(__dirname + '/client/js')); 
    app.use('/bower_components', express.static(__dirname + '/bower_components')); 
    app.use('/images', express.static(__dirname+'/uploads/')); 

    // Load Api routes 
    apiRoutes(app, auth); 

Yönetici

var adminApp = angular.module('adminApp', [...]); 
adminApp.constant('SERVERURL', 'http://localhost:3003'); 
adminApp.config(['$routeProvider', function($routeProvider){ 
     $routeProvider 
      .when('/admin', { 
       redirectTo: '/admin/dashboard' 
      }) 
      .when('/admin/dashboard', { 
       templateUrl: 'partials/dashboard.html', 
       controller: 'MainCtrl' 
      }) 
      .otherwise({ 
       redirectTo: '/admin' 
      }); 
}]); 

Müşteri app.js app.js

var clientApp = angular.module('clientApp', [...]); 
clientApp.constant('AppConfig', { 
    'APP_NAME' : 'Web Shop', 
    'SERVERURL': 'http://localhost:3003', 
    'META_TITLE': 'Web Shop' 
    }); 
clientApp.config(function ($routeProvider, $locationProvider) { 
    $routeProvider 
     .when('/client', { 
     templateUrl: 'partials/main.html', 
     controller: 'MainCtrl' 
     }) 
    .otherwise({ 
     redirectTo: '/client' 
     }); 

    // prevent preflight request for cross-domain Ajax calls 
    $httpProvider.defaults.useXDomain = true; 
    delete $httpProvider.defaults.headers.common['X-Requested-With']; 

    }); 

Müşteri index.html

<!doctype html> 
<html ng-app="clientApp"> 
    <head>  
<link rel='stylesheet' href='bower_components/bootstrap/dist/css/bootstrap.css' /> 
</head> 
    <body> 
<div ng-view=""></div> 
<script src="bower_components/jquery/dist/jquery.js"></script> 
<script src="bower_components/angular/angular.js"></script> 
<script src="clientjs/app.js"></script> 
<script src="clientjs/controllers/main.js"></script> 
</body> 
</html> 
+0

Senin sorunun istemci tarafı yolları ile bir sorunu özetleyen başlar istemci index.html geçerli: '' http: // localhost: 3003/#/client'' ve '' http: // localhost: 3003/#/admin'' ancak verilen kod sunucu yapılandırmasıyla ilgili. Sunucu yapılandırması iyi görünüyor, ancak bunu doğrulamak için çalışma kodunu görmem gerekiyor. Sorunu tanımlamak için rotalarınızın istemci tarafında nasıl yapılandırıldığını görmek isterim.''' Http: // localhost: 3003/client /' 'adresine giderseniz, sunucu tarafındaki kısmi istemci tarafını görürsünüz. Bir istemci tarafı yapılandırma sorunu yaparsanız. –

+0

@DrJones Yükleyemiyorum 'http: // localhost: 3003/client /' beni yönlendiriyor http: // localhost: 3003/' –

cevap

0

Tamam bir çözüm buldum, umarım birilerine yardımcı olur.

Dizin YAPISI olarak söz konusu gösterilen kalır, işte

var express   = require('express'); 
var app     = express(); 
var bodyParser  = require('body-parser'); 
var mongoose   = require('mongoose'); 
var apiRoutes  = require('./config/api-routes'); 
var auth    = require('./config/authorization'); 

app.set('views', __dirname); 
app.engine('html', require('ejs').renderFile); 

//Add middleware necessory for Rest API's 
app.use(bodyParser.urlencoded({extended:true})); 
app.use(bodyParser.json()); 

// CORS Support 
app.use(function(req, res, next) { 
    res.header('Access-Control-Allow-Origin', '*'); 
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE'); 
    res.header('Access-Control-Allow-Headers', 'Content-Type'); 
// var ip = req.headers['x-forwarded-for'] || req.connection.remoteAddress; 
    //console.log('Client IP:', ip); 

    next(); 
}); 


var dbUrl = process.env.MONGOLAB_URI || "mongodb://127.0.0.1:27017/ecommerce-app-db"; 
var port = process.env.PORT || 3003; 

mongoose.connect(dbUrl); 

app.listen(port, function(){ 
     console.log('Listening on port ' + port); 
}); 

app.get('/admin', function (req, res) { 
    res.render('admin/views/index.html'); 
}); 

app.get('/client', function (req, res) { 
    res.render('client/views/index.html'); 
}); 


app.get('/admin/partials/:name', function (req, res) { 
    res.render('admin/views/partials/' + req.params.name); 
}); 


app.get('/client/partials/:name', function (req, res) { 
     res.render('client/views/partials/' + req.params.name); 
}); 

app.use('/admin/adminjs', express.static(__dirname + '/admin/js')); 
app.use('/client/clientjs', express.static(__dirname + '/client/js')); 

app.use('/admin/bower_components', express.static(__dirname + '/bower_components')); 
app.use('/client/bower_components', express.static(__dirname + '/bower_components')); 

app.use('/images', express.static(__dirname+'/uploads/')); 

    // Load Api routes 
    apiRoutes(app, auth); 

benim yönetici

burada
var adminApp = angular.module('adminApp', [....]); 

adminApp.constant('SERVERURL', 'http://localhost:3003'); 

adminApp.config(['$routeProvider', function($routeProvider){ 
     $routeProvider 
      .when('/admin', { 
       redirectTo: '/admin/dashboard' 
      }) 
      .when('/admin/dashboard', { 
        templateUrl: 'partials/dashboard.html', 
        controller: 'MainCtrl' 
      }) 
      .otherwise({ 
       redirectTo: '/' 
      }); 

}]); 

yönetici index.html

<!DOCTYPE html> 
<html ng-app="adminApp"> 
<head>  
<meta name="viewport" content="width=device-width, user-scalable=no"> 
<title>Web Shop Admin</title> 
<link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"> 
<link href="adminjs/theme/dist/css/sb-admin-2.css" rel="stylesheet"> 
</head> 
<body> 
<div ng-view></div>  
</body> 
<script src="bower_components/jquery/dist/jquery.js"></script> 
<script src="bower_components/angular/angular.js"></script> 
<script src="adminjs/app.js"></script> 
<script src="adminjs/controllers/main-controller.js"></script> 
</html> 
olduğunu app.js benim server.js olduğunu

İşte her-hizmet noktası vardır. İşte

var clientApp = angular.module('clientApp', [...]); 
clientApp.config(function ($routeProvider, $locationProvider) { 
$routeProvider 
     .when('/', { 
     templateUrl: 'partials/main.html', 
     controller: 'MainCtrl' 
     }) 
    .otherwise({ 
     redirectTo: '/client' 
     }); 
    }); 

<!DOCTYPE html> 
    <html ng-app="clientApp"> 
    <head>  
    <meta name="viewport" content="width=device-width, user-scalable=no"> 
    <title>Web Shop Admin</title> 
    <link href="bower_components/bootstrap/dist/css/bootstrap.min.css" rel="stylesheet"> 
    <link href="clientjs/theme/dist/css/sb-admin-2.css" rel="stylesheet"> 
    </head> 
    <body> 
    <div ng-view></div>  
    </body> 
    <script src="bower_components/jquery/dist/jquery.js"></script> 
    <script src="bower_components/angular/angular.js"></script> 
    <script src="clientjs/app.js"></script> 
    <script src="clientjs/controllers/main-controller.js"></script> 
    </html>