启用CORS AngularJS以发送HTTP POST请求 [英] Enable CORS AngularJS to send HTTP POST request
问题描述
我想通过将表单提交到我的服务器发送HTTP POST请求，该服务器位于不同的域中（并且使用node.js在服务器脚本中启用cors）。
I want to send HTTP POST request by submitting form to my server, which in a different domain (and enabled cors in the server script using node.js).
这是所有Angular配置的脚本：
This is the script where all the Angular configurations are :
var myApp = angular.module('myApp', ['ngRoute']);
myApp.config(function($routeProvider, $locationProvider, $httpProvider) {
$httpProvider.defaults.useXDomain = true;
delete $httpProvider.defaults.headers.common['X-Requested-With'];
$routeProvider
.when('/', {
controller: 'RouteCtrl',
templateUrl: 'views/home_views.html'
})
.when('/login', {
controller: 'RouteCtrl',
templateUrl: 'views/login_views.html'
})
.when('/register', {
controller: 'RouteCtrl',
templateUrl: 'views/register_views.html'
})
});
myApp.controller("UserController", function($scope, $http) {
$scope.formData = {};
$scope.clickMe = function() {
console.log("Yay");
$http({
method: 'POST',
url: 'http://localhost:8183/user/register',
data: $.param($scope.formData),
})
.success(function(data) {
console.log(data);
if(!data.success) {
console.log("error here");
} else {
console.log("error there");
}
});
}
}); ...
我使用AngularJS 1.2.22和本教程href =http://www.code-sample.com/2015/02/enabling-cors-in-angularjs.html =nofollow> Enable CORS ）启用CORS，需要启用CORS手动在配置。但它仍然不工作。这是我从浏览器控制台得到的。
I'm using AngularJS 1.2.22 and as it stated in this tutorial (Enable CORS) to enable CORS, it needs to enable CORS manually in the config. But it's still not working. Here is what I got from the browser console.
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:8183/user/register. This can be fixed by moving the resource to the same domain or enabling CORS.
我对AngularJS很新，所以任何帮助真的会赞赏指出我犯的任何错误.. 谢谢！
I'm quite new to AngularJS so any help would really be appreciated to point out any mistakes I made.. Thank you!
---- EDIT：添加server.js脚本----
var express = require('express'),
app = express(),
bodyParser = require('body-parser'),
expressValidator = require('express-validator'),
mysql = require('mysql'),
crypto = require('crypto'),
cors = require('cors'),
uuid = require('node-uuid');
var connectionpool = mysql.createPool({
connectionLimit: 1000,
host: 'localhost',
user: 'root',
password: '',
database: 'cloudvm'
});
app.listen(8183);
app.use(bodyParser.urlencoded({
extended: true
}));
app.use(bodyParser.json());
app.use(expressValidator());
app.use(cors());
var user_router = express.Router();
var user_list = user_router.route('/list');
var user_register = user_router.route('/register');
var user_login = user_router.route('/login');
app.use('/user', user_router);
user_register.post(function(req, res, next) {
var errors = req.validationErrors();
if (errors) {
res.status(200);
res.send(errors);
console.log(errors);
return;
}
var data = {
name_user: req.body.name,
email_user: req.body.email,
password_user: req.body.password,
no_telp_user: req.body.no_telp,
company_name_user: req.body.company_name,
address_user: req.body.address,
name_cc_user: req.body.name_cc,
address_cc_user: req.body.address_cc,
no_cc_user: req.body.no_cc,
no_vcv_user: req.body.no_vcv,
expire_month_cc_user: req.body.expire_month,
expire_year_cc_user: req.body.expire_year
};
connectionpool.getConnection(function(err, connection) {
if (err) {
console.error('CONNECTION ERROR:', err);
res.statusCode = 503;
res.send({
result: 'error',
err: err.code
});
} else {
var sql = 'INSERT INTO user SET ?';
console.log(sql)
connection.query(sql, data, function(err, rows, fields) {
if (err) {
console.error(err);
res.statuscode = 500;
res.send({
result: 'error',
err: err.code
});
}
res.send([{
msg: "registration succeed"
}]);
connection.release();
});
}
});
});
解决方案
谢谢你的答案，但我已经设法在我的服务器脚本（运行在Node上）启用CORS，然后我试图使用
Thank you for the kind answers, but I've managed to enable CORS on my server script (running on Node) then I tried to use this
headers: { 'Content-Type': 'application/x-www-form-urlencoded' }
b $ b
在我的客户端脚本当http请求被调用，然后它终于让我得到服务器的响应，没有CORS问题！所以，我认为这可能是标题问题..所以，谢谢你的回应！希望这将有助于任何人在未来有这个问题！
on my client-side script when the http request is called, then it finally let me to get response from the server without having the CORS problem! So, I thought it might be the header problem .. So, thank you for kind responses! Hope this would help anyone having this problem in the future!
推荐答案
这是我如何做CORS在快速应用程序，关于OPTIONS，因为对于一些框架有2个CORS的调用，第一个是OPTIONS，它检查可用的方法，然后有实际的调用，OPTIONS需要只是空的答案 200 OK
That's how I do CORS in express applications, you have to remember about OPTIONS because for some frameworks there are 2 calls for CORS, first one is OPTIONS which checks what methods are available and then there is actual call, OPTIONS require just empty answer 200 OK
allowCrossDomain = function(req, res, next) {
res.header('Access-Control-Allow-Origin', '*');
res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');
if ('OPTIONS' === req.method) {
res.send(200);
} else {
next();
}
};
app.use(allowCrossDomain);
这篇关于启用CORS AngularJS以发送HTTP POST请求的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
