Ответ 1
Вы обслуживаете html файлы в http://localhost:9000 и приложении NodeJS на http://localhost:27372; поэтому у вас есть проблема с CORS. (Однако этот вопрос не связан с угловыми). Вы должны либо включить CORS для NodeJS, либо обслуживать все приложение в том же домене.
Возможные решения:
1- Включение CORS в сервере NodeJS
Вы можете включить CORS на своей стороне сервера, указав разрешенные корни в заголовке ответа. Эти строки будут включать запросы к вашему приложению из всех доменов. (добавьте это в начало определения функции.)
var server = http.createServer(function(req, res) {
res.setHeader('Access-Control-Allow-Origin', '*');
res.setHeader('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept');
// the rest of the method ...
}
Включение CORS для всего домена не всегда является хорошим решением, пожалуйста, также проверьте .
2- Обслуживание ваших html файлов из приложения NodeJS
Здесь со следующими дополнениями вы будете обслуживать ваши html файлы с сервера NodeJS. (Вам больше не нужно использовать другой сервер.)
var serveStatic = require('serve-static');
var finalhandler = require('finalhandler');
//...
var serve = serveStatic('./path/to/your/static/folder');
var server = http.createServer(function(req, res) {
//...
var done = finalhandler(req, res);
serve(req, res, done);
});
Я также рекомендовал бы использовать ExpressJS для более богатых возможностей сервера вместо ванильного node.js http-сервера.
3. Предоставление прокси-соединения с вашего сервера html файлов на приложение nodejs
Я не знаю, что вы используете в качестве сервера для статических html файлов, но возможно наличие прокси-сервера между вашим статическим сервером на сервере приложений NodeJS.
РЕДАКТИРОВАТЬ 1
Вот базовая реализация для опции 2- Serving your html files from NodeJS application.
В этом примере я использовал ExpressJS. Статические файлы на стороне клиента подаются в общей папке, для отправки запроса на /api/upload url будет загружать файл. Вот код сервера app.js:
var express = require('express'),
path = require('path'),
multiparty = require('connect-multiparty'),
multipartyMiddleware = multiparty(),
PORT = process.env.PORT || 27372;
var app = express();
app.use(express.static(path.join(__dirname, 'public')));
app.post('/api/upload', multipartyMiddleware, function(req, res) {
var file = req.files.file;
console.log(file.name);
console.log(file.type);
console.log(file.path);
});
var server = app.listen(PORT, function() {
var host = server.address().address;
var port = server.address().port;
console.log('the App listening at http://%s:%s', host, port);
});
Теперь папка public подается в корневой URL-адрес. Вот файл клиента public/index.html:
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title>Upload example</title>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.min.css">
<meta name="viewport" content="width=device-width, initial-scale=1, user-scalable=no">
</head>
<body>
<div class="container">
<div>
<h1>Upload example</h1>
<hr />
<div ng-app="fileUpload" ng-controller="MyCtrl">
<button type="button" class="btn btn-default" ngf-select ng-model="file">Upload using model $watch</button>
</div>
</div>
</div>
<script src="https://ajax.googleapis.com/ajax/libs/angularjs/1.4.3/angular.min.js"></script>
<script src="http://rawgit.com/danialfarid/ng-file-upload/master/dist/ng-file-upload.min.js"></script>
<script>
var app = angular.module('fileUpload', ['ngFileUpload']);
app.controller('MyCtrl', ['$scope', 'Upload', function($scope, Upload) {
$scope.$watch('file', function() {
var file = $scope.file;
if (!file) {
return;
}
Upload.upload({
url: 'api/upload',
file: file
}).progress(function(evt) {
var progressPercentage = parseInt(100.0 * evt.loaded / evt.total);
console.log('progress: ' + progressPercentage + '% ' + evt.config.file.name);
}).success(function(data, status, headers, config) {
console.log('file ' + config.file.name + 'uploaded. Response: ' + data);
}).error(function(data, status, headers, config) {
console.log('error status: ' + status);
})
});;
}]);
</script>
</body>
</html>
Теперь вы можете запустить node app и попробовать его на localhost:27372 с вашим браузером.
(Вот версия gist: https://gist.github.com/aksakalli/1a56072f066d65248885)
РЕДАКТИРОВАТЬ 2
Вот базовая реализация для опции 1- Enabling CORS in NodeJS server. Я использую cors для обработки конфигурации заголовка, теперь app.js код будет выглядеть следующим образом:
var express = require('express'),
multiparty = require('connect-multiparty'),
cors = require('cors'),
multipartyMiddleware = multiparty(),
app = express(),
PORT = process.env.PORT || 27372;
app.use(cors());
app.post('/api/upload', multipartyMiddleware, function(req, res) {
var file = req.files.file;
console.log(file.name);
console.log(file.type);
console.log(file.path);
});
var server = app.listen(PORT, function() {
var host = server.address().address;
var port = server.address().port;
console.log('the App listening at http://%s:%s', host, port);
});