I currently have a scenario where I'm running into an issue with CORS when I try to co

Hi <a class="user-mention notranslate" data-hovercard-type="user" data-hovercard-url="

CORS issue when connecting to DevTunnel about dev-tunnels HOT 4 CLOSED

microsoft commented on September 1, 2024 2

CORS issue when connecting to DevTunnel

from dev-tunnels.

Comments (4)

mb236 commented on September 1, 2024 1

Hi @klvnraju,
I double checked and it seems that was really an issue with the CORS settings on my ASP.NET Core service.

In my case I tried to use wildcard subdomains (e.g. "https://*.devtunnels.ms") and there are two things that I was missing:

You need to explicitly call SetIsOriginAllowedToAllowWildcardSubdomains() to allow for the use of wildcard subdomains
At the time of writing wildcard subdomains cannot contain a wildcard port. So a wildcard like this: https://*.devtunnels.ms:* (to allow for a random port) will resume in an error. In my case I just provided the port that I wanted to the wildcard e.g. https://*.devtunnels.ms:4200 and than it started working.

This issue can be closed from my end as it is not an issue related to Dev Tunnels. It just something to keep in mind while one is setting up CORS configuration 😄

from dev-tunnels.

Plevi1337 commented on September 1, 2024

Were you able to solve this somehow? I'm running into the same issue.

from dev-tunnels.

klvnraju commented on September 1, 2024

Did you add access-control-allow-origin header for your server?

I am trying to repro this issue with this sample code and things seems to be working as expected.

Below is the nodejs server code which adds CORS header. (Update the origin to the client tunnel address and make sure this is anonymous tunnel)

const express = require('express');
const cors = require('cors');
const app = express();

const ingredients = [
    {
        "id": "1",
        "item": "Bacon"
    }
];

// Update this with client tunnel url. Change it to '*' if you want to allow all
app.use(cors({
    origin: 'https://qjrvmwhh-5070.usw2.devtunnels.ms'
}));

app.get('/ingredients', (req, res) =>{
    res.send(ingredients);
});
app.listen(6069);

And below is a simple client index.html to call this api. (Update the server tunnel url)

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8">
        <title>Home</title>
        <script type="text/javascript">
            fetch("https://qp1bckqj-6069.usw2.devtunnels.ms/ingredients").then(req => req.text()).then(console.log)
        </script>
    </head>
    <body>
        <div class="container">
            <h1>Home</h1>
        </div>
    </body>
</html>

And note the access-control-allow-origin header that server responds with.

from dev-tunnels.

klvnraju commented on September 1, 2024

Glad to hear that. Closing the issue.

from dev-tunnels.

CORS issue when connecting to DevTunnel about dev-tunnels HOT 4 CLOSED

Comments (4)

Related Issues (20)

Recommend Projects

React

Vue.js

Typescript

TensorFlow

Django

Laravel

D3

Recommend Topics

javascript

web

server

Machine learning

Visualization

Game

Recommend Org

Facebook

Microsoft

Google

Alibaba

D3

Tencent