question-mark
Stuck on an issue?

Lightrun Answers was designed to reduce the constant googling that comes with debugging 3rd party libraries. It collects links to all the places you might be looking at while hunting down a tough bug.

And, if you’re still stuck at the end, we’re happy to hop on a call to see how we can help out.

Can't connect to server because of CORS (Reason: CORS header ‘Access-Control-Allow-Origin’ missing)

See original GitHub issue

This is my app.module.ts:

import { SocketIoModule, SocketIoConfig } from 'ngx-socket-io';

const config: SocketIoConfig = { url: 'http://localhost:4000', options: {} };

@NgModule({
  declarations: [AppComponent, MapComponent],
  imports: [BrowserModule, HttpClientModule, SocketIoModule.forRoot(config)],
  providers: [],
  bootstrap: [AppComponent],
})
export class AppModule {}

this is my server:


const server = require('http').createServer();
const options = {
  origin: '*',
  methods: ['GET', 'POST'],
};

server.listen(4000, () => {
  console.log('Server ready....');
});

const io = require('socket.io')(server, options);

io.on('connection', (socket) => {
  console.log('Connected');
  socket.emit('data', JSON.stringify(data));

});

This is how I am trying to get data from socket server in my service:


  getMarkers(): Observable<IMarker[]> {
    return this.socket.fromEvent<string>('data').pipe(map((data: string) => JSON.parse(data)));
  }

Every time I open localhost:4200 I get CORS error:

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:4000/socket.io/?EIO=3&transport=polling&t=NReqqZ8. (Reason: CORS header ‘Access-Control-Allow-Origin’ missing).

Don’t know what to set here to make CORS works:

const options = {
  origin: '*',
  methods: ['GET', 'POST'],
};

Issue Analytics

  • State:closed
  • Created 3 years ago
  • Comments:5

github_iconTop GitHub Comments

6reactions
k-matticommented, Jan 10, 2021

I fixed CORS issue by adding this to config in my app:

SocketIoModule.forRoot({
      url: 'http://localhost:4000',
      options: {
        withCredentials: false,
      },
    }),

server:

const server = require('http').createServer();
const options = {
  cors: {
    origin: '*',
  },
};

const io = require('socket.io')(server, options);

io.on('connection', (socket) => {
  console.log('Connected');
});

server.listen(4000);

But still on app start i am not connected to socket, can’t see connected in the console

0reactions
Helvegcommented, Jan 10, 2021

Any errors? You’d have to show us the code you use to connect to the server, but a better place for troubleshooting is on other community channels like StackOverflow.

Read more comments on GitHub >

github_iconTop Results From Across the Web

Reason: CORS header 'Access-Control-Allow-Origin' missing
The response to the CORS request is missing the required Access-Control-Allow-Origin header, which is used to determine whether or not the ...
Read more >
3 Ways to Fix the CORS Error — and How the Access-Control ...
Reacting to this special request, the server sends back a response header. This header contains an Access-Control-Allow-Origin key, ...
Read more >
CORS header 'Access-Control-Allow-Origin' missing
This happens generally when you try access another domain's resources. This is a security feature for avoiding everyone freely accessing any resources of ......
Read more >
Fixing "No 'Access-Control-Allow-Origin' Header Present"
"No 'access-control-allow-origin' header present" is one of the least helpful error messages. So, what is it and why is it breaking your web ......
Read more >
What Is a CORS Error and How to Fix It (3 Ways) - Bannerbear
A CORS error occurs when the server doesn't return the CORS headers required. ... you can add the missing header like Access-Control-Allow-Origin: *...
Read more >

github_iconTop Related Medium Post

No results found

github_iconTop Related StackOverflow Question

No results found

github_iconTroubleshoot Live Code

Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start Free

github_iconTop Related Reddit Thread

No results found

github_iconTop Related Hackernoon Post

No results found

github_iconTop Related Tweet

No results found

github_iconTop Related Dev.to Post

No results found

github_iconTop Related Hashnode Post

No results found