Vue與ASP.NET Core Web Api設定localhost與本地ip地址皆可訪問

mingupupup發表於2024-07-24

Vue的設定

我們建立並啟動一個Vue專案,如下所示:

image-20240724091722654

開啟cmd,輸入ipconfig查詢本地ip地址:

image-20240724092321646

想透過本地ip地址訪問,把localhost改成本地ip地址,發現打不開:

image-20240724092439478

這是因為Vue專案預設只有localhost,檢視啟動終端:

image-20240724092543635

這時候就需要進行配置,開啟package.json,在scripts下的dev中加上--host 0.0.0.0:

image-20240724092807126

再次啟動,檢視終端:

image-20240724092941670

這樣子就可以了,透過本地ip訪問服務,如下所示:

image-20240724093139130

ASP.NET Core Web Api的設定

我們建立並啟動一個Web Api,預設也是localhost,如下所示:

image-20240724093829661

直接本地ip地址訪問,也是打不開如下所示:

image-20240724094025454

在Program中加上一行

 builder.WebHost.UseUrls("https://*:7101");

即可,如下所示:

image-20240724094254887

再次啟動,現在透過localhost與本地ip地址都可訪問服務了,如下所示:

image-20240724095630573

相關文章