Changin die Basis-URL von Loopback lb-services.js

Question

Ich versuche, einen Client-Server und einen Rest API Server zu verbinden. Ich benutze angular js am Frontend und Loopback am Backend.

auf der lb-services.js änderte ich Basis-URL zu:

var urlBase = 'http://localhost:3000/api'; 

Mein Winkel js ist läuft auf Port 4000. Aber wenn ich einen Beitrag an den Rest api machen bekomme ich diesen Fehler in meinem Browser :

XMLHttpRequest cannot load http://localhost:3000/api/People. Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:4000' is therefore not allowed access. The response had HTTP status code 404. 

gibt es trotzdem die Verbindung Proxy oder ich kann beide Server zusammen richtig funktioniert?

Das ist mein Zug/server.js:

'use strict'; 

var path = require('path'); 
var gulp = require('gulp'); 
var conf = require('./conf'); 

var browserSync = require('browser-sync'); 
var browserSyncSpa = require('browser-sync-spa'); 

var util = require('util'); 

var proxyMiddleware = require('http-proxy-middleware'); 

function browserSyncInit(baseDir, browser) { 
    browser = browser === undefined ? 'default' : browser; 

    var routes = null; 
    if(baseDir === conf.paths.src || (util.isArray(baseDir) && baseDir.indexOf(conf.paths.src) !== -1)) { 
    routes = { 
     '/bower_components': 'bower_components' 
    }; 
    } 

    var server = { 
    baseDir: baseDir, 
    routes: routes 
    }; 

    /* 
    * You can add a proxy to your backend by uncommenting the line below. 
    * You just have to configure a context which will we redirected and the target url. 
    * Example: $http.get('/users') requests will be automatically proxified. 
    * 
    * For more details and option, https://github.com/chimurai/http-proxy-middleware/blob/v0.9.0/README.md 
    */ 
    server.middleware = proxyMiddleware('/api', { 
    target: 'http://localhost:3000/api', 
    changeOrigin: true 

    }); 

    browserSync.instance = browserSync.init({ 
    startPath: '/', 
    server: server, 
    browser: browser, 
    port:4000 
    }); 
} 

browserSync.use(browserSyncSpa({ 
    selector: '[ng-app]'// Only needed for angular apps 
})); 

gulp.task('serve', ['watch'], function() { 
    browserSyncInit([path.join(conf.paths.tmp, '/serve'), conf.paths.src]); 
}); 

gulp.task('serve:dist', ['build'], function() { 
    browserSyncInit(conf.paths.dist); 
}); 

gulp.task('serve:e2e', ['inject'], function() { 
    browserSyncInit([conf.paths.tmp + '/serve', conf.paths.src], []); 
}); 

gulp.task('serve:e2e-dist', ['build'], function() { 
    browserSyncInit(conf.paths.dist, []); 
}); 

Answer 1

Gibt es trotzdem kann ich Proxy die Verbindung oder machen beide Server zusammen richtig funktionieren?

Es ist überraschend, dass Sie diesen Fehler erhalten, da Loopback CORS standardmäßig aktiviert. Es lohnt sich, die Datei middleware.json in Ihrem Loopback-Server zu überprüfen, um zu sehen, ob cors.params.origin wahr ist. Here ist der Dokumentationslink für Ihre Referenz.

Ich bin mir nicht sicher, wie Sie die URLBase für den Zugriff auf Ihre Rest API geändert haben. Ich hatte es mit der Winkelmodulkonfiguration wie beschrieben here getan.

Answer 2

Sie CORS Unterstützung für Ihre LoopBack API hinzufügen:

https://docs.strongloop.com/display/public/LB/Security+considerations#Securityconsiderations-CORS