SAP Fiori 应用上传中文附件的处理问题

简介: SAP Fiori 应用上传中文附件的处理问题

我本地有个文件,名称为

通过 Fiori 应用上传,观察 SAP UI5 应用发起的 HTTP 请求,文件名在 HTTP 请求头部, 被编码成了 %E6%B1%AA

汪的 UTF-8 编码正好是 E6B1AA:

本地选中的文件数据,维护在 oEvent.target 里:

进入 upload 方法:

这里就已经被编码过了:

content-disposition

中文字符的编码,在这里完成:

encodeURIComponent(oFile.name)

在前端开发中,encodeURIComponent 函数通常在处理 URL 参数时发挥着关键作用。这个函数用于将字符串中的特殊字符进行编码,以确保它们在 URL 中能够被正确传递,而不会导致解析错误或歧义。在响应用户输入、构建动态 URL、或与服务器进行通信的过程中,经常需要使用 encodeURIComponent 来确保 URL 的正确性和可靠性。

这个函数的使用场景主要涵盖两个方面:构建 URL 参数和处理用户输入。下面分别从这两个角度进行详细讨论。

构建 URL 参数

在前端开发中,我们经常需要构建包含参数的 URL,尤其是在向服务器发送请求时。URL 参数通常通过查询字符串的形式附加在 URL 后面。这时候,如果参数值中包含特殊字符,比如空格、&、=、? 等,就需要使用 encodeURIComponent 进行编码,以确保这些字符不会破坏 URL 结构。

举例来说,假设我们要向服务器发送一个搜索请求,用户输入的搜索关键词是 “Web Development”。在构建 URL 时,我们需要使用 encodeURIComponent 对搜索关键词进行编码:

const searchTerm = "Web Development";
const encodedTerm = encodeURIComponent(searchTerm);
const apiUrl = `https://example.com/search?query=${encodedTerm}`;

这样,无论用户输入的搜索关键词中是否包含特殊字符,都能够确保 URL 的完整性。

处理用户输入

另一个常见的场景是处理用户输入,尤其是在用户提交表单或输入框中输入内容时。用户可能输入包含特殊字符的文本,而这些字符需要在传递给服务器之前进行编码,以免引起不必要的问题。

例如,用户在一个评论框中输入了以下内容:

Hello, this is a test! How are you?

如果直接将这个文本用作 URL 参数值,URL 将会变成:

https://example.com/comment?text=Hello, this is a test! How are you?

这样的 URL 包含了逗号和问号等特殊字符,可能会导致解析错误。因此,在构建 URL 时,我们需要使用 encodeURIComponent 对用户输入的文本进行编码:

const userInput = "Hello, this is a test! How are you?";
const encodedInput = encodeURIComponent(userInput);
const apiUrl = `https://example.com/comment?text=${encodedInput}`;

这样,URL 就会正确地将用户输入传递给服务器,而不会产生歧义。

总的来说,encodeURIComponent 在前端开发中的使用是为了确保 URL 的正确性,特别是在涉及用户输入或构建包含特殊字符的 URL 参数时。通过正确使用这个函数,我们可以有效地处理各种场景下的 URL 编码需求,提高前端应用的稳定性和可靠性。

相关文章
|
1月前
|
Web App开发 数据采集 前端开发
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
纯技术讨论:如何让 SAP UI5 应用无法被别人在浏览器里调试 - 这种做法不推荐试读版
15 0
|
1月前
|
XML 存储 数据格式
SAP UI5 控件 customData 属性的应用介绍
SAP UI5 控件 customData 属性的应用介绍
31 0
|
2月前
|
Web App开发 前端开发 JavaScript
乱花渐欲迷人眼 - 让 SAP UI5 应用的日志输出不再素面朝天
乱花渐欲迷人眼 - 让 SAP UI5 应用的日志输出不再素面朝天
46 0
|
2月前
|
存储 数据库 容器
深入介绍 SAP CRM 附件存储的底层实现机制
深入介绍 SAP CRM 附件存储的底层实现机制
30 0
|
2月前
SAP UI5 应用如何实现类似百度首页一样的访问方式试读版
SAP UI5 应用如何实现类似百度首页一样的访问方式试读版
35 0
|
2月前
让 SAP UI5 应用的日志打印变得五彩缤纷试读版
让 SAP UI5 应用的日志打印变得五彩缤纷试读版
97 2
|
2月前
|
IDE JavaScript 开发工具
什么是 SAP Fiori tools 的 environment check 功能
什么是 SAP Fiori tools 的 environment check 功能
26 0
|
1月前
SAP UI5 Link 控件的使用方法介绍 - 后续学习 Fiori Elements Smart Link 的基础试读版
SAP UI5 Link 控件的使用方法介绍 - 后续学习 Fiori Elements Smart Link 的基础试读版
15 0
|
1月前
|
UED
什么是 SAP Fiori 的 Technical Catalog 和 Business Catalog
什么是 SAP Fiori 的 Technical Catalog 和 Business Catalog
29 0
|
1月前
|
前端开发 UED
SAP Fiori 到底指什么
SAP Fiori 到底指什么
36 0