CODEWITHSUNDEEP
javascripthtmlnode.jscordovahybrid
김정화
김정화

Reputation: 31

Access-Control-Allow-Origin Error..(using cordova)

I'm trying to web server and client..(Hybrid app! using cordova) But Access-Control-Allow-Origin error..so I downloaded chrome extension program cors.. but doesn't working..

[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>

[error]

The value of the 'Access-Control-Allow-Origin' header in the response must not be the wildcard '*' when the request's credentials mode is 'include'. Origin 'null' is therefore not allowed access. The credentials mode of requests initiated by the XMLHttpRequest is controlled by the withCredentials attribute.

Please Help me...

Upvotes: 1

Views: 13719

Answers (4)

Micaiah Effiong
Micaiah Effiong

Reputation: 89

Try using the cors in you app middleware

app.use(cors());

Upvotes: 1

Rafael M.
Rafael M.

Reputation: 221

This might be related to chrome issue if your cordova is using chrome as a default browser of webview. I've encounter the issue on v76.0.3809.89 of chrome and updating to v76.0.3809.111 solved the Access-Control-Allow-Origin issue.

Upvotes: 1

Praveen Kumar
Praveen Kumar

Reputation: 2014

    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();
});

You can use like this also , may be it will help.

Upvotes: 6

Praveen Kumar
Praveen Kumar

Reputation: 2014

You need to add the whitelist plugin,

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

In config.xml add

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

Upvotes: 7

Related Questions