Access-Control-Allow-Origin错误..(使用cordova)

时间:2018-04-20 09:01:19

标签: javascript html node.js cordova hybrid

我正在尝试使用网络服务器和客户端..(混合应用程序!使用cordova) 但Access-Control-Allow-Origin错误..所以我下载了chrome扩展程序cors ..但是没有工作..

[server.js]

var app = require('express')();
var http = require('http').Server(app);
var cors = require('cors');
var io = require('socket.io')(http);

// io.set('origins','*:*');

io.on('connection', function(socket){
  console.log('a user connected');
  socket.on('weather_location', function(msg){
    socket.emit('message', msg);
  })
});

http.listen(80, function(){
  console.log('listening on *:3737');
});

[index.html的]

<!DOCTYPE html>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="initial-scale=1.0, user-scalable=no">
<meta http-equiv="Access-Control-Allow-Origin" content="*">
<html>
<head>
    <title>location_weather</title>
    <script src="http://code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="http://code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
    <!-- <script type='text/javascript' src='/socket.io/socket.io.js'></script>   -->
    <script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/2.1.0/socket.io.slim.js"/>
    <!-- <script type="text/javascript" src="./js/socket.io.js"/> -->
    <script type="text/javascript" src="https://openapi.map.naver.com/openapi/v3/maps.js?clientId=irru1vaga0dOPnfgy29o&submodules=geocoder"></script>  
 <!--    <meta http-equiv="Content-Security-Policy" content="default-src 'self' data: gap: https://ssl.gstatic.com 'unsafe-eval'; style-src 'self' 'unsafe-inline'; media-src *; connect-src ws://example.com wss://example.com"> -->
</head>
<body>
    <button id="weatherBtn" onclick="weather_location();">클릭</button>
</body>

</html> 


<script>
    var socket = io.connect('http://202.31.200.138:80');
    //var socket = io();ttp
    $(function (){
        //var socket = io.connect('http://202.31.200.138:3330');

        socket.on('message', function(data){
            console.log(data);
            alert(data);
        });

    });

    function weather_location(){
        alert("hello");
        socket.emit('weather_location','message');
    }
    // function location_weather(){
    //  if(navigator.geolocation){
    //      navigator.geolocation.getCurrentPosition(function(position){
    //          alert("위도 : " + position.coords.latitude + "tt" + position.coords.longitude);
    //      }, function(error){
    //          console.error(error);
    //      },{
    //          enableHighAccuracy : false, 
    //          maximumAge : 0, 
    //          timeout : Infinity
    //      });
    //      socket.emit('weather_location',position.coords.latitude );
    //  } else {
    //      alert("GPS를 지원하지 않습니다.");
    //  }

    //      //return false;
    // }


</script>

[错误]

&#39; Access-Control-Allow-Origin&#39;响应中的标题不能是通配符&#39; *&#39;当请求的凭据模式为&#39; include&#39;时。起源&#39; null&#39;因此不允许访问。 XMLHttpRequest发起的请求的凭证模式由withCredentials属性控制。

请帮助我......

4 个答案:

答案 0 :(得分:5)

您需要添加白名单插件

https://github.com/apache/cordova-plugin-whitelist

在config.xml中添加

<!-- will not stop any calls -->
<access origin="*" />

答案 1 :(得分:5)

    app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
    next();
});

你也可以这样使用,也许会有所帮助。

答案 2 :(得分:1)

如果您的cordova使用chrome作为Webview的默认浏览器,则这可能与chrome问题有关。我在chrome v76.0.3809.89上遇到了问题,并将其更新为v76.0.3809.111已解决了Access-Control-Allow-Origin问题。

答案 3 :(得分:0)

尝试在您的应用中间件中使用cors

app.use(cors());