0

我正在尝试使用以下 HTML 表单发送表单数据：-

<head>
<meta http-equiv="content-type" content="text/html; charset=UTF-8">
</head>
<body>

<form action="https://test-pubg.sohum.com:4200/securelogin" target="_blank" method="get">
  Access: <input type="text" id="accessToken" name="accessToken"><br>
  Refresh: <input type="text" id="refreshToken" name="refreshToken"><br>
  <button type="submit">Submit</button><br>
</form>

现在每次我单击提交按钮时，都会打开另一个选项卡（这是预期的），其 URL 为：- https://test-pubg.sohum.comt:4200/securelogin?accessToken=test&refreshToken=test

我得到空白的浏览器控制台这是问题

现在，如果我将 URL 更改为以下内容（注意 URL 中添加的 #）并按 F5 重新访问 url：-

https://test-pubg.sohum.com:4200/#/securelogin?accessToken=test&refreshToken=test

我在浏览器控制台上获得了预期的数据，如下所示：-

Angular 正在开发模式下运行。调用 enableProdMode() 以启用生产模式。

构造函数调用

测试

测试

即使在表单的操作方法是 post 的情况下也会发生这种情况

现在在操作 URL 上，我运行了一个 angular 4 服务，其构造函数如下：-

constructor(private route: ActivatedRoute,private router: Router,
private secureloginService: SecureloginService,private http: HttpClient) {
  console.log("constructor called");
  this.accessToken = this.route.snapshot
  .queryParams['accessToken'];
  console.log(this.accessToken);
  this.refreshToken = this.route.snapshot
  .queryParams['refreshToken'];
  console.log( this.refreshToken);

  this.route.queryParamMap.subscribe(params => {
    console.log(params);
  });


 }

我无法在提交按钮单击时发送数据。另请注意，我已为我的应用程序启用 HTTPS。作为参考，我将我的角度路由详细信息发布如下：-

proxy.conf.js

{
"/" : "http://test-pubg.sohum.com:8080",
"secure": false}

组件路由.moudle.ts

const routes: Routes = [
  {path: '', component: SecureloginReceiverComponent},
  {path: 'securelogin/', component: SecureloginReceiverComponent,pathMatch: 'full' }
];
export const SecureloginRoutingModule = RouterModule.forChild(routes);

包.json：-

"start": "ng serve --disable-host-check --ssl 1 --proxy-config proxy.conf.json",

这种行为的可能原因是什么。我已经关注了 stackoverflow 和 github 上的相关线程。寻求帮助，我将不胜感激。

4

2 回答 2

0

所以真正的问题是 HTTP 状态和 URL 中的参数不可用。ActivatedRoute 将能够读取在 URL 中传递的任何内容，即当调用 angular 页面时，查询参数应该在 URL 中可见，然后只有 ActivatedRoute 能够读取数据。其次，我正在制作一个服务器间，即从一个服务器到另一个服务器，所以即使在调用 URL 时是：-

https://test-pubg.sohum.com:4200/#/securelogin?accessToken=abc&refreshToken=cccc

但是在重定向后它被更改为以下内容：-

https://test-pubg.sohum.com:4200/#/securelogin

省略查询参数，使它们在 URL 中不可用。因此，ActivatedRoute 无法读取。因此，作为我发现的解决方案，必须在重定向到OK之前明确设置 HTTP 状态。按照示例代码：-

ModelAndView view = new ModelAndView("redirect:" + appUrl);
view.addObject("usr", userName); 
view.setStatus(HttpStatus.OK);

另一个非常重要的注意事项是这个概念只有在你发出 HTTP GET 请求时才有效。

于 2018-08-29T05:53:37.207 回答
-1

首先，您应该使用Angular Forms<form action ，而不是干扰 Angular SPA 设计的HTML属性。

我认为您的 proxy-conf.json 也无效

你应该试试

{
  "/**": {
    "target": "http://test-pubg.sohum.com:8080", //back-end adress:port
    "secure": false,
    "changeOrigin": true
  }
}

然后，在SecureloginReceiverComponent你应该调用SecureloginService's 方法来发布表单的输入数据（通过方法属性发送）。

无需刷新页面，也无需将输入数据放到 URL 中。

于 2018-08-16T11:36:39.380 回答