猿问

没有“访问-控制-允许-原产地”-节点/Apache端口问题

没有“访问-控制-允许-原产地”-节点/Apache端口问题

我使用Node/Express创建了一个小API，并试图使用Angularjs来提取数据，但是当我的html页面在localhost上Apache下运行时：8888，节点API在端口3000上侦听，我得到的是No‘Access-Control-ALL-原产地’。我尝试使用节点-http-代理和VhostApache，但没有多少成功，请参阅下面的完整错误和代码。

“XMLHttpRequest无法加载localhost：3000。请求的资源上不存在”访问-控制-允许-原产地“标头。因此，不允许访问源‘localhost：8888’。”

// Api Using Node/Express    var express = require('express');var app = express();var contractors = [
    {   
     "id": "1", 
        "name": "Joe Blogg",
        "Weeks": 3,
        "Photo": "1.png"
    }];app.use(express.bodyParser());app.get('/', function(req, res) {
  res.json(contractors);});app.listen(process.env.PORT || 3000);console.log('Server is running on Port 3000')


    // Angular code
    angular.module('contractorsApp', [])
    .controller('ContractorsCtrl', function($scope, $http,$routeParams) {

   $http.get('localhost:3000').success(function(data) {

    $scope.contractors = data;

   })

   // HTML
   <body ng-app="contractorsApp">
    <div ng-controller="ContractorsCtrl"> 
        <ul>
         <li ng-repeat="person in contractors">{{person.name}}</li>
        </ul>
    </div>
   </body>


叮当猫咪
浏览 666回答 3
3回答

慕盖茨4494581

尝试将以下中间件添加到NodeJS/Express应用程序中(为了方便起见，我添加了一些注释)：//&nbsp;Add&nbsp;headersapp.use(function&nbsp;(req,&nbsp;res,&nbsp;next)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;Website&nbsp;you&nbsp;wish&nbsp;to&nbsp;allow&nbsp;to&nbsp;connect &nbsp;&nbsp;&nbsp;&nbsp;res.setHeader('Access-Control-Allow-Origin',&nbsp;'http://localhost:8888'); &nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;Request&nbsp;methods&nbsp;you&nbsp;wish&nbsp;to&nbsp;allow &nbsp;&nbsp;&nbsp;&nbsp;res.setHeader('Access-Control-Allow-Methods',&nbsp;'GET,&nbsp;POST,&nbsp;OPTIONS,&nbsp;PUT,&nbsp;PATCH,&nbsp;DELETE'); &nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;Request&nbsp;headers&nbsp;you&nbsp;wish&nbsp;to&nbsp;allow &nbsp;&nbsp;&nbsp;&nbsp;res.setHeader('Access-Control-Allow-Headers',&nbsp;'X-Requested-With,content-type'); &nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;Set&nbsp;to&nbsp;true&nbsp;if&nbsp;you&nbsp;need&nbsp;the&nbsp;website&nbsp;to&nbsp;include&nbsp;cookies&nbsp;in&nbsp;the&nbsp;requests&nbsp;sent &nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;to&nbsp;the&nbsp;API&nbsp;(e.g.&nbsp;in&nbsp;case&nbsp;you&nbsp;use&nbsp;sessions) &nbsp;&nbsp;&nbsp;&nbsp;res.setHeader('Access-Control-Allow-Credentials',&nbsp;true); &nbsp;&nbsp;&nbsp;&nbsp;//&nbsp;Pass&nbsp;to&nbsp;next&nbsp;layer&nbsp;of&nbsp;middleware &nbsp;&nbsp;&nbsp;&nbsp;next();});希望能帮上忙！
0

湖上湖

接受答案是好的，如果你喜欢更短的东西，你可以使用一个插件CORS可供Express.js使用对于这种特殊情况，使用起来很简单：var&nbsp;cors&nbsp;=&nbsp;require('cors');//&nbsp;use&nbsp;it&nbsp;before&nbsp;all&nbsp;route&nbsp;definitionsapp.use(cors({origin:&nbsp;'http://localhost:8888'}));
0

哆啦的时光机

另一种方法是简单地将头添加到路由中：router.get('/',&nbsp;function(req,&nbsp;res)&nbsp;{ &nbsp;&nbsp;&nbsp;&nbsp;res.setHeader('Access-Control-Allow-Origin',&nbsp;'*'); &nbsp;&nbsp;&nbsp;&nbsp;res.setHeader('Access-Control-Allow-Methods',&nbsp;'GET,&nbsp;POST,&nbsp;OPTIONS,&nbsp;PUT,&nbsp;PATCH,&nbsp;DELETE');&nbsp;//&nbsp;If&nbsp;needed &nbsp;&nbsp;&nbsp;&nbsp;res.setHeader('Access-Control-Allow-Headers',&nbsp;'X-Requested-With,content-type');&nbsp;//&nbsp;If&nbsp;needed &nbsp;&nbsp;&nbsp;&nbsp;res.setHeader('Access-Control-Allow-Credentials',&nbsp;true);&nbsp;//&nbsp;If&nbsp;needed &nbsp;&nbsp;&nbsp;&nbsp;res.send('cors&nbsp;problem&nbsp;fixed:)');});
0
随时随地看视频慕课网APP

相关分类

AngularJS
Node.js
我要回答