angular 页面参数附加到 Safari 中的 url

Question

我有一个 material angular 应用程序。第一页是登录页面，成功登录后会被主页取代。在 Safari 的情况下，我看到的是用户名密码在登录后附加到 url。我不希望发生这种情况，在 chrome 中也不会发生。

登录页面如下所示：

  <form (ngSubmit)="doLogin()">
              <div><input matInput placeholder=" User ID" name="userId" [(ngModel)]="userId" ></div>
              <div><input matInput type="password" name="password" placeholder=" Password" [(ngModel)]="password"></div>

              <div><button mat-raised-button  (click)="doLogin()">Sign In</button></div>
            </form>

login.ts

     userId:string
      password:string

     doLogin(){
 this.errorMessage = ''
    if(this.userId == undefined  || this.userId == ''){
      this.errorMessage = 'Authentication Failed'
      return
    }

    var user:UserModel = this.dataStore.findUser(this.userId.trim().toLowerCase())
    if(user == undefined || (user.password != this.password)){
       this.errorMessage = 'Authentication Failed'
      return
    }

    this.core.currentUser = user.userId
          this.router.navigate(['homepage'])
      }

app.routing.ts

const appRoutes: Routes = [ 
    {
        path: '',
        component: LoginPageComponent
    },
     {
        path: 'homepage',
        component: DynamicHomeComponent
    }

];

export const routing: ModuleWithProviders = RouterModule.forRoot(appRoutes);

登录后，如果使用 safari，url 将变为以下内容： https://myurl/homepage?userid=xxx&password=yyy

Answer 1

问题是您有一个 <form> 标签，它没有正确实现 <form>。如果您想使用表单标签，请在提交按钮上使用 <button type="submit"></button> 语法。这里有一个带有 (click) 方法的按钮，并且在表单标签上有一个 submit 方法。默认提交是一个获取请求，其中 url 参数对应于表单 inputs 是运行因为你的按钮没有 type="submit" 并且有点击事件。

tl;dr => 使用 html 形式的约定或只使用点击事件但不能同时使用两者。

angular 页面参数附加到 Safari 中的 url

angular page parameters get appended to url in safari

angular-routing

material-design

angular-material2

angular

angular6