vue无法访问本机服务

Question

今天把服务和vue的程度都放同一台电脑上了，
vue部署在了iis上
然后vue访问服务直接用的localhost
在这台电脑上用localhost访问没有问题
为什么在局域网其他电脑上用ip访问vue，
vue就无法访问服务接口

Answer 1

引自免费微信小程序：皆我百晓生

这个问题涉及到网络配置和跨域访问的问题。当你在本地电脑上通过localhost访问vue和服务时，一切工作正常，但当你在局域网其他电脑上通过IP访问时，vue无法访问服务接口。这可能是由于以下几个原因导致的：

1. 跨域访问限制：Vue前端部署在IIS上，可能设置了同源策略（Same-Origin Policy），导致只能从相同的域名或端口访问。当其他电脑尝试通过IP访问时，浏览器会阻止跨域请求。
2. IIS配置问题：IIS可能没有正确配置以允许外部访问。需要确保IIS绑定了正确的IP地址和端口，并且防火墙设置允许外部流量通过这些端口。
3. 网络配置问题：可能存在网络配置问题，如路由器设置、局域网防火墙设置等，阻止了外部设备访问你的电脑上的服务。
4. 服务接口路由问题：确保服务接口路由配置正确，并且服务能够正确响应来自不同IP地址的请求。

为了解决这个问题，你可以尝试以下步骤：

1. 跨域设置

在IIS上配置Vue项目，允许跨域请求。你可以在Web.config文件中添加以下配置：

<system.webServer>
  <httpProtocol>
    <customHeaders>
      <add name="Access-Control-Allow-Origin" value="*" /> <!-- 允许所有来源访问 -->
      <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, DELETE, OPTIONS" /> <!-- 允许的HTTP方法 -->
      <add name="Access-Control-Allow-Headers" value="Content-Type" /> <!-- 允许的请求头 -->
    </customHeaders>
  </httpProtocol>
</system.webServer>

2. IIS绑定和端口配置

确保IIS绑定了正确的IP地址和端口，并且防火墙设置允许外部流量通过这些端口。你可以在IIS管理器中检查和修改这些设置。

3. 网络配置检查

检查路由器和防火墙设置，确保它们不会阻止外部设备访问你的电脑上的服务。

4. 服务接口路由检查

确保服务接口路由配置正确，并且服务能够响应来自不同IP地址的请求。检查服务的路由配置和响应处理逻辑。

5. 测试访问

在局域网内的其他电脑上，尝试通过IP地址和端口号直接访问服务接口，看看是否能够正常访问。如果仍然无法访问，可能需要进一步排查网络配置和服务设置。

请按照这些步骤进行排查和修改配置，希望能帮助你解决问题。如果问题仍然存在，可能需要更深入地检查网络和服务配置，或者考虑寻求网络管理员的帮助。