同一服务器上的两个项目具有不同的端口,但客户端(Angular 6)无法调用服务器(Spring Boot)

Posted

技术标签:

【中文标题】同一服务器上的两个项目具有不同的端口,但客户端(Angular 6)无法调用服务器(Spring Boot)【英文标题】:Two projects on same server with different ports but client (Angular 6) can't call server (Spring Boot) 【发布时间】:2018-09-27 00:04:52 【问题描述】:

更新

我在一台服务器上放置了两个项目,分别是客户端和服务器 RestAPI 应用程序。我将 4200 设置为客户端的端口(由 Angular 6 编写)和服务器端 WebSrv 的端口 8990。我使用命令java -jar artifact.jar 运行 Spring one,它工作正常并响应任何请求。但是对于客户端,当我使用 IP:localhost:4200(使用 IntellijIdea 内置构建器或使用 Angular CLI)从本地计算机运行它时,它可以正常工作并且可以发送请求并接收响应。但是,当我从该服务器(WebSrv 服务器所在的同一位置)运行它并运行时,它会正确显示第一个 html 页面但是当我单击发送请求的按钮时,什么也没有发生(也没有异常或任何日志)并且服务器不是收到任何请求!

我已经搜索了我的问题,但没有任何帮助。如果有人能帮助我找到解决方案,我将不胜感激。我想知道是否有人知道这是什么问题。

这是我的客户端代码(Angular)

import Component, NgModule, OnInit from '@angular/core';
import HttpClient, HttpHeaders from '@angular/common/http';
import RouterModule, Router from '@angular/router';

// const URL = 'http://localhost:8990/getUserId';
const URL = 'http://getuserid.mycompany.com:8990/getUserId';


@Component(
  selector: 'app-root',
  templateUrl: './app.component.html',
  styleUrls: ['./app.component.css']
)

export class AppComponent 

  constructor(
    private http: HttpClient
  ) 
  

  fileToUpload: File = null;
  id: String = '0';

  inputId(event) 
    this.id = event.target.value;
    console.log('id is -- > ' + event.target.value);
  

  inputFile(event) 
    this.fileToUpload = event.target.files[0];
    console.log('File path -- > ' + event.target.files[0].name);
  

  onSubmit(id: string, file: File) 
    const frmData = new FormData();
    console.log('POST');
    // @ts-ignore
    frmData.append('id', this.id);
    frmData.append('inputPackage', this.fileToUpload);
    console.log('id --> ' + this.id);
    console.log('File name --> ' + this.fileToUpload.name); 
    this.http.post(URL, frmData).subscribe(res => 
      const resp = JSON.parse(JSON.stringify(res));
      if (resp['user'] != null) 
          if (resp['user']['user-id'] === false)  
            alert('Successful!! Your User ID is : ' + resp['user']['user-id']); 
           else 
            alert('Sorry!! Error occurred : ' + resp['error-message']);
          
      else 
        alert('Sorry!! Error occurred : ' + resp['error-message'] );
      
    );

  

这是我的服务器端代码(Spring Boot):

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.*;
import org.springframework.web.multipart.MultipartFile;

import java.io.File;
import java.io.IOException;



@Controller
public class GetUserIdController 
    private final static String DESTINATION_PATH = "/srv/resources/";
//    private final static String DESTINATION_PATH = "/mnt/d/DestPath/";
//    private final static String DESTINATION_PATH = "C:/Resources/Temp/";

    @CrossOrigin(origins = "http://localhost:4200", maxAge = 3600)
    @RequestMapping(method = RequestMethod.POST, value = "/getUserId",  headers = "content-type=multipart/mixed","content-type=multipart/form-data")
    @ResponseBody
    String Response(@RequestParam("inputPackage") MultipartFile[] inputPackages, @RequestParam("id") String id) 

        String response = null;
        String id ; 
        try 

            if (inputPackages != null && id != null && inputPackages.length > 0 && id.length() > 1) 

                ReceivedPackage recvPackage = new ReceivedPackage();
                recvPackage.setPId(id);
                if (inputPackages[0].getOriginalFilename() != null ) 
                    if( inputPackages[0].getOriginalFilename().contains(".zip")) 
                         FileUtils.saveFile(inputPackages[0].getInputStream(),inputPackages[0].getOriginalFilename(), DESTINATION_PATH);
                        recvPackage.setPackageName(inputPackages[0].getOriginalFilename());
                        recvPackage.setPackagePath(DESTINATION_PATH);  
                        recvPackage.setInputPackage(new File ( recvPackage.getPackagePath()));

                        response = GetUserId.runProcess(recvPackage, DESTINATION_PATH, id); 

                    else

                        response = "<error-message>The input file : "+ (inputPackages[0].getOriginalFilename())+" is invalid!!\n It should be a zip file!</error-message>";
                    
                
            else

                response = "<error-message>The ID and valid zip file should be provide!</error-message>" ;
            
         catch (IOException e) 
            e.printStackTrace();
        

        return FileUtils.getJSONFormat(response);
    

提前致谢。

【问题讨论】:

嗨,欢迎来到堆栈溢出。请花时间阅读***.com/help/how-to-ask, 感谢您的评论和帮助。我以前读过它并试图直接问其他地方没有类似的问题。所以请你让我知道我的问题的哪一部分及其描述是不好的或不清楚的,我下次会更加小心。干杯, 您需要更好地描述问题。并提供尽可能多的细节。你现在所说的只是你有两个不工作的项目。我们应该如何处理这些信息? 感谢@PaulSamsotha。我的问题是没有发生错误或异常。当我单击按钮时,没有任何反应。我虽然可能必须为这种情况做一些不同的设置,我的意思是当我想在同一台服务器上但在不同的端口上运行两个不同的项目时。您认为我需要在描述中添加什么以使其更清楚?代码的任何部分或什么?提前致谢 可能详细描述一个特定的请求。你期望发生的事情。 正在发生什么。在此请求期间,您在浏览器开发人员工具中观察到了哪些信息。如果您没有提供足够的信息让我们重现问题,那么我们很难为您提供帮助。这在@core114​​ 提供的“如何提问”链接中列出。 【参考方案1】:

问题是被公司网络部过滤的端口号4200。将端口更改为8080 后运行良好。

【讨论】:

以上是关于同一服务器上的两个项目具有不同的端口,但客户端(Angular 6)无法调用服务器(Spring Boot)的主要内容,如果未能解决你的问题,请参考以下文章

socket.io 客户端可以连接到两个不同的服务器/端口吗?

如何设置虚拟主机以将同一 IP 上的两个端口指向不同的服务器名称?

同一网站空间上的两个域,但通过 htaccess 和 GET 参数具有不同的内容/语言

NodeJS Express - 同一端口上的两个 NodeJS 实例(vhost)

CORS 允许所有在同一服务器上的不同端口在 JAVA 中

如何使用同一端口(使用码头 8)拥有具有多个上下文的 websocket