AngularJs向Nodejs发送注册数据失败，跨域请求报错求助

看到你遇到的跨域错误，其实核心原因很明确——请求URL缺少HTTP协议，另外还有个小问题是你在Angular请求里加了不必要的跨域响应头，我来一步步帮你解决：

错误原因分析 #

你收到的错误提示：

Failed to load localhost:4000/Register: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

这说明浏览器无法识别你请求的URL协议，因为你写的是localhost:4000/Register，没有加上http://前缀。如果你的Angular页面是直接打开本地HTML文件（file://协议），浏览器会把这个无协议的URL当成当前协议下的路径，直接触发跨域限制。

另外，你在Angular请求的headers里添加的Access-Control-Allow-Origin等头是服务端才需要返回的响应头，客户端请求时添加这些头完全没用，反而可能干扰正常的请求流程。

解决方案步骤 #

1. 修正AngularJS的请求URL和请求头 #

把请求URL改成带http://的完整地址，同时移除那些不必要的跨域响应头：

var request = $http({
    method: "post",
    url: "http://localhost:4000/Register", // 必须加上http://前缀
    headers: {
        "Content-Type": "application/json" // 只保留必要的内容类型头
    },
    data: myJSON
});

request.success(function(data, status, headers, config) {
    $scope.message = data;
    console.log($scope.message);
});

request.error(function(data, status, headers, config) {
    alert("failure message: " + JSON.stringify(data)); // 建议用JSON.stringify查看完整错误信息
});

2. 修复Node.js服务端的事务逻辑 #

你的服务端已经正确使用了cors()中间件，但事务代码里有个小bug：.then(trx.rollback)会导致不管注册成功与否都执行回滚，应该改成用.catch捕获错误再回滚。修正后的注册接口代码：

const db = knex ({
    client: 'pg',
    connection: {
        host : '127.0.0.1',
        user : 'postgres',
        password : '',
        database : 'spdb'
    }
});

const app = express();
app.use(cors())
app.use(bodyParser.json());

app.get('/',(req,res)=>{
    res.send(database.users);
})

app.post('/Register', (req,res)=>{
    const {fname, lname, rollno, section, password, email, role } = req.body;
    const hash = bcrypt.hashSync(password);
    db.transaction(trx => {
        trx.insert({
            hash: hash,
            email: email,
            rollno: rollno
        })
        .into('login')
        .returning('email')
        .then(loginEmail => {
            return trx('users')
            .returning('*')
            .insert({
                fname: fname,
                lname: lname,
                rollno: rollno,
                section: section,
                email: loginEmail[0],
                joined: new Date(),
                role: role
            })
            .then(user => {
                res.json(user[0]);
            })
        })
        .then(trx.commit)
        .catch(err => {
            trx.rollback();
            res.status(400).json('unable to register');
        })
    })
})

app.listen(4000,()=>{
    console.log('app is running on port 4000');
})

额外验证步骤 #

1. 确保已经通过npm install cors --save安装了cors依赖包
2. 确认Node.js服务正在运行，控制台显示app is running on port 4000
3. 尽量通过HTTP协议打开Angular页面（比如用本地服务器托管，而不是直接双击HTML文件）

这样修改后，跨域请求应该就能正常工作了。

内容的提问来源于stack exchange，提问作者S.Arya