% 符号在每次重新加载时在 URL 中编码为 %25答案

【问题标题】：% symbol encoded to %25 in URL every reload% 符号在每次重新加载时在 URL 中编码为 %25
【发布时间】：2017-07-01 15:50:49
【问题描述】：

% URL 编码代码 %25 (http://www.w3schools.com/tags/ref_urlencode.asp)

首先;

http://localhost:4200/members/http%3A%2F%2Flocalhost%3A8080%2FErPApI%2Forganizations%2F1/detail

当导航此 URL 并再次重新加载页面或复制粘贴新标签页链接时

% 再次编码 %25。每次重新加载都会做。

http://localhost:4200/members/http%253A%252F%252Flocalhost%253A8080%252FErPApI%252Forganizations%252F1/detail

所以我丢失了会员 ID。如何再次阻止编码 %？

【问题讨论】：

标签： spring angular spring-data-rest angular2-router3

【解决方案1】：

我将提供者自定义 UrlSerializer 添加到根 AppModule。

像这样……

// custom-url-serializer.ts
import { DefaultUrlSerializer, UrlSerializer, UrlTree } from '@angular/router';
export class CustomUrlSerializer implements UrlSerializer {
    private defaultUrlSerializer: DefaultUrlSerializer = new DefaultUrlSerializer();

    parse(url: string): UrlTree {
        url = url.replace(/\%/g, '%25');
        return this.defaultUrlSerializer.parse(url);
    }

    serialize(tree: UrlTree): string {
        return this.defaultUrlSerializer.serialize(tree).replace(/%25/g, '%');
    }
}



// app.module.ts
import { NgModule } from '@angular/core';
import { CustomUrlSerializer } from './shared/custom-url-serializer';

@NgModule({
    declarations: [
        AppComponent,
    ],
    imports: [
        ...
    ],
    bootstrap: [AppComponent],
    providers: [
        {
            provide: UrlSerializer,
            useClass: CustomUrlSerializer,    // <-- Here!
        },
    ],
})
export class AppModule { }

【讨论】：

【解决方案2】：

我在获取链接时使用了以下方法。

 decodeURIComponent()

【讨论】：

你在哪里用过这个方法？