`

angularjs 控制器不能访问nodejs 3000端口,跨域访问

 
阅读更多

目前做的一个项目,前端采用的是angularjs,后端nodejs做服务器。

我尝试使用接下里的方式来发起对nodejs服务器的请求:

$http.get('http://localhost:3000/')  
               .success(function (data) {  
                 $scope.index = data;  
               })  
               .error(function (data) {  
                  $scope.index = "";  
               });  

服务器端如下:

var app= require('express');  
/* GET home page. */  
app.get('/', function(req, res, next) {  
    res.send("hello world");  
});  

使用IE11浏览器,能够成功返回hello world,但是Firefox和Chrome却不能,F12打开调试器,发现是跨域访问造成的,属于浏览器保护机制。

 

我的解决办法是,是使用CORS( 跨域资源共享(Cross Origin Resource Sharing,CORS)解决跨域问题的好,从而可以使用XHR从不同的源加载数据和资源。)

//nodejs服务端跨域访问设置 

在app.js里写:

app.use(function(req, res, next) {  
    res.setHeader('Access-Control-Allow-Origin', '*');  
    res.setHeader('Access-Control-Allow-Credentials', true);  
    res.setHeader('Access-Control-Allow-Methods', 'POST, GET, PUT, DELETE, OPTIONS');  
    next();  
});  

 然后Firefox和Chrome就可以访问了。

 

 

分享到:
评论

相关推荐

    AngularJS+ NodeJS

    标题中的“AngularJS+NodeJS”表明我们正在讨论一个结合了两种强大技术的项目或教程。AngularJS是Google开发的一款前端JavaScript框架,用于构建交互式的单页应用(SPA)。而Node.js则是一个基于Chrome V8引擎的...

    angularjs+nodejs例子

    1. **AngularJS基础知识**:AngularJS的核心特性包括数据绑定、依赖注入、指令、过滤器和服务。数据绑定使得视图与模型之间的同步变得简单;依赖注入帮助管理对象间的依赖关系;指令扩展了HTML,使其能够表达更多的...

    nodejs+angularjs+bootstrap框架

    其中,AngularJS的模块、服务和控制器可能会在`.js`文件中定义,Bootstrap的CSS和JavaScript文件会被引用以实现布局和交互。 3. `views` - 可能包含EJS或Pug等模板引擎编写的HTML页面,这些页面将与AngularJS配合...

    nodeJs 跨域请求

    在Web开发中,由于浏览器的同源策略限制,前端页面通常无法直接向不同源的服务器发起HTTP请求。但随着技术的发展,"跨域请求"已成为常见的需求,例如前后端分离的项目架构。在这个场景中,`Node.js`作为一个强大的...

    chatty:聊天示例(Ionic、AngularJS、Socket.IO、NodeJS)

    "Chatty: 聊天示例"是一个项目,它结合了Ionic框架、AngularJS、Socket.IO和NodeJS,创建了一个实时的、交互式的聊天应用。这个项目为开发者提供了一个学习和实践这些技术如何协同工作的实例,特别是对于构建移动和...

    NodeJS+MongoDB+AngularJS WEB开发原版

    在前端部分,AngularJS的核心概念如指令、服务、过滤器和控制器将被详尽解析。读者将学会如何利用AngularJS的数据绑定机制构建动态视图,以及使用路由实现页面导航。书中也会涵盖指令的自定义和模块化开发,以及使用...

    showcase:车辆展示-使用AngularJS,LESS,Gulp,NodeJS,express和MongoDB构建

    Gulp //需要nodeJS 业力 茉莉花 量角器 后端 节点JS 表示 猫鼬 MongoDB的 3.构建过程 默认任务 gulp JavaScript缩小 gulp js Javascript linting gulp jshint 生成CSS编译文件 gulp css 监视文件以进行更改并...

    chat_Nodejs_Angularjs:与Nodejs和Angularjs进行网络聊天

    与Nodejs和Angularjs进行网络聊天 这是学习NodeJ并将先前获得的AngularJS知识付诸实践的一个小练习。 运作中 服务器以“ node app.js”开头,应该在项目文件夹中。 输入“ localhost”或“ localhost:80”。 要...

    recipes:用于 angularjs 配方 spa 和中间件(nodejs、web api 等)和持久后端的 Git 存储库

    6. **持久化后端**:持久化后端指的是能够保存数据并在应用重启后仍能访问这些数据的存储系统。在这个项目中,可能是通过数据库(如 MySQL、MongoDB)或者其他数据存储服务(如 AWS S3)来实现的。 7. **Git 存储库...

    CRUD with Nodejs_nodejs_crudWITHnODEJS_angularjs_

    文件"CRUD with Nodejs"可能包含示例代码、教程或者项目的结构,用于演示如何在Node.js和AngularJS环境中实现CRUD操作。通过学习这个主题,开发者可以掌握如何构建交互式的Web应用,实现前后端数据的动态同步。对于...

    ylsislove#make-a-little-progress-every-day#nodejs-服务端解决跨域问题1

    nodejs-http请求头和响应头// 设置允许跨域的域名*代表允许任意域名跨域//跨域允许的请求方式参考链接NodeJs中Ajax跨域问题分析Node.js

    contactlist:使用 AngularJS、MongoDB、Express 和 NodeJS 的全栈项目

    联系人列表如何跑步1 从以下位置安装节点: : 2.安装express库。 这是提供静态文件所必需的:> npm install express 3. 从 mongodb.org 下载 mongodb 并安装在您的主目录中(将 mongo.version 重命名为 mongo) 4....

    [nodejs,mongodb,angularjs2]我的便利贴

    1.目的:学习nodejs连接使用mongodb,用angularjs2展示数据 2.使用技术: 数据库: mongodb 后端数据获取: nodejs 前端数据展示: angularjs2 3.应用: 纯mongodb CURD操作: http://127.0.0.1:3000/mongodb/ 便利...

    nodejs服务部署在服务器本地不能访问问题

    nodejs服务器部署在服务器,外网不能访问问题

    linux安装nodejs

    - 使用`rz -y`命令上传文件,如果提示找不到命令,需先执行`yum -y install lrzsz`来安装`lrzsz`工具。 - 或者使用`wget`命令直接在Linux终端下载,例如:`wget ...

    MESN (MongoDB Express AngularJS Nodejs)英文书籍2014以后出版共8本(一次下载)

    MESN (MongoDB Express AngularJS Nodejs)英文书籍2014以后出版共8本, 打包成一个档,以节省大家的时间。 Express in Action - Writing, building, and testing Node.js Applications (Manning 2016).pdf Express....

    nodejs搭建本地服务器轻松解决跨域问题

    跨域问题通常发生在浏览器的安全策略之下,限制了JavaScript从一个源(协议+域名+端口)发送Ajax请求到另一个源。然而,开发过程中经常需要在不同源之间进行数据交互,这时就需要解决跨域问题。 首先,让我们了解...

    Node.js MongoDB AngularJSWeb开发.part2

    Node.js MongoDB AngularJSWeb开发.part2

    angularjs CURD Example

    通常,你会在控制器中调用这些方法,将返回的数据绑定到视图中。 3. **更新(Update)**:更新数据通常涉及PUT或PATCH请求。如果你使用ngResource,你可以直接修改模型对象的属性,然后调用`$save()`方法。这会自动...

    Node.js检测端口(port)是否被占用的简单示例

    在实际应用中,你可能需要设置一个最大尝试次数,或在找不到空闲端口时抛出错误。 总结来说,这个简单的Node.js示例展示了如何使用`net`模块检测端口是否被占用,以及在找到空闲端口后如何启动服务器。这个技巧对于...

Global site tag (gtag.js) - Google Analytics